General Assembly UX Course

Designing a Trusted Social Network to Give, Receive, and Track Restaurant Recommendations

Mobile App Focus • Certification Project

End to End UX Process

App concept, user interviews, competitive analysis, user flows, wireframing, prototyping, user testing, and branding

Tools

Figma, Sketch, Maze

Tackling the Friction in Restaurant Discovery

To obtain a UX Certification from General Assembly, I conceptualized an app for frequent restaurant visitors. Food enthusiasts often struggle to keep track of restaurants they’ve visited and ones they want to try. Many rely on scattered notes, screenshots, and memory, making it difficult to recall past dining experiences or plan future visits. Current restaurant apps do not include social network features, making it hard to find restaurants through trusted recommendations.

This got me thinking… How could I improve the restaurant discovery process?

Reimagining How We Book and Discover Restaurants

Originally, I wanted to streamline the discovery and booking process for restaurant customers. With multiple reservation platforms and scattered restaurant information, users often waste time navigating multiple apps to reserve a table and find new places to try. This fragmented process creates friction, especially for those looking to compare options and check availability.

I wanted to build an easy way to book, explore, and find restaurants. The app would have three main functions:

One app for all restaurant bookings

Ability to see friends’ dining history and preferences

Personalized restaurant suggestions

Looking back, my idea was much too broad for a class project with an accelerated deadline and no prior Figma experience. However, I used these desires to craft my original problem statement.

Original Statement

How might we design a centralized booking app for restaurant goers that streamlines the reservation process?

Uncovering Market Gaps Through Competitor Research and User Insights

Identifying Opportunities Through Market Research

I did a feature inventory comparison between the four most popular restaurant apps: OpenTable, Yelp, Resy, and Tock. I compared tasks across the apps, such as booking a reservation, reading reviews, and exploring provided restaurant information.

Common issues found:

No Visit History
Other than leaving a review, there was no way to show you've been to a restaurant. This led to unhelpful suggestions for places you've already visited.

Lack of a Social Network
Three of the apps didn't let you add or follow others, which was surprising since dining out is a social activity.

Limited Saving Features
All the apps allow favoriting restaurants but there were no customization options, such as adding personal notes or rearranging saved lists.

Feature inventory comparison between the top four restaurant apps

Pluses and deltas of each competitor

Exploring User Behavior

I interviewed five restaurant app users from various ages and cities. My questions focused on restaurant discovery, the booking process, and how people give and receive recommendations.

View Interview Question Guide  ↗

Five was the max number of interviewees due to class constraints.

Analyzing User Feedback Patterns and Themes

I grouped the responses into categories for easier analysis but soon realized I was trying to tackle too many issues. I looked for patterns to prioritize.

Uncovering Real Needs: Insights and Observations from User Interviews

Key Takeaways from User Interviews

Users shared how they suggest, find, and keep track of restaurant recommendations. Some quotes that stood out:

“I’d trust a recommendation from a friend over one from a stranger or an online review”

“I keep a note in my phone of restaurants I want to try and ones I already love”

“I follow and search social media food accounts in my own city and if I’m traveling somewhere new”

“I rarely leave reviews but if I liked a restaurant, I will tell everyone about it”

How User Feedback Led to a Design Pivot

This supported my prior research that competitor apps were missing a social element. I removed my initial goal to simplify the booking process and instead, chose to focus on the social network and restaurant tracking features.

Revised Statement

How might we curate a social hub for restaurant visitors so they can track and discover recommendations through their network?

Prioritizing User Needs and Preferences

I created a user persona for a frequent diner in a large city with many choices. This user:

  • Keeps a list of recommendations from social media and word of mouth

  • Wants to find new places that are similar to ones they already enjoy

  • Wants to track places they have dined at and what they ordered

Transforming Insights into Creative Concepts

Guiding Users into the Search Funnel

The main action taken by users will be logging a restaurant. I created a straightforward user flow for this frequent task. The more users complete it, the better their personalized restaurant recommendations will be.

Bringing Ideas to Paper

I sketched some preliminary ideas of how to get users into the search funnel upon opening the app.

Refining the Sketches

I mapped out pages that users would navigate through to complete the main user flow. The goal was to avoid overwhelming users with too much information, as they would still use other apps to view restaurant details and for reservations.

Testing the Lo-Fi Prototype with Real Users

I created a Figma prototype of the search funnel and asked three users to log a restaurant. They were all successfully able to complete the task but were confused due to the lack of UI detail. This was my first prototype in Figma and I didn't know how to properly use components so it appeared glitchy.

Learnings from User Testing

  • Make all review fields optional, allowing users to share as much or as little detail as they want. Providing more information would allow the app to give personalized recommendations but it could simply serve as a way to track restaurants if desired.

  • Include breadcrumbs or a navigation bar to show users their location in the app. Because this was my first ever app design, I overlooked this until I noticed users struggling to navigate to other pages and realized they were stuck.

  • Create a more seamless prototype experience. The prototype kept resetting its scroll position every time users clicked. It didn't affect the functionality but it caused user frustration during testing.

Crafting a Cohesive Visual Experience

The lo-fi prototype had to be improved before I could retest it with users. As I painstakingly learned Figma and improved my prototyping skills, I began incorporating the brand’s look and feel into the UI.

The Name
I wanted the brand name to be clever and relevant to the app’s purpose. I created the portmanteau “Favoreats” combining the notion of people logging their “favorite” type of “eats”.

The Color Scheme
Eating out is seen as a fun social activity, and a bright purple color reflects that mood. I wanted a color palette that was distinct from competitors.

The Typography
I chose a sans serif font for the copy to make it easy to read, given the large amount of text on many pages. For the logo, I chose a more playful font to go along with the general brand feel.

Introducing Favoreats:
A Trusted Social Network for Restaurant Recommendations

The final solution focused on two main objectives:

A reliable network for trustworthy recommendations

A simple way to log recommendations
and track dining history

Homepage Highlights

Consolidate Restaurant Recommendations and Dining History in One Place

Keep a list of popular restaurants your friends and family recommend, as well as restaurants you have visited.

Tired of Going to the Same Restaurants Over and Over?

Receive curated recommendations based on your logged preferences and dining history. Restaurants you've previously visited are excluded, giving you a fresh list of choices.

See Where Friends, Family, and Foodies are Dining

View the Friend Feed for restaurants that others are logging, visiting, and reviewing. When exploring new cities, check out local foodies' profiles for dining inspiration.

Main User Flow

Save a Restaurant to Visit in the Future

You can search for a restaurant and log it as “Want to visit” or add it to a customized list such as “Date night spots”.

The restaurant page features a short summary and an address link. You can see reviews, ratings, and images from people in your network and past diners.

Log a Visited Restaurant

After visiting a restaurant, add the date visited and rate your experience on a scale of 1 to 5 stars - half numbers accepted! You can choose from a suggested list of callouts or create your own categories. Log ordered food, add additional notes, and upload pictures.

All fields are optional, giving you the freedom to use the platform as you wish.

Help Others Discover Similar Restaurants

After logging a visited restaurant, you can suggest similar places. An algorithm will assess and rank these suggestions to recommend other restaurants users may enjoy.

Extra Credit: A Personalized Profile Page

The course required only one user flow but I felt a mock profile page was needed for my app idea to be fully understood. This was a good way to continue challenging myself in Figma.

Profile Page Highlights

A brief summary of your location, number of restaurants visited, and preferred cuisine types.

Search all of your logged restaurants, view your recent dining spots, and quickly access your reviews.

An expandable section to organize your custom lists.

Preview your added connections.

Your latest dining images in one spot.

Reflection and Future Considerations

This project introduced me to Figma and the complete UX process. Looking back, there are many ways to improve the process and user experience.

Desired Process Changes

  • I only did 5 user interviews due to class limits, but I would have liked to interview more users and tailor the questions to the new focus. As I’ve gained interview experience, I’ve learned to ask questions in a situational way instead of asking questions that will lead to yes/no or short answers.

  • Design an MVP instead of including many features from the beginning.

  • Conduct user testing in multiple rounds, concentrating on one or two features at a time rather than testing the entire user flow at once.

  • Gather more feedback on what users would like to see as opposed to what I think users would like to see.

UI Improvements

Since this was my first time using Figma, I felt proud of what I learned and created. However, there are a few design changes that could enhance the app:

  • Implement a proper design system. My design system knowledge has grown exponentially since this project and having one would create consistency across components.

  • Follow accessibility standards. I didn’t know about accessibility guidelines before, but I now realize that some font sizes and touch targets would be inaccessible.

  • Use Figma variants to elevate the components, prototypes, and pages.

  • Consider all responsive screen sizes. We were instructed not to create a desktop version but I would like to consider how the design would translate to a web application.

The Future of Favoreats

What started as a class project quickly turned into an app I would love to bring to life. I received so much positive feedback while testing and sharing my product that it gave me confidence that this is an app restaurant goers would use! Stay tuned…