TirpAid is a startup company that is committed to making a real difference to ease people’s life. Their business goal is that building a travel planner platform in three months to fill the gaps and improve the users’ user experience to deal with the explosion in the tourism industry after the pandemic.
Most planner apps on the market today focus on personal business and were barely for users to build a travel plan together. I found that it's hard for users who like to travel with others to find a specific collaboration planner platform for them.
18-35 years old
Travel with others
12 weeks
Sole UX/UI designer
People fail to find an effective way to build a travel plan together.
1. HMW let communication and creating trip plans happen in one place?
2. HMW make it possible for the users to edit plan simultaneously?
3. HMW make it easy to check the comments or message?
People in the group can review and edit the plan once they get permission. That means they can work collaboratively and keep everybody on the same page.
Everyone can create an organized travel plan with a template in a very short time.
A template that includes the basic items that a travel plan needs, which allows users to create a trip plan quickly.
Everyone can create an organized travel plan with a template in a very short time.
A template that includes the basic items that a travel plan needs, which allows users to create a trip plan quickly.
To avoid going back and forth, people in the group can leave messages or opinions and share resources directly on each specific plan/activity, thus can improve the efficiency of decision-making.
Slide the card to edit or delete it quickly.Hold on and press the card while dragging it to switch the activities easily.
Slide the card to edit or delete it quickly.Hold on and press the card while dragging it to switch the activities easily.
I decided to follow IDEO’s Human-Centered Design and Lean UX Design Thinking process to make sure that my design decisions were supported by user research and feedback.
Desk Research
User Interview
Synthesized
Understanding the problem by initial desk research and user interviews
As the quarantine, I began with desk research online and conducted user interviews remotely. Because these are the fastest and effective ways that I can get both qualities and quantities of information about users. The results helped me gather insight from target users and directed me to make smart design decisions.
Key finding from desk research:
Most travelers do travel research on mobile devices nowaday.
I did user interviews with 5 target users who traveled at least 1 time with others last year to try to get deep learn about what their previous travel experience looks like. And I found:
Key findings from interviews
This result led me to the think about:
How to provide a positive experience for users by improving the efficiency of cooperation?
I translated users need into:
Personas
Define the user
Our target users are the extroverted young adult who like travel with others to share budgets.
Ideate
User Story
Sitemap
User Flow
Heuristic Evaluation
Explore solutions.
From the research and the interview, I found that a key point to improve the efficiency of collaboration when making a trip plan was about communication since everybody’s needs should be considered. That made me think:
What if we provide a positive plan building experience for users by adopting social collaboration design?
Definition of social collaboration
According to Wikipedia, social collaboration “refers to processes that help multiple people or groups interact and share information to achieve common goals.”
Google for Work (Hangouts, Docs, Sheets, Drive, Slides, etc.), Microsoft Office 365 (Word, Excel, OneDrive, Lync, PowerPoint, etc.) are the example of Social Collaboration Suites. I marked down some great features that they used as they can also work for my project:
Except for the above features, an internal communication feature is also necessary as most travelers need a way to share resources in the group and they’d like to get feedback immediately if possible.
I was also considering that a template option may be a good choice to be included as some interviewees said a template would help and ease the work.
Prioritize the features
Before starting the design part, I did a series of user stories and heuristic evaluation to help me prioritize the features and find out what doesn’t work well for an organizer app.
Sketches
Wireframes
Style Guide
Hi- Fi Prototype
Conducted guerilla testing with sketches and reflect the improvement on the wireframe
Now the fun part begins. With all the supporting data presented, I started to create iterations and iterations of hand-drawn sketches before diving into wireframing and prototyping. I always ask myself: "What’s the best way to communicate my thoughts?" These hand-drawn sketches are helpful to keep me from getting too detailed into the visuals.
Style Guide
Considering the company’s personality, I started with having some adjective words in mind and chose the most representative colors, typeface, and icons to convey the feeling of Brisk, Accessible, and Friendly.
High Fidelity Design
High Fidelity Prototype
Usability Test
Prototype and validate
When everything was prepared, I had my most exciting moment, to build the hi-fi screens and prototype in Figma based on my wireframe works. Then I had to face the challenge below for this part:
Once I have a big picture in mind, I start visualized my idea in Figma, then optimized it by doing the usability test. I conducted two round usability tests with 11 people to validate the result and improve it.
Try the prototype
Getting to know what the user needs and exploring the problem is much more important than just starting to rush without a goal. It deserves to spend time coming with some diverse solutions.
Though the sketches may be very rough or messy, it can still work great to check if I am in the wrong direction and help me not to go far away from my HMW questions. But I will make the sketch more legible if I can go back and do something differently.
t can make a big difference once you pick the proper elements based on your target user usages and behaviors. For instance, gestures icons, buttons, or color palettes. During the usability test sections, I found different operating system user has a different idea on the same thing. If you want to design an app for both Ios and Android users, it’s better to pay attention to choose a common icon and gesture for the product.
This is the most powerful thing that I learned from this project. I use to felt stressed and disappointed when I was stuck in the design process because I was a perfectionist, but my mentor told me to enjoy the process and complete it first.
Once there is work, then you get a ticket to improve it based on the user’s comments during each test, not just from your personal perspective.