Tripster (UI/UX Responsive Mobile App Case Study)
Tripster
Overview: Tripster is a comprehensive travel app designed to streamline trip planning and booking. Its user-friendly interface simplifies the process of planning and booking trips, organizing trip details, and facilitating payments through both cash and rewards options. Tripster aims to alleviate the complexities and stresses associated with traditional trip planning by offering a centralized platform for a seamless and organized travel experience.
Client/Organization: DesignLab
Role: UX/UI Designer & researcher, conception to final prototype
Duration: 16 weeks
Tools: Figma, Google Form, Miro
"Tripster: Your Passport to Seamless Travel Planning – Book, Budget, and Explore with Ease!"
Background: Planning a trip is an experience in and of itself. It may be a chore for some and exciting for others. A well planned trip brings about ease of mind when traveling. In addition to that, having a budget also allows for seamless travel. How wonderful would it be if you could be given an itinerary based on your budget, needs, and destination of choice?
Tripster provides a holistic solution by offering a single platform for trip planning, booking, and payment management. This not only saves users time and effort but also reduces stress, enabling them to fully enjoy their travels. Moreover, the app's integration of cash and rewards payment options enhances flexibility and convenience for users when paying for their trips.
Process:
Research
Competitor Analysis: Competitive analysis played a vital role in our project. It helped us understand our competitors, find market gaps, and establish our competitive edge. This analysis was instrumental in identifying key pain points and needs that Tripster could address, such as simplifying travel planning and integrating travel rewards features. These findings provided a clear roadmap for our project, guiding our efforts to create a user-centric solution. I discovered some major pain points.
-Too many notifications.
-Prices can be better.
-Overload of information.
-Anyone with internet can leave reviews.
Interviews: Conducted remotely via video calls, utilizing a semi-structured format to gather insights on travel planning habits, pain points, and user needs.
Key questions included:
-Describe your typical travel planning process.
-What challenges do you face when planning a trip?
-What features do you wish travel planning apps had?
Key findings:
Define
Understanding the Problem: Planning and booking trips can be a daunting and time-consuming task, requiring users to juggle multiple aspects such as flights, accommodations, activities, and payments. This can lead to frustration and overwhelm as users struggle to keep track of all the details.
Solution: Tripster provides a holistic solution by offering a single platform for trip planning, booking, and payment management. This not only saves users time and effort but also reduces stress, enabling them to fully enjoy their travels. Moreover, the app's integration of cash and rewards payment options enhances flexibility and convenience for users when paying for their trips.
User Persona: I crafted a user persona to remind me of the needs and pain points of my target audience and ensure a user-focused approach throughout the project.
Affinity mapping: An affinity map is a UX research method used to organize and analyze qualitative data. It helps to identify patterns, themes, and insights from user research, such as user interviews, surveys, or usability tests.
Storyboarding: Storyboarding in UI/UX design involves creating a sequence of screens or frames that depict the user’s interactions with a digital product or service.
Sitemap: Then I worked on sitemap. A sitemap is a file where you provide information about the pages, videos, and other files on your site, and the relationships between them.
Userflow: User flow in UX refers to the visual representation of a user's journey through a product or website. It outlines the series of steps a user takes to accomplish a specific task, providing a holistic view of their interactions and experiences.
Taskflow: To optimize user experience, we developed a range of user and task flows, concentrating on tailored job searching, flexible schedule management, and seamless pay rate control within our Toothfairy app. These flows drew inspiration from industry insights and card sorting techniques, guaranteeing an effortlessly intuitive user journey.
Ideate
Wireframes and Prototyping
Lo-Fi Wireframes:
Hi-Fi Wireframes:
Design system language: I established a design system language to maintain consistency in future updates.
Prototype: Experience firsthand—try our app prototype for a glimpse into seamless functionality and user-centric design.
Test
I conducted user testing using a Figma prototype. Testing sessions were a mix of in-person and remote, tailored to participant availability. Participants were given specific tasks and provided feedback on their prototype experience.
Insights from testing guided improvements. For instance, user feedback helped identify and address confusing or unclear elements. Overall, testing ensured our final product met user needs effectively.
Iterate
Usability testing
Task 1: Sign up and create an account
Task 2: Book a flight using cash
Task 3: Book a flight using reward points
Overall, it took all participants 5 minutes or less to complete all task flows. Participants found the task flows to be easy to navigate. All participants were able to complete the task without any issues. One participant wasn't loving the colour selection. All participants appreciated how simple it was to book flights with this design.
Conclusion
This project highlighted the challenges of balancing user needs with business objectives and achieving an appealing and user-friendly design. Research and testing played pivotal roles in shaping the final product, emphasizing the importance of simplifying the planning process and recognizing the demand for travel reward tools.
The iterative nature of design was underscored, emphasizing the need for continuous testing and feedback. Future plans include refining the visual design, conducting additional user testing on the live prototype, and maintaining a strong focus on user-centered design. The creation of a functional prototype that effectively addresses user needs while aligning with business goals stands as a significant achievement in this project.
