Embedded Files
Design Challenge
Design Challenge
A lot of people love to travel and explore places they haven't been to before. However, airfare is expensive, and planning trips can be time-consuming. There are so many airline websites and mobile apps that travelers use. However, it is difficult to keep track of the best airfare deals and manage flight reservations all in one place.
Smiley Jean Travel is a new airfare booking app that wants to solve travelers' frustrations with finding flight deals, booking those deals, and managing those flight reservations. They want to make sure that they are solving the right user problems and offering a product that is easy to use and useful to travelers who are budget conscious. They hired you as their UI/UX designer to help them conduct user research, ideate, prototype, test, and design a mobile app that caters to these types of travelers and their specific needs.
EMPATHIZE
Research Method: User Interviews (In-person)
I interviewed 6 friends who love to travel and asked them questions about their travel preferences so that I could get an understanding of their wants, needs frustrations, and goals.
I asked the following questions:
1. was the last time you traveled by airplane? Where did you go?
2. How do you decide what city and country you want to travel to?
3.what technique have you used to save money on airfare?
4.What challenges have you faced when booking flights online?
5.what website or app do you use when making travel plans? What are the pro and cons of using these websites or apps?
PERSONA
DEFINE
Problem Statement:
A lot of people like to travel but finding a good deal with flight, hotel, and rental car together is a challenge on one website. Smiley Jean Travel need to looking for a solution to help people find a package that can save their time while booking a flight.
Who – Who experiences the problem?
Lisa
What – What is the problem?
Price of the airline
Where – Where does the problem occur?
When she booked the airfare online
Why – Why is it important to solve this problem?
So Lisa can travel to the country she wants to go
IDEATE
Based on the design challenge, I brainstormed the following ideas for “how a travel app can help you save money when booking flights online”
PROTOTYPE
Based on the ides I brainstormed, here are the wireframes created to test the idea for: mobile home page, search, ticket, and user profile.
I want to show how users can search on the flight, use their ticket when they board, and review their purchases and memories after the trip.
TEST
Task Scenario
Your friend from Taiwan is always telling you how beautiful the country where she came from. Therefore, you want to visit her during May and your budget is under $2000 for a round trip from JFK to TPE. Due to a very long-distance flight, you want to book a direct flight to the country. When you complete the journey, you also want to share the photos and common about your trip. Please book a flight that fits your budget, date, and requirements.
Usability Test Report
Summary
I conducted a user testing session with 5 people using moderated, in-person testing. I showed the 4 mobile designs on iPhone and gave the task scenario to be complete in 20 mins. All of the participants were able to complete the task successfully within the time limit.
Findings
The 5 participants were able to tell me where to enter the information needed for booking flights and how to book them. One common from Participant 2 was that the post and note link to social media like Facebook or IG. Therefore, it can attract more people who want to visit the same place. As a result, I believe my design was well received based on user feedback.
Recommendations
Because participant 2 had feedback regarding the connection with social media. An action to improve the design is to connect my app with social media and make sure users have no problem linking both apps. I plan to update the designs and do another round of testing to test the links with both apps.
Show Travel App Designs and Design Rational
Smiley Jean Travel
“Nothing but smiles for miles”
Home Screen
Home Screen
Why did you design it this way?
I want users feel like vacation while they searching on the flight deal. Therefore, my design is simple and easy to use. The users can navigate the app with great deal while they search on the flight.
What user research insight made you choose this design direction?
Most of user knew where they want to go and they just want to find a good deal on the flight, so Smiley Jean Travel let them search on the deal directly. However, some users don’t know where they want to go or they just browning on the deal. Therefore, Simile Jean Travel gave the users other option to find out their dream destination with good deal. .
How can this design solve the issues your target users are currently facing?
My target user are looking for the cheaper price for the flight. The user can put down their budget by searching on the flight deal directly or just simply finding a discount price while they browning their dream destination. In addition, the users can save more by join the membership.
What visual design elements and principles did you choose to incorporate and why?
In my app, I leave a lot of white space on each section and also used the light blue color, so the user will feel more relax while they use the app. I use bold front for the promotion slogan, “Become a Member to save 10% of your trip.” With the red button of “Join” it gave a focal point of entire page. Although the front is small, but it will attracted the users to join the membership. I use rectangle shape with picture of dream destination, with the shadle behind the picture, it will make each dream destination stands up more.
What important user feedback influenced your design decisions (if any), and how did you incorporate it?
Budgeting and easy to navigate are the most feedback when I interviewed people how they book the flight. Therefore, I tried to incorporate it by narrow down two ways to help people to find out the deal. When people search on the flight, they can put down the budget so the app will take them to the flight deal that is under the users budget. The users can also select their dream destination with discount price, so they can find out a better deal on their trip. Moreover, The user can also click on the bell next to their dream destination so the users will get notification when the discount deal come out.
Search Screen
Search Screen
Why did you design it this way?
I want users sees all of the deals at once after they input all of the information on the request. The user will have clear idea what airline offer cheaper price, and how long is the destination. It will also show how many stop in the middle of the flight. Therefore, the user can plan their trip better.
What user research insight made you choose this design direction?
People who use my app want to find a great deal of the flight under their budget. Therefore, Smiley Jean Travel app list up of the price on the airline with detail. Therefore, the user can pick and choose what is the best deal for them.
How can this design solve the issues your target users are currently facing?
My target user are looking for the cheaper price for the flight Most of them have to check from one website to another to compare the price with travel detail all by themselves. Smiley Jean Travel app list all of deal under the users maximum budget request. Therefore, the users can compare the price with different airline and pick up the best deal for their trip.
What visual design elements and principles did you choose to incorporate and why?
In the top of my app, i used simple rectangle for the user to fill up the information that they request so it is easy for users to fill up the information that they need to searching for the airline deal. When the search result come out, I use line to separate each airline deal. Therefore, the user will not confuse the information with different airline deal. I continue keep the red join button in this page, so it gives attention for the user that they can sae 10% of their trip for join the membership.
What important user feedback influenced your design decisions (if any), and how did you incorporate it?
My main goal for this app is to help the user finding the best deal for the airline. By list up all of deal under the users budget for the airline, the user can keep their budget and choose their favor airline or deal they want go to.
Bookin screen
Bookin screen
Why did you design it this way?
This is the stage of people trying go on board. On top of the picture, it is not only give people the feeling that they are about to go to the trip but it also remind people the time, the map, passport and luggage.
Below the picture, it is the user’s boarding pass. It shows all of detail for the airline ticket. It also shows the barcode for the flight attendant to scan their ticket. Travel can be very stressful, with this app on the hand, the user do not need to looking for boarding pass. They can just simply pull out the app, and click on the ticket button, then the boarding pass will shows out on their hand easily.
What user research insight made you choose this design direction?
Smiley Jean Travel app is design for simply and easy use for the user. After the users purchase the ticket, it will shows their boarding pass on the app. With this boarding pass, the user will know clearly all of detail of their flight information.Therefore, they can arrange their schedule better before they arrived at the airport
How can this design solve the issues your target users are currently facing?
Boarding on the airline can be very stressful task for some people because it require a lot of work such as carry a luggage, bring passport, being on time at the airport…etc. Therefore, Smiley Jean Travel understand the pain point of the user travel in the airport. We want the user feel less stress about traveling so we include the boarding pass in the app. Therefore, the user doesn’t need to looking for the boarding pass before they onboard.
What visual design elements and principles did you choose to incorporate and why?
I design this page like ticket, so people feels like holding a boarding pass when they on board. I left some space between the ticket and background, and also add shadow behind the ticket. Therefore, it looks like a real ticket. I also left some space for the boarding pass so it doesn’t look so clutter with all of information in one ticket. I make the designation font bigger than other front, it gives hierarchy of the ticket. Moreover, the user will also notice where they go once when they open the ticket.
What important user feedback influenced your design decisions (if any), and how did you incorporate it?
Many travel app doesn’t include with the flight ticket. When the user finally rush to the airport, the boarding pass is always the major concern that they have to worry about. Some people have to looking through the email to find out their booking information. Others have to spend extra time to print the ticket before they arrived at the airport. Smiley Jean Travel app incoperate their boarding pass in the app, so the user never have to looking for their boarding pass again. It just one click, their boarding pass is on their hand.
Profile Screen
Profile Screen
Why did you design it this way?
The user profile including the user’s information, how many flights, miles and countries the user had been travel. In this page, the user can review their travel history with the price they paid when they booked the ticket. Therefore, they can compare the ticket price in the past if they tried to book the flight with the same destination now. Moreover, the user can also leave the notes and photos for their travel experience so it will bring back the memory if they book the same flight with same destination.
In the profile page, the users can add or delete notification on their target dream destination.The app will send the notification to the user if there is a discount come out so the user can consider booking the deal with discount and save money.
What user research insight made you choose this design direction?
After the user complete their travel experience, they always want to go back and review their travel experience and how much they spent. In the user profile, it not only show’s the history where the user travel, but also keep the notes and price where the user purchase the ticket. The user might want to revisit the same destination again if they had a good memory with good deal. In addition, the users keep alarm on the destination they want to go to. They might consider book the flight when there is a sales goes on.
How can this design solve the issues your target users are currently facing?
The user profile record all of history where the user travel. Many user didn’t remember the travel deal they pick before. Therefore, the user can find out not only how many countries they had been to but also the memory and the price of their deal for their next trip.
What visual design elements and principles did you choose to incorporate and why?
In this profile, each trip is like a card separated so it organized each trip from the past. The user can find out their trip easily by scrolling down each card. I leave space between each card so the user won’t feel clutter by searching on each trip.
What important user feedback influenced your design decisions (if any), and how did you incorporate it?
Many user had great time on their trip but most of them didn’t remember what deal they got for the flight from last trip. In Smiley Jean Travel, the users are not only can review their past trip but also review what deal they got when they book the flight. Moreover, it notify the user when there is a good deal come out. Therefore, it will help the user save money on their next trip..
Report abuse