Building a Travel Planning Application
As part of my coursework during Spring 2024 for the Human Computer Interaction program at DePaul University, my team and I iterated through the entire design process over the course of 8 weeks to create an travel planning application where users are able to plan a trip and collaborate with their group members.
Summary
UX Researcher & UX Designer - Entire product design, including conception, visualization, and testing
Role
Methods: User Interviews, Contextual Inquiries, Work Activity Affinity Diagram, Personas, Hierarchical Task Analysis, Design Scenarios, Storyboards, User Flows, Prototyping, Wireframing, User Testing
Tools: Figma, Mural
Methods & Tools
Empathize
Define
Ideate
Prototype
Test
Process Overview
Design Process
01
Empathize
Domain of Inquiry
After discussing with the team about possible topics, we honed in on
Gen Z adults traveling on a budget with a group.
Before conducting interviews, I created an inquiry plan, which included a contextual inquiry, where the interviewer would observe users starting the process of planning a trip, including how they communicate with other group members and how they start creating an itinerary. The second part of the inquiry plan included follow-up questions to fill in any gaps. We conducted 11 interviews over the course of a week.
Interview Questions
How do you communicate with the group?
What resources do you use to track information?
How are tasks delegated?
How do you handle conflicting preferences?
Interview Insights
Catering to everyone’s preferences and budgets is difficult
Lack of communication by some members impedes planning
Staying informed of updates is hard
Keeping track of information is also difficult
User Interviews
02
Define
After the interviews, we converted the raw interview notes to work activity notes and used those to create a Work Activity Affinity Diagram. This aided us in being able to organize key takeaways and identify the common pain points.
Work Activity Affinity Diagram (WAAD)
Using the quantitative and qualitative data from interviews and the WAAD, I defined the two target profiles Amanda (Nurse, 25), Kush (Grad Student, 23) to better empathize with our main user groups and prioritize goals according to their needs.
User Personas
We created a Hierarchical Task Analysis (HTA) to visualize the steps that a user currently takes in order to plan their trip, starting with communicating with their friends and ending with sharing booking information. We utilizing our findings from the interviews to create this, and this allowed us to be able to find ways that our solution could help alleviate frustrations that users have.
Hierarchical Task Analysis (HTA)
03
Ideate
Design Scenarios & Storyboards
Once we extracted requirements, we created design scenarios for each of the personas to visualize how each person would be utilizing the new application. Correlating with the design scenarios, we also drafted storyboards for each persona.
Amanda
After a long shift at the hospital, Amanda decided that she needed to plan her next vacation to have something to look forward to. Since she now has a full-time job after graduating nursing school last year, she is able to take some time off to travel and also has a bit more spending money to finance that. Although she has a job now, she has some student loans to pay off, so she needs to be mindful about how much she is spending on these trips. Amanda was scrolling through TikTok when she saw a video about Ireland and decided that would be her next destination. She put in some keywords on TikTok to gather a bit more information and also asked around to see if anyone she knew had gone before and had any advice. Amanda also did a quick search on Skyscanner to see if there were any flight deals coming up.
The next day, she was talking to her college friends over FaceTime, and they said they would love to join her on this trip. She invited her friends to join her on this new application, where they could message each other while also being able to keep track of the itinerary. Amanda sent out a survey built out in the application so that she was able to keep track of her friends’ preferences and budgets because that was previously a struggle.
Once she received the survey results, she was able to plan an itinerary that outlined activities day-by-day, as well as who would be participating in those activities, and her friends joining her on the trip were also able to view everything. She felt better prepared being able to see what each day entailed for the trip that also kept her friends’ interests in mind.
Goal: Amanda wants to be able to gather the interests and budgets of her friends and be able to see the results in an organized manner so she can better plan the trip.
Kush
Kush, a second-year graduate student in Chicago, IL, has been busy keeping up with his big project while also thinking of going on a trip to Iceland for winter break. With his academic commitments, he is not able to be a planner and prefers to be brought along for the ride, often leaving the planning to his friends. As his friends share a lot of information through multiple platforms such as Instagram, text messages, etc., he mutes a group chat to avoid getting distracted. When he finally gets to view the messages to catch up with information, he gets overwhelmed with things to go over, which can cause him to lose track of important details.
While he appreciates his friends planning out the trip, he is worried that what is being booked by his friends may not fit his budget since he is a college student and prefers the cheaper options. He sometimes wishes his friends had the same taste and mindset for the trip, but he thinks that is a lot to ask.
This time, he decides to explore other options and stumbles across an app where he could find friends who already have plans and share the same mindset and budget for a trip. While eating lunch at university, he scrolls through the app and sees one of his friends who has a plan that stands out to him. He reaches out to him, and they establish going on the trip together. Kush is really happy about the trip since he did not have to worry about missing information while he is working on his schoolwork.
Goal: Kush wants to find a friend who already a trip plan that suits his budget and preferences
Based on extracted requirements, design scenarios, and storyboards, we created a User Flow to better inform us while we sketched our low fidelity wireframes in the next phase.
This flow was created only for the Amanda persona based on feedback received in earlier stages. We decided it was best to choose one persona to create the MVP around. Due to Amanda being the planner and the one more likely to extensively use the application, we chose to keep her as the main persona.
User Flow
04
Prototype
Wireframing
Sketches
Low-Fidelity Wireframes
Create a Plan
Create a Survey
View Survey Results - 2 Paths
Open Chat & Pin Important Messages
05
Test
Testing Plan
I created a testing plan, which included obtaining informed consent, a scenario to base the tasks around, a task list, and a set of follow-up questions. We conducted usability testing with two participants.
Scenario
You are planning a trip with your friends for later this year to Ireland. You are still in the early stages of planning, but you would like to know what your friends are interested in for the trip. You are looking to create a plan that the rest of your friends can see, as well as gather their interests before you start planning further.
Task List
Create a plan for a trip and add three users.
Create a survey, with one question with three options for activities and one open-ended question for dishes they would like to try. Send the survey to members in your trip group.
View the results of the survey you created.
View the chat of the trip plan and pin the itinerary message
Follow-Up Questions
How did you feel about our app overall? What did you like and dislike about it?
Was there any part of either task that was difficult or something unexpected that you encountered?
Did you find either of the features useful and why?
Are there any features that you would like to see?
Findings & Recommendations for Redesign
Finding
When we asked the participants to do the third task (view the results of the survey), both had difficulty locating it.
Recommendation
Notifications should be trip plan specific rather than an overall notification system for the whole application
Solution
Removed the bell icon in the top right corner of the “My Trips” page
Added red notification icons to the Trip Plan, as well as where the notification is coming from in the Trip Plan. In this case, it was added to the Survey card to view survey results.
Notification Change
Before
After
Finding
One of the participants mentioned the itinerary section not having a category of “Dining” or “Food”.
Recommendation
Add a dining/food section in the itinerary to help track of food to try or reservations
Solution
Under the “Itinerary” section, “Dining” was added below “Transportation”
Dining Section
Before
After
Given that more people are traveling every year, it is a ripe market to help people plan out their trips and be able to get out there. As the aim for this project was to learn and implement the different steps of the design process, we did not do any competitive analysis to see comparable applications and how they have implemented features even though many applications like this do exist.
Due to time and group constraints, we were unable to implement as many features as we would have liked. Additionally, we hoped to conduct more user testing in order to have a better picture about where we could improve the application.
Conclusion
If there was more time available…
Map Integration
This improvement was mentioned by a user during testing, and we think this would be useful to visualize where different activities or accommodation may be located where you are visiting.
Browse Trips Tab
This was initially a requirement tied to Kush’s persona, but we decided to focus on just Amanda for the MVP. This tab would allow users to browse trips that are being planning, either by their friends or strangers and allow them to contact the group and / or join them.
Banking / Finance Integration
This feature was mentioned in interviews, as well as user testing. Due to time constraints, we were not able to implement this, but it would have allowed users to track expenses and calculate what is owed to whom.
Lessons Learned
Use Data to Back Your Decisions
Previously, I may have assumed what would be a good feature based on what I thought or may have had preconceived notions, but through this process, I learned it is important for your decisions to be backed with data, whether that be through interviews or user testing. I made much more informed decision based on what users stated they wanted or where they thought we could improve.
Interview Questions Worded Differently
I am still working on creating interview questions that do not seem so directed and biased. I think that throughout the process, I improved and aimed to ask more neutral questions.
Increased User Testing
Due to the small group size and the time constraints, we were unable to conduct usability testing for a larger number of users. Next time, I would be more proactive in recruiting participants.
Improved Visual Design
We did not establish a style guide, which would have been helpful when further developing wireframes. Additionally, our final wireframes were still low- to medium-fidelity. The final product may have benefitted from further development, but due to the time constraints of the course, we were unable to further design the application.