FOTA: A Case Study on a Food-Finding App
Context:
In 2017, I created Fota with my brother and a couple friends to make it easier and more fun to find places to eat. Specifically, we thought that seeing food photos helped us make decisions much more quickly than reading through boatloads of text-heavy reviews. We were a team of five, and for the development of this app, I collaborated with three engineers.
Goal:
To create a food-finding app that primarily uses photos to help the user find a restaurant. This design breakdown will review the creative decisions that went into Fota’s UI and branding material.
Role:
Solo Designer
Design Objectives:
1. Make food photos the center of the user experience
2. Make it easy and quick to judge a restaurant
Home Page
The homepage dedicates the majority of its visual space to the photo feed. This way, the first thing a user sees is food photos. Infinite vertical scrolling makes it easy to scan many photos at once and find something that captures their attention.
Restaurant Page
Our user flow follows a simple logic — if a food post captures your interest, tapping on the photo brings you to a page that tells you the most relevant and actionable information for getting to that food.
The restaurant page balances both of our design objectives by providing (1) a relevant logistical information for eating and (2) a mosaic of other food options at that restaurant. There are three main sections of the restaurant page:
1. Restaurant Header
This header is designed such that the user can instantly confirm their most relevant logistical questions for choosing a restaurant: Is it open? Is it accessible? Is it affordable? Do people like it?
2. Photos/Reviews
This section dedicates visual space for exploring more nuanced information of the restaurant: photos and reviews.
3. Bottom Bar
A simple bottom bar for actions the user might want to take to make their decision.
4. A Note on Layers
The restaurant page has two layers:
Layer 1 contains the header and bottom bar and Layer 2 contains the Photos/Reviews section. Layer 2 always scrolls beneath Layer 1.
Below is a late draft of the app in action (you can still see some things we needed to tweak). The key thing to notice is the way elements of the restaurant page respond to scrolling up. This way, the user has the majority of the screen to see restaurant photos/reviews. When scrolled further, the photos/reviews section scrolls underneath the condensed header as specified above.
The Order of Information
It matters what order we present our information in. For example, showing our user directions to a restaurant is useless if they’re not interested in eating there in the first place. Thus, our hierarchy of information is ordered such that you don’t see the next layer of information until it becomes relevant to your decision. Here’s how we prioritize our information:
Here’s this hierarchy information presented as a user-flow. The less relevant a piece of information is, the more gestures it takes to reach it.
Branding and Marketing
I wanted to briefly discuss the design material outside of Fota’s user interface. As our team’s only visual designer, I also designed the app icon and logos and the rest of our marketing material. The main goal for all of this material was to promote our unique focus on food photos.
Logo and App Icon
I designed this logo to mainy evoke two things: (1) Donuts for food, and a bite for hunger 😋, (2) A Camera lens for our focus on photos.
A year after working on this project, I saw this sign while visiting Asia. Do you notice anything suspicious?
It seems that a company named “Eatsy” had a similar logo idea… COINCIDENCE?! Folks, you decide. 🥴 (If you’re having trouble telling the difference, my logo is the one on the right.)
Promotional Material
To prepare for our local launch in 2017, I had to prepare a lot of marketing material from social media banners to video advertisements. Below is an advertisement I created for Facebook:
Conclusion
We shelved the project in 2018, but future updates to this app would’ve involved much more thorough user research. There are a lot of neat features in this app that users may not have wanted, and a lot of missing features that users did want. We’d only know until we actually asked them ourselves.
Next, especially during post-COVID times, this app would need to accommodate food deliveries. Thanks for reading!
