PROJECT OVERVIEW
The Problem
Users need an easy way to access a variety of unique and enhanced travel experiences so they can fully immerse themselves in the country's culture without the anxiety of planning their full itinerary while being in unfamiliar surroundings.
The Solution
By offering users a mobile app service that allows them to contact local experts in any country they are traveling to, they will be able to:
Deepen their travel experience
Alleviate the stress of figuring out their itinerary
Engage with locals via chat and acquire recommendations
Book them for a guided tour at the price the local expert has set per hour
Both User-Centered Design and Design Thinking were used for this project to provide more structure to the process, while also prioritizing the users needs.
1. Understanding the market
I conducted a competitive analysis over the next few days to identify and assess potential competitors in the travel space.
My first step was to figure out what areas of opportunity and solutions can be found in this specific travel market.
What’s out there to allow people to talk to experts while traveling?
Where are there possible areas of friction?
What features can be developed and prioritized?
What’s their business model?
Airbnb & Withlocals were selected for this analysis because of their capabilities to book an activity and chat with an expert.
Main Findings
I found that one business (AirBnB) had more geographical reach due to its brand power, and offered a variety of services to its users. However, Withlocals did a better job directly connecting traveling users with experts. I wanted our product to tap into each of these strengths, and potentially push them further (other main findings listed below).
Competitive Analysis - Main Findings
2. Empathizing with the target user
To build for a particular audience who travels, I took 2 weeks and used a survey and User Interviews to identify my potential user base and their behaviors.
Survey
Due to time constraints and in order to gather some quick quantitative data, a survey was used to gather general attitudes towards travel and as a means of vetting for user interviews. I wanted to know people’s general behaviors and feelings when they ask for help during their travels.
45 participants were recruited from general sources and completed the survey within a 48 hour period. I found that more than half of the participants were likely to ask a local for recommendations (68%). Of the key results, what surprised me were the percentage of people who would pay for a potential service (65%).
Survey question example
Interviews
Armed with insights from the survey, I took a week to interview 5 survey respondents from my target audience so I could dive deeper into survey results. The goal was to:
Further understand their challenges and current solutions when planning for a trip
Gage their attitudes and behaviors surrounding tourism
How they would use an expert travel app and what features and content they feel would motivate them to use it.
I used affinity mapping to organize and synthesize my findings to potentially inform my designs. One common pain point that I found interesting was the subject of traveling in groups and how conflicting disorganized it can be. I was excited to explore this during the ideation phase.
Affinity Mapping insights on “Finding a local expert”
Interview Insights
Survey Insights
“I would use a tour guide if they were affordable and offering a completely unique experience”
- Survey Respondent
Provisional User Personas were created based off of research results, to communicate key insights in an organized and empathetic way.
Meet Rebecka and Sebastian who will serve as User Personas for LOCL and help keep the focus on the needs and goals of the app’s target audience during the ideation phase.
3. Ideating solutions from research
Informed by the personas goals and needs, user flow charts were created to map out and systematically construct the paths users would take to complete a desired task while using the various conceptualized features on the app.
I first conducted a task analysis to identify current expectations of LOCL’s users and applied them into the flow charts, allowing them to become the basis for conversation and design. These user flows helped inform me on which initial steps to include during each users journey, and helped identify potential pain points.
During this phase, I was particularly excited to take my findings on group travel, and craft a solution that would help address pain points that were discussed. I brainstormed and thought of an itinerary building tool that would allow traveling groups to first build an itinerary, and then allow all members of the group to vote on their favorite activities before (or during) their upcoming trip, without having to worry about what everyone else was doing. The goal was to completely eliminate tough conversations surrounding conflicting budgets, interests, and expectations when traveling in groups.
Booking an Expert
Building an Itinerary
The information architecture was refined through a card sorting, so that it may serve as a blueprint during the wireframing phase.
By referencing the user flows, I was able to draft a sitemap based on assumptions surrounding the navigation and organization of the app’s content. To test these assumptions and refine the sitemap, I invited 6 users back into the design process to take part in hybrid card sorting sessions. The participants were asked to sort cards into the categories provided, or create their own categories if they felt it was necessary.
The results proved that my assumptions were mostly aligned with the way the participants sorted the information, save some minor changes within some categories, and 2 added categories in the mix. I found the session to be very insightful and was able to further organize and expand the paths of certain features due to this process.
4. Prototyping the design concepts
Wireframes were designed by referencing the refined sitemap. Three core features were focused on to meet the objectives of the personas:
Booking an Expert
Map Feature
Itinerary Builder
The research process informed the design and development of these features, and they make up the core functions of the app. There were three phases of wireframing:
Low-Fidelity wireframes: using Pen and Paper to draft out the layout and basic functionality of each screen
Mid-fidelity wireframes: using Balsamiq to define features and their placement in grayscale, and outline detailed interactions between screens
High-fidelity wireframes: using Figma to further develop the screens while adding personality and branding, resulting in an interactive prototype for testing
Home Screen
Itinerary Builder
Local Experts Page
Map Feature
5. Testing the prototype
In order to assess the learnability of new users interacting with the app, and test out the apps functionality, 6 individuals from the target demographic were invited to test the prototype by participating in moderated-remote testing sessions over a 2 week period.
The tests took place virtually over zoom and were recorded with each participants consent, while I took notes and asked follow up questions. They were presented with 4 scenarios and corresponding tasks, which they then had to complete. They were asked to think out loud as they navigated through the app and attempted to complete the tasks. The goal was to:
Observe first impressions
Test the prototypes successes while identifying areas of opportunity
Gather general feedback.
Analysis
Using affinity mapping, I was able to synthesize the data into a rainbow spreadsheet to better analyze it and pinpoint the successes and areas of opportunity. Due to time and budget constraints, I needed to prioritize the most pressing issues for the next iteration of the app, so I employed Jacob Nielsen’s severity rating scale to help me do so (see next section for changes).
Affinity Map
Rainbow Spreadsheet
Changes were applied to the more severe areas of opportunity for the next iteration, resulting in a more refined experience.
Key Changes:
Key elements of the Onboarding Experience
Simplifying the Home Page UI
Enhancing the Booking and Paying process
6. Refining the User Interface
LOCL has a minimal aesthetic, so when polishing the UI, I decided to push the aesthetic further by:
Using one color in order to present a simpler product. The color purple was selected for its cool, royal, inviting nature, and ability to compliment all the high-def imagery
All the text fields and boxes where outlined and refined by using shading instead of defined lines, for a modern look
Icons were made slightly smaller - especially in the navigation bar - and with no labels, to not take away from the beautiful imagery and keep the UI clean
Onboarding
Book an Expert
Map Feature
Itinerary Builder
Designing for accessibility and ensuring better usability for all users.
When putting together the Style Guide for LOCL, incorporating accessibility into the designs was important for me. By referencing accessibility guidelines, improvements were made to the product and created with inclusivity in mind, to ensure better usability for all users. Some of these improvements include:
Replacing placeholders in forms with permanent titles for clearer instruction
Audio Options for listening to text or dictating through a mic instead of typing
Making sure the Text Size was big enough for all to see for users who are visually impaired
Text to background contrast to increase text visibility
I am very passionate about accessibility and designing products that are inclusive to all users, and hope to always incorporate that into all my work as I learn more about it.
(Check out the Design Language System Document at the bottom of this section for more changes made based on Accessibility guidelines)
Style Guide
