Foma - Food ordering mobile application
Foma - Food ordering mobile application
Foma - Food ordering mobile application

UX CONCEPT CASE STUDY

Foma

Foma

Food Ordering Application

The product

FOMA is a street food ordering mobile app that helps users order food conveniently and quickly.

Project duration

May 2023 - Jun 2023

My role

UX Designer designing from conception to delivery.

Tools I used

Figma, Adobe Photoshop, Adobe Illustrator

Understanding The Users

User Research

Summary
  • I conducted interviews and created empathy maps to understand the users I’m designing for and their needs. A primary user group identified through research was working adults who don’t have time to cook meals.

  • Research revealed that time was not the only factor limiting users from cooking at home. Other user problems included obligations, interests, or challenges that make it difficult to get groceries for cooking.

Pain Points
  • Time: Working adults are too busy to spend time on meal prep.

  • Accessibility: Platforms for ordering food are not equipped with assistive technologies.

  • Information Architecture: Text-heavy menus in apps are often difficult to read and order from.


Persona


Problem Statement

Leah is a doctor who works long hours in a mid-size hospital, who need to find a street food ordering mobile app that’s easy to use and accessible because she has visual impairment.


User Journey Map

Goal: Find a street food ordering mobile app that’s easy to use and accessible to her despite her visual impairment.


Starting Design

Sitemap


User Flows


Wireframes

Taking the time to draft iterations of each screen of the app ensured that the elements that made it to digital wireframes would be well-suited to address user pain points. For the home screen, I prioritized a quick and easy ordering process to help users save time.


Usability Study

I conducted two rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.


Refining The Design

Design System


Mockups

The first usability study

Early designs allowed for some customization, but after the usability studies, I replace the food card in the more clearly place on the screen.

The second usability study

The second usability study revealed that users need better cues for what steps are required to edit the profile, so I adding a Edit button and the edit icon beside each profile tab.


Screen Mockups


Accessibility Consideration

  • Provided access to users who are vision impaired through adding alt text to images for screen readers.

  • Used icons to help make navigation easier.

  • Used detailed imagery for foods to help all users better understand the designs.


Going Forward

Takeaways
  • Impact: The app makes users feel like it really thinks about how to meet their needs.

  • What I learned: While designing the Street food ordering app, I learned that the first ideas for the app are only the beginning of the process. Usability studies and peer feedback influenced each iteration of the app’s designs.

Next Steps
  • Usability study: Conduct another round of usability studies to validate whether the pain points users experienced have been effectively addressed.

  • User research: Conduct more user research to determine any new areas of need.

  • Foma app screens isometric mockup
  • Foma screen mockup 01
  • Foma screen mockup 02
My contact

songquynh.tran.7@gmail.com

(+84) 0869 910 785

© Song Quynh 2023

My contact

songquynh.tran.7@gmail.com

(+84) 0869 910 785

© Song Quynh 2023

My contact

songquynh.tran.7@gmail.com

(+84) 0869 910 785

© Song Quynh 2023