Jasmine Mai

— PERSONAL PROJECT

Yelp App UI/UX Redesign Case Study


— DURATION

July 2021 – September 2021


— TOOLS

Figma

What is Yelp?

Yelp is a popular mobile application (also available on the web) where users post and read reviews about businesses. Users also use Yelp for


1. ordering food delivery or pickup

2. reserving a table at a restaurant

3. see ratings of a business

4. explore what a business has

5. booking appointments


Why redesign Yelp?

During the lockdown, many businesses closed, reduced their hours, or added new regulations to their indoor/outdoor dining and takeout/delivery options.


I didn't use Yelp much at the time other than to see what's new and popular. But, I started to use it again since I started to see more ads for it with good deals at my local restaurants. The mobile application has more navigation pages other than the tabs at the bottom. These were all located under either the "Me" or "More" tabs. The location of these navigation pages was not intuitive. Some of these pages had the same name but led to different pages or were in multiple tabs.


App Analysis

Although I do use Yelp from time to time, I only use a few features. It also has been a while, so the mobile application has changed a lot. So, I will explore the app more in detail to learn more about its navigation, other features, and architecture. I want to improve the user's experience.


Reviews found on the App Store


User Interviews

For user research, I interviewed a couple of Yelp users. Some use the app very often, while some rarely use it at all.


What I learned from the interviews:


1. The most used feature is to search for businesses with the most reviews.

2. Most users read reviews for recommendations and to see what's popular at a restaurant. Some say it can sometimes be hard to find recommended items from other users' reviews, or many reviews are too lengthy to read (and not guaranteed a recommendation).

3. Few users are not aware of the social aspects of Yelp, such as messaging systems, friends, and followers.

4. Some users check their friends' and the people they follow's activities often to see popular businesses and read reviews.

5. Most users use the app to create a collection of businesses they are interested in visiting one day or save collections created by other Yelp users.

6. Some look at menu photos of a business to see prices but they are unsorted and there is no option to sort them.


Usability Testing

I had the same group of Yelp users test the Yelp mobile application. Most use it often while one uses it once in a while. I wanted to see their experience and how they used the application. The tasks that I wanted them to do were:


1. Open the application and search for actual businesses that they are interested in (i.e. Burger King)

2. Search for broad businesses of interest

3. Use filter options from search

4. Bookmark the businesses that they like

5. Add a friend(s) if you like their review(s)


Users' Needs

1. quicker access to friends' and followers' activities

2. to be able to view friend request(s) and sent

3. to be able to sort a business' photos

4. to be able to cancel friend request(s)

User Persona

Here are user persona based on the user interviews. Most Yelp users are young adults that like to explore new businesses or see what is trending/popular around them. Users want a reliable source of user reviews/photos of a place before visiting. They also like to see where their friends are going and what they are buying. Another group of users uses Yelp to find new restaurants to try.

Wire-framing


Profile Page and Friending System

The Redesign


Profile Page: Options


Current Design on Yelp

Below the Yelp user’s name, location, and the number of friends, reviews, and photos/videos, there are three interaction options: compliment, add friend, and more. When you click on more, there is a slide-out menu with two options: message and follow. Slide-out menus are to hide additional navigational links. In this case, the more is only hiding two. “Follow” is an essential feature to most users, especially users that don’t want to add friends but want to see their activities.


The Redesign

For my redesign, I replaced the “More” button with the “Follow” button and added the “Message” button next to it. Doing this will make it quicker for Yelp users when they visit another user’s profile page and reduce the number of taps.

Profile Page: Cancel Friend Request


Current Design on Yelp

If a user adds a friend by accident or changes their mind, they cannot cancel the request. After the user taps on "Add Friend", it will change to "Request Sent".


The Redesign

When a user taps on "Add Friend", the icon will change to an out arrow to indicate request sent. Instead of changing "Add Friend" to "Request Sent", I made it change to "Cancel Request". That way, tapping on "Cancel Request" will undo the friend request and change it back to "Add Friend".

View All Friends & Options


Current Design on Yelp

From the user's profile page, tapping on "Friends" will take them straight to their list of friends.


The Redesign

Instead of going straight to the friend list, I added sub-pages to the "Friends" page. These pages include:


1. All Friends

2. Friend Requests Received

3. Friend Request Sent

4. Find Friends


Tapping on "All Friends" on the Friends page will take the user to their list of friends. I also added the number of friends at the top.


Tapping on "Find Friends" on the Friends page will take them to the current "Find Friends" design. I didn't redesign that page. I just added it as a sub-page for better organization.

Friend Requests Received


Current Design on Yelp

Yelp's mobile app currently doesn't have this feature.


The Redesign

Tapping on "Friend Requests Received" on the Friends page will take the user to a list of Yelp users that requested to be friends. Here the user can either accept or remove the friend request. When a user accepts/removes a user, the buttons will disappear and depending on the action, either "Accepted" or "Removed" will appear to let the user know the action is completed. This page will help the user keep track of who sent them a friend request instead of in notifications. Currently, when a user gets a friend request in notifications, the options are "Accept" or "Ignore". I replaced "Ignore" with "Remove" because ignore makes it seem like a user is putting it aside.

Friend Requests Sent


Current Design on Yelp

Yelp's mobile app currently doesn't have this feature.


The Redesign

Tapping on "Friend Requests Sent" on the Friends page will take them to a list of friend requests that the user sent. Currently, users cannot check who they sent friend requests to. A user could change their minds later on and want to cancel their request(s). But, if they don't remember who they sent friend requests to, it'll be almost impossible to do so. With this page, they can tap on "Cancel Request" to cancel easily.

Takeaways

This was my first time doing a case study, and I learned a lot from it. After reading hundreds of reviews on the App Store and talking to Yelp users, I can see the importance of users’ experience when designing an application. I noticed there were some common needs based on what Yelp users say. For example, clustered and unorganized UI can make a user not want to use the application anymore. Overall, this case study helped me work on my design skills.