PASSION PROJECT
Taking the headaches out of planning where to eat
InsiderEats is a mobile app to match restaurants according to your taste preferences so that you can be confident of the restaurants you select for your travels.
ROLE
Sole UI/UX Designer
TIMEFRAME
January - March 2022 (3 mo.)
PROCESS
User Research, Ideation, Sketch, UI Design & Prototype, Usability Test & Synthesize, Redesign
TOOLS
Miro, Figma, Invision
THE PROBLEM
Eating is not only a necessity, but an experience that can make or break a vacation. With a variety of restaurants to choose from, people experience a paradox of choice, leading to decision fatigue. There’s limited meals to plan, so the struggle of narrowing down and choosing worthy places to eat makes the process that much more stressful and time-consuming. Consumers need a way to research food options and be confident in their restaurant selections.
scroll fatigue
THE SOLUTION
I created an app called InsiderEats that takes the headache out of research planning by recommending restaurants based on your social network and your personal taste preferences.
SCREENER SURVEY
To get a better understanding of how travelers go about creating their restaurant wish list and any pain points that come with it, I sent out a screener survey to filter for travelers who recently went on a trip, conducted restaurant research and had felt some negative feelings during the process.
USER INTERVIEWS
After screening out potential interview candidates, I set up zoom meetings with five participants who have experienced negative emotions when researching food options for travel.
My primary focus was to learn how they research and settle on their food itinerary either before or during travel and understand more about their frustrations felt along the way.
SYNTHESIZING RESEARCH
Using the information from the recorded interviews and my jotted notes, I completed an affinity map with 80 sticky notes that allowed me to visualize certain themes that arose.
THEMES FROM USER INTERVIEWS
EMPATHY MAPPING
By grouping certain observations/insights via empathy mapping, I was able to cultivate two main personas, who each have their unique thoughts and behaviors: the budget planner (detailed, budget-conscious planner) and the influencer’s fan (visually-motivated, social media driven consumer).
PROBLEM STATEMENTS
How might we provide confidence in a traveler’s restaurant choice, and reduce risks of surprise?
Knowing proximity is a huge indicator of how people plan and select restaurants, how might we make it easier for users to find existing and new restaurants that are suitable to their tastes and within their constraints?
How might we reduce the amount of time it takes to review and determine if a restaurant should be kept for future references?
To brainstorm more efficiently, I broke down the user’s journey into the following. Brainstorming helped define the hierarchy and layout of information needed to build confidence in decision-making.
Then I coded all user stories by high, medium, and low priority to determine what needed to be done to create a minimum viable product.
From the point of view of a typical user, I laid out important screens that were needed and grouped them in structures that were the most intuitive.
I constructed three red routes that users absolutely need to attain their goal of using the app and thought out the user flows for each.
Using the user flows as a guide, I sketched out:
(a) onboarding screens to visually show the importance of integrations with social media apps;
(b) restaurant recommendation screens with a focus on data hierarchy and layout, since that is key to aiding a user’s decision-making.
ITERATE, ITERATE, ITERATE
It’s always easier to identify problems with design when you have something to look at, then iterate. Therefore I quickly mocked up low-fidelity wireframes so I could gauge what I could do better. Also adding real text was really helpful in detecting early any design constraints.
Images chosen reflect the nature of travelers, boundless and open, which gives the product a vast sense of data. Playful shots also give off a very welcoming vibe. Overlapping components and immersive style aesthetics give off a playful, approachable, and more importantly, engaging. It captures your attention and inspires.
Drawing inspiration from the mood board, I tried capturing the adventurous limitless vibe into the design system through a personable logo, bold but fun typography, and vibrant colors from nature.
WIREFRAMES + PROTOTYPE
Referring heavily to the design style guide, I was able to create a more unified look and composition. I decided to use dark mode as the default to contrast my app’s look and feel from familiar competitors like yelp, tripadvisor, etc.
USABILITY TESTING + REDESIGNS
OBJECTIVE
Determine (1) their thoughts on the app itself; (2) whether it would effectively help them; (3) and whether they would personally download and utilize it.
USABILITY TESTING
I conducted six moderated usability tests (3 in person and 3 remote) and had asked each participant to complete the following five tasks.
Make your way to the homepage.
Imagine you’re about to go on a trip to Amsterdam. Find a restaurant to save to a list. Determine how far it is from your hotel. Your hotel’s address is 123 Main Street.
Add that restaurant to your saved Amsterdam trip.
Imagine today is day 2 of your vacation. You already have a list of restaurants you saved. It’s lunchtime and you’re looking for a place to eat that’s near where you currently are. Please find the closest restaurant to you right now.
Share the restaurant you found with a friend.
RESULTS
Watching the six participants actually going through the prototype was very insightful. Given the 5 tasks, most participants were able to complete all tasks. Only one participant was unable to complete all tasks.them; (3) and whether they would personally download and utilize it.
rainbow spreadsheet
usability testing affinity mapping diagram
Overall all of the participants thought the idea behind the app was valuable, but that certain implementations could have been better. Through affinity mapping and prioritizing all the issues observed, I came up with three issues that needed critical redesign.
ISSUE #1
Redesigned the Friends tab on the restaurant page to show more Friend activity and trends.
Included icons from 3rd party platforms to show where the data is coming from.
Inserted real life example of Friends activity in the onboarding process to convince users the benefits of integrating their social media accounts.
ISSUE #2
Participant couldn’t complete task #4 in finding the closest saved restaurant to their current location from the homepage.
Redesigned “Current Trip” card on homepage to look less cluttered and stand out more.
Decluttered homepage by removing the hero image by the search bar.
ISSUE #3
For the adding landmark function, all five participants found it difficult or confusing to add a landmark.
So I scratched the initial flow and decided to progressively disclose the “add a landmark” concept after the user has bookmarked its first restaurant by introducing a mini tutorial to educate the user.
FINAL THOUGHTS
Developing a product from end to end gave me a glimpse to just how impactful research, user exploration, and user testing can affect any initial biases on an idea. It was a great learning experience. If I could have done it differently, I would have done the following:
Focusing on insights instead of the process would have made my solutions leaner. Insights backed by real observations drive personal biases away.
During usability testing, don’t test for a specific path. Everyone is different; there are more than one way to get to the end place.
Found myself wanting to fix everyone’s problems, so my project scope ended up being larger than I wanted.
Apps are not the only problem-solving tool. Would explore other avenues to solve the same problem.
IF I HAD MORE TIME
I would have liked to finish flushing out the “adding landmark” concept and I would have liked to explore how to create dining templates (ie. romantic date night, luxury family celebration, etc.) that come with pre-filled filters so that users can search restaurants more quickly.
