TIMELINE
Feb - Apr 2023
ROLE
UX Researcher,
UX/UI Designer
TOOLS
Figma, Mural, Canva
METHODS
Brainstorming, Competitive Analysis, Semi-structured Interviews (+ guide creation), Affinity Diagramming, Personas, Storyboarding, Sketching, Wireframing, Low-Fi Prototyping, Usability Testing (+ guide creation), High Fi Prototyping, Heuristic Analysis, Accessibility
PROJECT CONTEXT
My Role. This project was a collaborative effort completed as part of my Spring 2023 UX/UI Design class. We were a team of five, and I actively participated in all phases of our project. I was responsible for conducting user interviews/usability testing, analyzing the research data, and contributing to the ideation and wireframing processes.
Requirements. The class project required us to focus on designing an interface that addresses a problem faced by people. As travel enthusiasts in our team, we decided to target the challenges faced in planning group trips. In addition to accessibility considerations.
Limitations. Due to the time constraint of one semester, we had to prioritize our research methods. We selected those that we thought would provide the most valuable insights within the available time. We also had to limit the scope of our design to ensure we could develop and test a prototype by the end of the semester.
Introduction
(INITIAL THOUGHTS)
Group travel while enriching, brings along unique complexities - from varied payment methods to organizing joint confirmations. Current tools offer isolated solutions like calendar sharing or multiple payment options, but the real need is for a comprehensive platform that seamlessly integrates these functionalities.
PROBLEM
Individuals find it challenging to plan for group trips.
In the process of planning group travels, whether it is with your family, friends, or coworkers, individuals often encounter difficulties organizing itineraries, coordinating schedules, and managing shared expenses, leading to a stressful and inefficient planning experience.
Target Audience. The users we wanted to impact from the problem we were looking to address.
Primary users = everyday individuals planning group travels (family, friends, coworkers, school organizations, etc.); *not client based* and individuals with hearing/visual impairments. Our app will be designed to be inclusive, ensuring that individuals with hearing & vision impairments can easily access and navigate shared plans without resorting to multiple third-party apps.
Rationale. Why this problem is relevant and will lead to considerable benefit for individuals/persons with disabilities.
A specialized travel itinerary app is useful for efficient group travel planning by serving as a single platform for assigning responsibilities, managing confirmations, and organizing events & expenses. By streamlining these details onto one interface, we reduce the hassle of cross-checking multiple apps, allowing users to focus on the joy of travel. Our user-friendly design aims to simplify the process, making group trip planning a breeze rather than a burden.
Human-Centered Design Approach. (Note: Kept in mind that it may not be concrete because what I learn from the empathy phase may change my approach in the ideate phase)
HCD Questions asked & answered: a. Who will you look to research to understand more about the problem of interest b. What problems or insights do you envision finding after conducting your research? c. What kind of design solutions do you envision to create your artifact? d. What sort of prototypes do you envision creating? (keep in mind may change) e. How do you envision you will evaluate your prototype?
To understand the challenges of group travel, we plan to understand travel communities online and interview users, including those with disabilities. We anticipate that most users may understand the complexities of group travel planning. As UX designers/researchers, our role will be to guide these discussions to elicit insights about the need for efficient payment, organization, and booking solutions.
Our proposed design solution is a multifaceted travel app with features tailored for group planning and inclusive accessibility.
Key features include shared schedules and payment options, as well as accommodations for users with disabilities such as voice commands and closed captioning.
Our envisioned prototype, created using Figma, encapsulates core features and is evaluated through user feedback, aiming to offer a unique and value-adding travel experience.
GOALS
User Research: Understand group travel challenges and the specific needs of users with disabilities through comprehensive user research.
App Development: Design a unified platform to streamline group travel planning by consolidating key features into one app.
Inclusive Accessibility: Ensure app inclusivity by incorporating accessibility features tailored to users with visual and hearing impairments.
INITIAL FEEDBACK/INITIAL CHANGES
From UX/UI Design class, Professor, and TA.
a. Solo vs Group Travelers
Integrate options for solo and group travels
b. Feature creep - excessive; overload of features
***Focus on collaboration/communication/coordination (CCC) aspects of streamlining rather than integrating multiple apps. Example: Rather than integrating payment apps & booking apps, we give users a space to communicate with all members of a party that these designated tasks have been done/confirmations can be posted or shared
THE SOLUTION
Tools that streamline and connect all members of a group are key
Information
Designation/Budgeting
Organization/
Communication
-
Sync Calendar with streamlined planning and color code
-
Personal/Group real-time notes
-
Centralized comms in one platform/efficient for quick decision making
-
View group members, countdown til trip, and timeline with map integration & pdf upload capabilities
-
Destination Info sheet with language 101, Overview, Weather, Currency Converter, Rec activities, Transportation, and important laws
-
Allow group members to claim responsibility for various tasks/items, promoting accountability and ensuring tasks are evenly distributed
-
Facilitates setting group/individual budgets and tracking expenses in real-time, helping members manage funds more efficiently
-
Split payment feature with notifications ensures transparency in shared costs and more timely process
Research
COMPETITIVE ANALYSIS + THE GAP
Seven Criteria: Itinerary Management: Does the app allow users to create, share, and update travel itineraries? Group Coordination: How does the app support group decision-making, role assignment, and information sharing? Communication: What tools does the app provide for intra-group communication or communication with travel service providers? Budgeting: Can the app track expenses, allow for shared payments, and help with budget planning? Destination Information: Does the app provide relevant details about the destination such as attractions, local customs, weather, etc.? Accessibility: Does the app cater to users with various abilities? Are there options for text-to-speech, high-contrast visuals, etc.? User Interface (UI): How intuitive and user-friendly is the app's interface?
The competition had NO accessibility aspect and group designating aspects.
I analyzed the top 5 iOS trip planner apps. I discovered a significant gap – none had an accessibility feature to help users achieve their goals. None of them had a way to designate certain group members to take responsibility/charge for the travels. I based this analysis on 7 key features, but none of these applications met all the criteria. This then became my opportunity for the solution.
USER INTERVIEWS
In order to uncover the underlying problems and user needs before designing our application, we conducted interviews with two individuals to gather insights.
Click below to view our Interview Protocol/Guide!
Interviewees + Insights/Themes + Painpoints
1. FIRST interviewee: student with some travel experience and hearing impairment
Theme: The need for easy ways to research and prepare financially for a trip. Stressed the importance of Bluetooth compatibility and closed captions to accommodate hearing needs.
2. SECOND interviewee: has extensive travel experience spanning 19 countries
Theme: the necessity of managing various tools effectively when planning a trip and understanding diverse needs within a group.
High-lvl: Steered our focus towards two critical elements of group travel: robust organization and thoughtful planning
AFFINITY DIAGRAMMING
Interviewee 1
Interviewee 2
Interviewee 1
*hover*
Features/Insights
Original Features | New Features
a. Bluetooth Compatibility & Captions: One interviewee with a hearing impairment stressed the importance of Bluetooth compatibility and closed captions for inclusivity.
b. Additional Accessibility Features: We plan to include options for color-blind individuals, as well as light and dark mode settings.
c. Destination Information Page: Interviewees showed interest in having accessible destination-specific details, such as local customs, transport practices, popular activities, and currency details.
d. Collaborative Calendar & Notes: To address communication issues within travel groups, we plan to incorporate shared calendars and notes for effective coordination of group or individual activities.
e. Group Chat: A communication portal was suggested by interviewees to locate specific texts easily and maintain active group communication.
f. Responsibility Registry: A registry feature will be introduced where members can assign responsibilities for trip-specific tasks, aiding in role organization within the group.
g. Notifications: Time-bound notifications for trip updates, reminders, and relevant information about the destination were identified as essential features.
h. Payment Reminders: A reminder system for payments will help prevent financial issues and facilitate accountability among group members.
i. Financial Tracking & Card Scanner: Features to track expenses, keep records of payments, and a card scanner for swift payment information input were seen as crucial for smooth financial management during the trip.
HOW MIGHT WE STATEMENT
How might we...
streamline communication, organization, and information for members of a group during group travel and make their traveling planning experience more efficient?
PERSONAS
Persona 1
Persona 2
Persona 1
*hover*
CHALLENGES/SETBACKS
Accessibilty
User Interface Implementation
Design Options
Website
Shared Online Spreadsheet
Mobile App
After evaluating the pros and cons of these options, we concluded that an app was the best solution. Reasoning/Considerations Website - Considered because of the potential for comprehensive features. - Discarded due to limitations in flexibility, accessibility, and difficulties with real-time notifications. Shared Online Spreadsheet - Considered for its accessibility and sharing capabilities. - Discarded because of its lack of real-time communication, itinerary tracking, and reminder functionality. Mobile Application - Chosen because it provides real-time updates, reminders, notifications, and advanced features like chat, shared calendars, and budgeting tools. - Further selected for its potential to be inclusive and accessible for users with disabilities, and its overall ability to streamline the travel planning process effectively.
Ideation & Design
STORYBOARDING
Based on the storyboard, we had an idea of what we wanted the product to look like and the features it will have.
Storyboard 1
Storyboard 2
Storyboard 1
*hover*
SKETCHING
WIREFRAMING
Click below to view our lo-fi prototype!
TESTING & ITERATION
Method: The Think Aloud Method
Format: Virtual via Zoom
Participants:
a. Participant A. Undergraduate college student with a hearing disability. Has experience with group travel. Provided valuable feedback on the accessibility settings and specific page details of the Tripify app.
b. Participant B. Senior undergraduate student with local and international travel experience.
Click below to view our Full Usability Testing Guide!
FINDINGS/INSIGHTS SUMMARY
a. Participant A
Undergraduate college student with a hearing disability. Has experience with group travel. Provided valuable feedback on the accessibility settings and specific page details of the Tripify app. Interviewee A - Navigated sign-in, trip creation, and traveler addition with ease. - Struggled to locate shared notepad, registry features, and captions/settings for video/audio notes. - Couldn't add a table in notes. - Successfully transitioned between app themes but had issues altering trip duration. Suggested Improvements: - Introduce expense tracking and budget setting features. - Include weather updates, language and cultural insights, and currency auto-converter. - Enhance accessibility for captions and settings of video/audio notes. - Implement invitation links for app sharing and popular destination videos. - Add hover text for bottom bar icons to assist with navigation.
b. Participant B
Senior undergraduate student with local and international travel experience. Interviewee B - Successful sign-in, but struggled to find the "plus" button for trip creation. - Could add a table in shared notepad and an item to registry without issues. - Suggested distinguishing personal vs. group expenses through color coding or pop-ups. - Suggested reorganization of information hierarchy in the country info sheet. - Found difficulty in finding captions for video/audio notes. - Failed to add a table for personal notes. - Effortlessly managed expense addition, cost-splitting, and theme switches. - Experienced confusion with trip duration setting. Suggested Improvements: - Enhance visibility and accessibility of the "plus" button. - Implement a clear distinction between personal and group expenses. - Revise information hierarchy on country info sheets for better clarity. - Make captions for video/audio notes more intuitive. - Improve personal note-taking functionalities. - Refine navigation and setting controls for trip duration.
ROUND 2 FEEDBACK & ITERATION
Feedback from UX/UI Design class, professor, and teaching assistant (TA)
Changes
a. Registry → Colored profile pictures to signify changes; make action tasks/information display more intuitive (i.e. incomplete (action) vs complete (no action needed))
b. Communication → ineffective, confusing naming/information architecture; calendar → redundant; remove from communication portal
c. Bottom Navigation Bar → remove naming labels
Additions
a. Sign-up page → name, email, email confirmation
b. Calendar → Drop-down menu for filtering/choosing view
Design/Aesthetics
a. Calendar → padding, space it out and make it easier to view
b. Communication → Excessive white space
c. Registry → Avoid greying out every other line
d. Info Page → Improve consistency
My Solution: (given time) → A/B Testing
CHALLENGE
User Testing feedback and Professional feedback conflict:
Interviewee A: Adding hover page words for the bottom bar icons can help users understand each app section.
Professional Feedback: Bottom Navigation Bar → remove naming labels
HEURISTIC EVALUATION
I critiqued and evaluated one of our competitors, Wanderlog, using the 10 Usability Heuristics and identified ways that the app could be improved in 3 of the heuristics.
"Wanderlog- Travel Planner" has a wide array of features aimed at streamlining the travel planning process. However, the number of features can be overwhelming for users.
My critique: Aesthetic and Minimalist Design: The User Account Page and the Trips Page are cluttered with buttons, options, and recommendations, lacking a clear visual hierarchy or organization. This could be improved by reducing clutter, combining similar categories, and removing redundant sections and icons. Consistency and Standards: The application lacks consistency, with tabs using a mixture of word labels and icons. The "Share" function also varies across the application. Standardizing these elements and organizing the page to align with user expectations would improve user experience. Recognition rather than Recall: The current design requires users to remember the location and functionality of each section, which can be confusing. The app could be redesigned to be more intuitive, positioning functions in familiar spaces similar to popular applications, and better utilizing the bottom navigation bar.
After my critique, I redesigned 1 page Wanderlog in accordance of heuristics.
-
The Home button was relocated to the center bottom navigation bar to improve consistency, and to ensure it is always visible, even on the trips page.
-
The photo icon was removed. A triple horizontal bar was added to represent settings or more options, which include photo editing, trip settings, and accessibility modes.
-
The hero section was simplified by removing the profile page, which was relocated to the bottom navigation bar. The option to share the trip was moved under the three-dotted icon, removing redundancy.
-
The tabs bar was decluttered by removing "Itinerary", "Explore", the expense icon, and the three unaligned horizontal bar icon. These functions were integrated into the bottom navigation bar as “Maps, Bookings, Home, Expenses, and Profile”. A new tab, “Planning”, was introduced to centralize the app's main function.
-
The progress bar was retained, but sliders with lengthy descriptions were removed and their functions reallocated to relevant tabs or pages to reduce clutter and improve navigation.
-
The “Reservations and Attachments” sections were removed. Reservations were moved under bookings and attachments under “Notes”.
-
"Notes", "Lists", and "Attachments" were combined into one section under “Notes” for better organization. The "Places to Visit" section was reformatted for readability and clarity.
-
Maps was moved to the bottom navigation bar and the redundant plus icon was removed.
Future Steps
WITH MORE TIME:
-
Careful consideration to style guide
-
Ethical considerations
-
Advance Settings: Language accessibility options/Notification settings
-
Additonal Screen: Explore integrating similar to “Find my friend” for groups
-
Quick and Secure Login: Two-step verification/face-id identification/allow notifications /allow location pop-ups
-
More user interviews/feedback and continual iteration
-
More detailed report with all Usability Heuristics evaluated/critiqued
-
Explore different methods of testing such as a/b testing and card sorting
REFLECTION/HIGH-LEVEL LEARNING OUTCOMES
-
Learn and apply foundational design knowledge, methods, and skills to create effective and compelling UX
-
Engage in and respond to constructive design critiques
-
Communicate design concepts clearly and compellingly in different phases of the UX design cycle
-
Learn how to work as a team effectively