Virtuoso’s luxury trips are tailor-made by travel experts, offering a very personalized experience for each person. Despite their premium service, users have no easy way to manage their trip on the go, or to view details of their itinerary in one convenient place. Their clients have requested this feature, and since it will be frequented on a mobile device, I decided to make a companion app to their main browser-based service. For prospective and current clients of Virtuoso, my design challenge was this:
What would a trip management feature look like?
Ideally, this app would improve the confidence of its users and give them useful information to make their trip more enjoyable, increasing the likelihood that they will be a repeat customer.
Project Type
Mobile iOS App
Role
Researcher, UX/UI Designer
Skills
Research, Product Roadmap, UX/UI Design, User Testing
Duration
Four weeks (2020)
Research
By speaking with real people and collecting available data online, research allowed me to rapidly learn more about the design challenge, the industry, and some opportunities to make an enjoyable end product.
Talking to customers
I conducted remote interviews and asked participants about their experiences booking travel and/or using a travel agent. All of those interviewed travel for leisure on a regular basis, and take trips requiring booking multiple services (flights, hotels, etc.). By asking open-ended questions about their experiences and motivators, I identified their needs, wants, and pain points to uncover opportunities for improvement when considering the design of the Virtuoso mobile app. Here are some of the questions I asked:
What was the last trip that you went on? Tell me the steps you took to plan it.
What are your frustrations with the booking process? What could have made it easier?
Tell me about any travel-related apps (or services) that you use.
Tell me about your experience working with a travel agency. What were your goals?
What information would you expect to have access to while on a trip?
Customers wanted many of the same things:
The need for all of their confirmations and reservations in one place.
They want rapid responses from their agent.
They need control over their activities and destinations.
Customers want transparency in pricing.
Looking at the competition
I found key players and competing apps in the travel industry to identify their strengths and weaknesses. Analyzing the design and architecture of popular apps helped me uncover common patterns and treatments to help direct the design of Virtuoso’s app. One example, Journy, is below:
To compete, the Virtuoso app should have these features:
Create a quote: opportunity to make the process less intimidating and easy to understand by breaking up into steps.
Manage a quote: opportunity to organize info and preferences in an engaging way, as well as encouraging communication with the agent.
Travel tools: opportunity to give users the information they need at their fingertips, along with easy access to their agent.
The travel market
Market research helped me get a broad picture of the state of the industry, trends, and the expectations of users.
I found some useful data points:
Millennial’s desire for convenience may drive up the use of agents.
Younger generations expect mobile convenience and a refined customer experience.
Agents can do more to demonstrate their value by promoting discounts and being transparent with pricing.
Combining the expertise of an agent with the convenience of a mobile app may be a sweet spot for many users.
Define
In order to understand what I needed to design, I needed to fully understand the user. I took a linear approach and completed each step of this process in order (I think my brain works best this way). I created a persona from information gathered in my interviews, and placed them inside the customer journey of Virtuoso’s current customer experience. Doing this allowed me to think through the entire booking and travel process. The journey tracked multiple aspects of a user’s path from browsing trips to traveling to post-trip, and presented opportunities for the role of the app in this process.
View fullsize
Click to enlarge
What will it be like to use the app? Competitive analysis was very helpful here. Creating user flows helped me define the experience for the user, decide how the app would be organized, and look for ways to implement the features that I found were important to customers.
Click to view full flow
Design
Developing a persona, customer journey, and user flow, allowed me to start the design process. Sketches helped me get ideas out quickly, and to consider the actions a user would take on each screen, and where they could be placed. I included interaction notes to demonstrate functionality that could not be drawn. I included more than one variation of certain screens if I thought there were multiple ways to accomplish the same task. Testing would later help confirm or challenge my instincts.
I chose a general design direction from those initial sketches. Building these allowed me to see the actual size of elements on the screen, and to make additional sizing and spacing considerations.
Click to view wireframes
Wireframe Testing
It was important to test my wireframes with users before any final design decisions were made. Using remotely-moderated testing, I had the opportunity to see how other people used the app and find opportunities for improvement.
Tasks:
Send a message to your agent
Find reviews on the cafe you plan to visit
Look up your flight info for tomorrow
Start planning your trip for next year
Figure out what the plan is for day four of your trip
Results:
Users demonstrated understanding of how critical trip information is organized.
Users may search for locations via the itinerary, not the map.
There is more that can be done with the final product to leverage interactivity and intelligently populating certain content in certain places.
Need more benchmarking to decide where to place “Start new trip” button.
High-Fidelity Designs
After sketching, wireframing, and testing, it was time to build the high-fidelity UI design.
Testing
After the high fidelity designs were complete, it was time to test them. I created an interactive prototype using Invision, created tasks for users to complete, and received feedback with remotely-moderated sessions.
These tests didn’t go how I expected, but provided some great insight into how people might use this app. The most common hangup was viewing a location on the map. Some people went to the map, and some to the itinerary. In either case, clear paths need to be developed so the user knows what to expect.
Users were easily able to find the past trip, and the reviews for Croatia Cafe. Most people weren’t sure if the Upcoming trip card was actionable, so adding a cta (primary or secondary) may help to clarify. Also, removing the three-dot button.
Overall people liked the visual design, users said it was readable and comfortable. The biggest issue was navigation. When I built the prototype, I didn’t anticipate all the paths that a user could take to get to the same place, so this has been a good lesson in empathy and the importance of testing!
Design Revisions
Based on my user feedback from testing, I made a few design and navigation changes to the app.
Using cards - The Explore tab didn’t group information together effectively, and provided minimal value to the user when skimming. Using cards to group the information helped to both visually distinguish groups of info, but also allowed for more granular detail per item.
Map navigation - Users found the map controls confusing, both in whether they were actionable, or where they went. I attempted to simplify both the controls and the look and feel to reduce confusion.
Trip overview card - Updates here included adding a share action, which a couple users mentioned would be helpful to them. I also placed all the points of interest from the itinerary on the map for an “at-a-glance” view, and removed all extraneous information.
Conclusion
Being a traveler myself, I felt motivated to get the details of this project right. There are many areas that I would want to continue to explore, such as the agent chat feature, and how a user would create a new trip with an agent. I enjoyed the challenge of designing for the touchscreen. I could not depend on things like hover states, and navigation is handled differently than on the desktop. Adding a feature to an existing brand also kept me sensitive to the visual language of the company while keeping in mind their business goals.