Beli

Food Rating App

UX/UI Design Personal Project

Problem

Beli's rating page overwhelmed users with too many choices, and the lack of menu search made it hard to log specific dishes — turning a simple task into a tedious one.

Team

Solo

Role

UX/UI Designer

Duration

Jan – Mar 2025

Product

Beli is a food rating and restaurant tracking app. I redesigned the rating page and added menu search and autofill to make logging reviews faster and less frustrating.

Goal

Redesign the rating experience to reduce cognitive load and introduce menu search and autofill features that help users quickly log the dishes they want to review.

Responsibilities

UX Research • User Interviews • Problem Definition • Sketching • Wireframing • Prototyping

01 Research: User Interviews

Users often forget menu item names, and the "Add Favorites" feature remains unused.

To see if others shared similar frustrations, I surveyed five Beli users, ages ranging from 18 to 30. From this survey I discovered the following:

User Finding

4 out of 5 users

forget the name of their menu item at least 50% of the time when rating a restaurant.

Most Commonly Used Features

Add photos
Add notes
Who did you go with?

Least Commonly Used Feature

Add favorite dishes

with 80% of users stating they either never or rarely use it, reporting that it was redundant or that they did not have a favorite dish to add.

"I never understood why Beli put the 'Add Photos' option at the bottom of the screen. It's the feature I use the most, and it's hard to find."— Beli User

"Sometimes you just don't have one favorite dish, and other times you may have many, so I usually just include all of my options in the notes section."— Beli User

02 Define

Primary objectives: enhancing menu search and restructuring rating page

From the survey, I learned that users rarely used the "Add Favorite Dish" feature, even when they had favorite dishes, indicating a disconnect between users' goals and the app's current functionality. Many also struggled to remember the names of their dishes.

These findings shaped my goal of creating a smoother, more intuitive rating experience, driven by two objectives:

Enhancing Menu Search — How can we implement a more efficient system to help users quickly find and log the dishes they want to review?
Streamlining Rating Experience — How can we reorganize the rating screens to reduce cognitive load and streamline the review process?

03 Ideation

Combining autofill and menu search solutions.

I focused on creating a new feature to improve menu discovery and narrowed it down to three potential options, brainstorming pros and cons for each.

Feature	✓ Pros	✗ Cons
Autofill / Suggestion Bar	Helps find menu items given a small keyword Seamlessly adds items into a sentence Familiar from iMessage and other apps	Multiple items may start with the same word Won't help if user can't remember any keywords May autofill words unrelated to the menu item
Menu Search	Browse the entire menu without remembering names Keyword search also available Categories make items especially easy to find	More taps required: search → scroll → click on item Must repeat the process for each new item added
@ Symbol to Trigger Search	Signals intent to autofill a menu item Familiar from @-mentioning on other apps	May confuse users who want the symbol literally Users may not know the symbol activates search

I decided to combine autofill and menu search solutions. Autofill would give the user a quick and easy way to add food items to their notes seamlessly, while menu search would allow them to scroll through the entire menu to find what they are looking for.

04 Sketches

Reorganizing the ratings page, designing menu search, and incorporating autofill.

I began roughly sketching out my vision for the autofill and menu search features I wanted to include on the rating screen.

Menu search sketches — Incorporating "Search Menu" button to rating screen, allowing users to browse through the full menu and add it directly to their notes.

Autofill sketch — Autofill feature on rating screen that suggests menu items as the user types.

Rating page sketch — Removing the "Favorite Dishes" feature and improving hierarchy by grouping related features, reducing visual clutter, and giving the impression of fewer options.

From my sketches, I created a mid-fidelity mockup that makes "Add Photos" a large button at the top, followed by the notes section right below it.

Before and after Beli rating page redesign — Too many features, difficult to locate specific one. Distinct photo and notes sections for quicker reviews. "Search menu" button to add dishes straight to notes. Removed "Add favorite dishes," leaving fewer options and reducing cognitive load.

My main goal was to avoid feature overload on the rating page, leading me to use progressive disclosure to break the review process into more manageable steps.

Beli redesigned user flow — User flow: Users are first asked how they liked the restaurant, followed by the main rating page, where they can use autofill or the "Search menu" feature.

05 Solution

Reviews Reimagined: Restructuring Ratings Page

Improved visual hierarchy to streamline the rating process
Progressive disclosure to make reviewing more manageable
Autofills as you type for a seamless rating experience

Menu Page: Searching Made Fast and Convenient

Directly access the menu from the rating page
Browse the entire menu
Add item straight to your notes

06 Reflection

My next steps.

Beli has made my food adventures across cities far more enjoyable. With my autofill and menu search features and restructured rating page, I hope to make ranking favorite spots effortless.

There are still ideas I'd love to bring to life. Through my user research, I unexpectedly discovered that none of my interviewees used Beli's "Featured Lists," where Beli recommends popular restaurants. To better align with user needs, I want to restructure the home page into two distinct sections: one for personal ratings and another for popular suggestions.