Mobile App Design
Case Study:
WING
Travel Booking
My Role: UX/UI Designer, UX Writer
Timeline: 3 Weeks
Solo Project
Tools: Figma, Miro, Google Suite
WING is a travel booking app for travelers on a budget wanting to research and book vacations. The app provides a broader selection of safe and budget-friendly options for flights, car rentals and hotel stays.
Problem: People enjoy taking vacations. However, finding safe, reliable and affordable options can be frustrating.
Goal: We want to create an app that offers users a way to research hotels and travel destinations in more detail as well as offer more low budget alternatives for booking vacations.
Business Opportunities: Attract new customers and take advantage of the base already using online booking websites in the travel industry.
USER RESEARCH
Interview Notes
I started by brainstorming ideas of the pain points users might encounter while making travel plans. From those ideas, a 13 question user survey was formulated.
Affinity Diagram
Based on the feedback from the user interviews, the data was simplified into 3 main categories.
Empathy Map
The results were also organized into the various ways that a user would react during the booking process as well as while on vacation. These discoveries were noted in the Empathy Map to determine the User Persona.
User Persona
The User Persona is based on the needs and wants of a father booking a family vacation.
DEFINITION & IDEATION
User Insight
Jimmy Nielson, a caring husband and father of three children needs to book a safe and affordable vacation for his family. He wants plenty of activities and to explore new places. His hope is that this will be a bonding experience creating lifelong memories.
Problem Statement
Jimmy needs a hotel and location that is safe for his family. He is also concerned about the cost and needs to find budget friendly travel deals for his party of five. He wants to relax and have quality time with family, but also have everyone enjoy fun activities.
Solution
WING’s booking app allows users to research, compare and book affordable dream vacations more easily resulting in an enjoyable and stress free experience.
MoSCoW Method
In order to determine which features should be the focus for the app, I analyzed the users priorities in relation to impact using the MoSCoW Method.
Value Proposition
The Value Proposition Canvas further detailed what the User Persona, Jimmy, would be considering when booking his family vacation. This information helped narrow down which features users would need and want from a booking app.
User Scenario
Creating a User Scenario shows a real life narrative portraying Jimmy’s thoughts while he plans a family trip.
PROTOTYPING
Competitor Analysis
Prior to starting the low fidelity sketches for the prototype, I analyzed 4 competitors. I found that each of the sites prioritized certain features over another. This information inspired me to develop a target audience and marketing strategy for the app. Each of the competitors had some UX issues. I wanted to improve upon those shortcomings for the WING app.
Task Flow: WING Onboarding Process
The task flow for the onboarding process starts with a brief Splash page to introduce the user to the app. It follows a typical sequence and guides the user step-by-step for creating an account in order to search and book travel options. Expanded View
Wireframe Sketch
The low fidelity prototype sketch outlines and details the steps for signing up for a WING account and booking a trip through the app.
Mid-Fidelity Prototype
The mid fidelity prototype further refined the process. When this was complete it was ready for Guerilla testing.
USER TESTING
Guerilla Testing
The test has users complete 2 tasks. This information was analyzed to determine any confusion or road blocks they may have encountered during the activity.
2x2 Matrix
The results of the Guerilla testing were collected, analyzed and categorized into a 2x2 Matrix. The data showed that there were several areas that could be redesigned, such as the discount code, that would resolve confusion for the user.
High Fidelity Prototype
The high fidelity prototype included images, color and the addition of a progress bar.
CONCLUSION AND FUTURE OPPORTUNITIES
The Research Process
The User Research is a very detailed and structured process. The benefits of performing these tasks will result in a better final product and avoid potential costly mistakes for the company. Beginning with the Ideation Process for a product is imperative. I realized that it doesn’t matter how unique or creative an app is, it will not be profitable if there is no interest in it. Keeping this in mind as I decided on the main features for WING helped to establish a common user and the company’s point of view.
The Prototyping Process
Designing the sequence of frames for the onboarding and booking for the WING app required meticulous planning. It is very easy to take for granted the thought process of every step that goes into designing an app. Researching and comparing several competitors proved to be immensely helpful with this task. Testing the competitor sites as a user revealed features that worked well and warranted implementing for the WING app, as well as paint points to avoid.
Final Thoughts
The UX/UI process for the WING App required a combination of creativity and structure that needed to work together in order to design the best product, while keeping both the user and stakeholder in mind. Working this balance was both a challenging and rewarding aspect of UX/UI Design that I continually strive to improve upon with each project.
Future Opportunities for WING
There are several opportunities to improve the WING app. Enhancing the UX/UI experience by adding more micro animations during the process will further help the user understand when they need to go to the next step or for confirmation of a task. Additional features for travel could be recommendations for unique travel destinations as well as an expanded listing of lesser known airline carriers that offer more affordable flights.
