Increasing User Engagement on Skyscanner’s hotel booking experience through influencer Live Moments feature
Starting this new year off with a bang, I participated in a hackathon event that took place as a part of my UX Mastery course, brought to me by GrowthSchool. The Product Design Challenge was hosted by my mentor Anudeep Ayyagari a.k.a UX.Anudeep and built by the hard working volunteer students of the UXM Community. This challenge lasted for 48-hours with 170 participating students all working on 14 apps trying to implement 23 different features!
In this challenge participants worked in groups of 6 to 10 students who would work on one shared app, each participant would introduce their own feature in the app. Sounds like any basic hackathon right? Close, except there was one thing that was like no other hackathon.
In an ever evolving world, where designers have started to resent AI for doing the same thing faster and cheaper, has made people fear for their livelihood. However our mentor Anudeep used this challenge as an opportunity to teach his students how to adapt to using Chat GPT as a tool instead of a threat.
The Challenge
The event opened with a call with our mentor Anudeep, where he explained the challenge expectations and what would be the deliverables at the end of the 48-hours.
Each participant had to introduce a new feature that would address the business metrics for the hotel bookings service the app provides. At the end, all participants would need to have created UI screens with our new features. Also a presentation of our reasonings along with comparisons to the apps original screens.
My group worked on the Skyscanner app, which provides booking of flights, hotels and cabs services all over the world. After much deliberation with my group members I was able to convince them why introducing the Influencers sharing Live Moments with users feature on the app was a good choice for me. I was very much intent on this feature because while there were some obvious implementations that came to mind initially, I wanted the chance to explore deeper applications of this feature.
Problem Statement
Now comes the fun part, using prompts we leveraged Chat GPT to create a problem brief that would encompass the core idea of the feature, how the feature would impact the business metric and how the feature would help the users.
With the help of Chat GPT I was able to to finalize my own problem brief:
Skyscanner aims to create a feature that will allow influencers to share ‘Live Moments’ with users to create a more authentic and real representation of the hotels promoted on the app. The core of this feature is to provide the users and the influencers a safe and unfiltered view of the adventures and experiences provided by hotels across the globe.
The impact this new feature will have on the business of the app stems mainly from the User Engagement that this new feature will create. As a result increasing the Influencer Participation from users and eventually creating a path for Skyscanner to Monetize on the influencers participation on the app.
Constraints:
- Privacy and safety of the influencers and users
- Understanding the legality of using influencers to market hotels
- Developing the app to handle the interactivity of the users and influencers.
With all this in mind, assumptions can be made based on intuition and AI resources. The influencer feature has the potential to become a main selling point of the hotels on the app. This feature provides the users with the chance to explore a different view into the experiences of the influencers in the best hotels around the world, that is more realistic and authentic.
Final Solution
After some secondary research, wireframing and user testing I was able to create the final UI and a prototype. I have built the UI in such a way that the user can take two journeys:
Flow 1— Home Page → Search Page → Hotels Page → Moments Page
Flow 2 — Home Page → Moments Page
The first flow is focused on catering to the new users of the app. The home page has a carousel of trending live moments to introduce the users to the influencers, the users will see more of the influencers on the Hotels Page.
- Live Moments feed carousel
- Moments icon and button on the bottom navigation bar
On the Hotels Page in the form of recommendations the influencers have been integrated with the use of review cards. The review cards are shown in a carousel, with filter chips which can be used to suggest the hotel most suited for the users needs. Finally there is a floating call to action button in the bottom left corner, this will redirect the user to the Moments Page.
- Hotel Card
- Filter Chips
- Influencer Review Cards
- Floating CTA Button
Only the Home Page and the Hotels Page came from the original UI, the remaining pages were created for the influencers and the users to interact with each other and the app.
From here we are taken to the Moments Page, except there are two ways to get to the Moments Page. When you enter from the Home Page you see a different Moments Screen and when you enter from the Hotels Page you see another Moments Screen.
When the user enters the Moments feature from the Home Page they see a map of the most popular locations to travel. Then below the map is a carousel of Trending Hotels in locations around the world. This page also provides access to the Saved reviews, the option to Explore more and the Camera button which will redirect the user to the Content Creation Page.
The second Moments Page shows reviews/ moments shared by influencers for the location the users were looking at on the Hotels Page. This feature was made so that the users can continue their journey for a Hotel in their chosen location, without having to search their location again.
Moving on to the Content Creation Page, I wanted the users and influencers to be able to navigate the page and its features without difficulty. Thus I created the page to mimic other social media apps with content creation pages. With access to upload images, edit, add effects and select the location/ hotel the image was taken in.
Lastly I made a Profile Page for the users to get to know the influencers, this is also a safe space for the users to directly interact with the influencers with the use of the message feature in the bottom right corner. This page also holds a collection of all the reviews and moments the influencers have shared on the app from other locations, interested users can follow the influencer from here.
These pages illustrate my ideas of how I would introduce the influencers live moments feature to the app in order to address the business metric of Conversion of users by increasing the User Engagement with the app, also to increase Influencer Participation with the app.
Research
At the start of the challenge, before we all selected our features, I explored the app to get a better understanding of what the app does and how users are already using the app. Once I had selected my feature and had built my problem statement brief, I preformed some secondary research about the direct and indirect competitors.
Direct competitors:
- Expedia
- Kayak
- Orbitz
- Agoda
- Trivago
- Momondo
From the research I was able to figure out that none of the apps have anything similar to this feature. Which was great for the business as there would be no competition and Skyscanner would be able to explore the application of this feature freely.
Indirect competitor:
- Tik Tok
- Snapchat
- YouTube
I studied the apps that would be competitors for this specific feature, as most influencers are found mainly on these apps. I wanted to understand how the influencers are using these apps to build their brand and then thought about how to provide those similar features in the Skyscanner app.
Assumptions
Once I was done with the research I made a few assumptions that would help me ideate and build my wireframe like:
- Users are in need of a feature that can show them an authentic and unfiltered view of what the hotel stay is like before they book anything.
- Users who have doubts will generally look at the hotels reviews to see what other guest experience was like, this feature will give the users someone they can trust to tell the truth.
- Users know of or follow influencers on other apps, they understand that influencers would hesitate to put their reputation on the line for fake reviews.
I then turned to Chat GPT to confirm my assumptions, using the prompt: “Assumptions to be taken into account beforehand” in continuation of my first prompt. The answers I got helped me feel secure in my own assumptions, that there was indeed a demand for this time of feature among Skyscanner users. Also that influencers would be willing to participate in the program, even without monetary reward. On the business end, this feature can easily be implemented in a cost-effective way with no negative impacts to the users experience on the app.
Ideation and Wireframe
Once I had reason to be confident that this feature would benefit the users, influencers and the business. I started thinking about application.
- I thought about adding the influencer feature to the home page itself, however this path I abandoned really early because it would distract the users from the task at hand. Users would generally come to the app to book a hotel so distracting them would be counter productive.
- In the second idea I thought about having an overlay open on the home page, that would not redirect the user and still introduce the feature. However I saw that this would have limited applications and I wanted to go deeper with the application of this feature.
- The third idea was the introduction through live moments feed for the users to explore from the home page itself.
- The fourth idea is to implement the influencers in the hotels page by providing reviews, call outs or recommendations.
- The fifth idea is to create the content creation feature for the influencers, that would function like a typical photo taking app.
In the end I took three of the ideas and blended them together to create a feature with multiple widgets and elements to help improve the users experience and how the influencer will use the app as well.
Once the wireframes were done I started creating a testable prototype, I did not want to spend too much time on the first screens since there will most likely be changes after the user testing.
Usability Testing and Iterations
Now that my prototype was ready for testing it was time to find users to interview. How does one find enough users for 170 participants to interview? Junior batch volunteers!! As the UXM Community grows with more incoming students, we had our pick of juniors who were eager to help out their seniors.
Going into the usability testing I had a plan to observe what the users did and said. I asked the users to speak out loud what they were thinking and what they noticed.
Walking away from the testing with feedback from 4 users I was able to validate some assumptions and also some flaws that emerged.
Validations:
- My assumption that users would follow the first flow of exploring the hotels page first and then finding the moments page was validated.
- The assumption that users already know how to use photo taking features in other apps, so the functionality of the content creation page was easily understood by the users.
Flaws that emerged:
- On the hotel page the users were not able to distinguish if the recommendations were for the influencers or the hotels.
- On the moments page the users confused the heart icon for a widget to add the location to their favorites page, the heart icon is a button to be redirected to the saved page.
- The users did not understand the explore button on the top of the page would lead back to the home page
- Users were confused why the ‘see more’ button leads to the feeds page, they were expecting to see more details about the review.
- I observed that the users were not very interested in the feeds page, as it does nothing to enhance their experience even though they understood what the page did.
- On the content creation page the users understood how the page works, however a few users had difficulty understanding the use of the editing tools that were available.
With the feedback in mind, I went on to create proper UI screens with the changes that I felt were needed.
Iteration after usability testing
Below I have given a side by side comparison of my changes:
- Changed the text size to make it more readable and added the slashed price.
- Removed the ‘close’ option that was present in the original design, didn’t want to provide the option to hide the influencer reviews.
- In order to address the confusion about the review, I added the profile picture at top of the review but made the hotel primary to the review.
- I swapped the tabs for chronological order, the moments tab is default.
- Added the word ‘Saved’ under the icon so that It would become more clear that this is a button to see previously saved reviews
- I added the moments icon with the word ‘explore’ under it to hint at the function, allows the user to explore more reviews
- I added an empty heart for every review card, the intention behind this is to indicate if the review has been saved or not is dependent on fill.
- I moved the home button to the bottom left corner.
- I change the camera button to a CTA button on the bottom right, this is more visible and easily reached with one hand.
- I added text under all the editing tools for clarity
- Added the word ‘gallery’ as it seemed that the image in the box was not a clear indicator of use.
- Changed the image to represent the ‘effects’ as the previous choice was not clear at all.
- Added a follow icon that allows the user to keep up with their favorite influencers
- Chat option created to allow the users the option to talk to the influencers privately.
For last iteration, I removed the page completely and added a Profile Page for the influencers to showcase their reviews and a space for the users to interact with the influencers.
Conclusion
Now that we have reached the end of the 48-hour challenge, all the participants created a presentation to helps them illustrate their work best. I can confidently say that I have introduced the feature in a clear and use friendly way. I am optimistic about the future of this feature and how it will effect Skyscanner’s business growth if implicated.
Future scope
- I would build a feed/ For You page allowing the users to see a randomized collection of uploads for specific locations and also trending locations.
- I would build the chat/ direct message feature from the profile page, really allowing the users to get feedback about a hotel stay before they choose to book
- Soon enough the app would be able monetize the posts and reviews and create a revenue system for the influencers and the business.
- On the Hotels Page, when the user taps on the recommendations the user will be redirected to the hotels detail page, I would create a carousel of other influencers who have stayed at the same hotel.
Key learnings
- Time management is an important skill, with good pace all tasks can be completed in the allotted time.
- Assumptions help to create, however you need to be open to the possibilities that your assumptions don’t work. Being quick to adapt is important skill to have.
- When conducting usability testing its just as important to notice what the users are not doing and are not noticing, more then what they did notice and commented on.
🙏 Welcome to the end of the line, thank you for reading my case study 🙏
I would like to thank my group members for their feedback in all the stages of this challenge. I would also thank my friends Aparna R, Omkar and Smita Srivastava for helping me when I hit blocks in my process.
I would especially like to thank my family for their patience as I hid behind my computer screen for 48-hours, your support made it possible to do this.
