SHAZAM FOR FOOD OR?- Mobile App UI Design Process

Published in

Friends of Figma Lagos

4 min readJul 31, 2018

You watch Silicon Valley? Yeah, cool.

Remember Jin Yang and his app thing, then Erlic’s modification of the seefood app? See food, Snap Food, See Information about… Okay, you get it now.

Taking it as an opportunity for me to improve my visual design skills and improve my design process by creating a mobile app for the iPhone X.

One thing clear in this project is that it was focused on UI design which didn’t include much of UX design; for example — user research, user journey, mapping, etc.

Task

UI Design for a simple app that shows food information when snapped.

Process

People go to eat at restaurants and events and find foods they enjoy and sometimes want information about the food they had or even information about food before making an order.

Also, Tourists or people new to an environment often have trouble identifying which food is what.

However, with an app like Shazam — but for food, users can see foods they like, take a picture, and get nutritional and other information about the food displayed on the app. This would solve the problem righttt?

User Personas

While designing this App, I took into consideration two main classes of people this app will benefit immensely.

Lifestyle/Restaurant review blogger - These bloggers are the people we can count on to review restaurants for quality of food, ambience, service, price range and so on.

2. Foodie — this person has an ardent love for food and beverages. A foodie seeks new food experiences as a hobby rather than simply eating out of convenience or hunger.

Wireframes

After I had a better understanding of user goals and behaviours, I sketched the app to have a visual of it looks and plays out.

The app should have a camera for users to take a picture of the food.
Nutritional content for those who are mindful of what they eat.
The app should have like/love button for users to group the foods they love.
Recipes for those who love to experiment

User journey

How will the app work?

The user arrives at an app camera, the user can immediately take a picture of intended food and the app provides some additional information; History about the food, nutritional content, How else the food can be eaten and so on. The app is easy to use and straight to the point.