La foodie app
THE PROJECT
The product:
This project was to develop a menu and food ordering app which is ultra simple to use for busy professionals and families who have little time to make decisions.
The problem:
We are addressing the need for a simple visual app to order meals faster.
The goal:
We want to simplify ordering food online for busy professionals and families to order more easily in a few steps to save them time.
Responsibilities:
Here are the key phases of my project:
Ux Research, Competitive Analysis, Creating personas, Wireframes (Paper & Digital), Lo-Fi Prototype, Usability studies, Hi-Fi Prototype, Testing.
Project duration:
June 1st to July 15th
My role:
For this project, I conducted all steps of the app design including empathizing, ideating, defining, prototyping and testing my design.
User research
I conducted my UX research through personal interviews. The goal was to learn about food ordering habits of different profiles, understand their pain points in existing apps and find out how to make their experience more pleasant. At the start of my project, my own bias made me focus on family-oriented features and restaurants as I could relate. The UX Research conducted made me realize that some users where not interested at all by family-oriented features. Therefore, I adapted my design to include global users needs while keeping some features that could be useful for all types of users.
User research: pain points
Ordering takes time
Most respondents to my UX Research found that ordering took too much time.
Existing apps are overwhelming
Some users pointed out that too much choice makes decision-making difficult.
Unrealistic delivery delay
The estimated delivery delays depicted on existing apps are only approximate and most of the time, it takes a lot longer
Personas
User Journey
The user journey was originally done for a in-restaurant order but then adjusted for an at-home order.
PAPER WIREFRAMES
When creating my paper wireframes, I had so many ideas and the challenge was bringing them all in one frame to keep the best of it. Looking back, my final prototype is much simpler than the original one!
DIGITAL WIREFRAMES
During this phase, I learned a lot on how to place my design to stay consistent with the users’ needs.
Further to our first usability study, we adjusted our wireframes pertaining to the users’ comments to reflect them and make the app easier to use
Low-fidelity prototype
usability study
During the course of the project, I conducted two unmoderated usability studies including a total of 10 participants. The participants where chosen with the following characteristics: 25-50, 40% women, 40% men, 20% non-binary with at least one participant using an assistive technology.
Round 1 findings
-
Users want an easy way to access favorites.
-
Users want different categories to which they related (more inclusive)
-
Users enjoy the recently ordered but don’t find it obvious enough
Round 2 findings
-
Users want to track their progress as they make the order.
-
Users want an easier way to modify their order.
-
Users want the recommended for you to be categories instead of restaurants
Round 1 Affinity Diagram
Round 2 Affinity Diagram
Refining Mockups post-usability study
Further to the second usability study, I added a checkable box and a time selector for delivering the order at a specific time. I also added a discover button and changed the name of restaurants for cuisine types. The discover button leads the user to a discover page as shown below.
To address the comment of users wondering where their order went when they clicked the add more button in the order summary, I added mirror screens with the cart containing a 1 to reassure the user that his items are still in the cart.
high-fidelity prototype
accessibility & key takeaways
Accessibility
​
-
I have made sure to follow contrast standards in order to have a visually accessible app.
​​
-
My app follows Hierarchy Principles to enable users to use a Screen Reader.
​
-
I have used a lot of images and icons to guide users which are unable to read.
Key Takeaways
​
Impact
My menu and food ordering app is designed to offer a super quick and easy ordering experience to avoid getting overwhelmed and complete an order within a minute for users that are super busy.
​
What I learned
I have learned that usability studies are super useful to addressing users’ needs which are not always obvious to us designers.
next steps
The first thing to address is adding a stepper bar to track progress throughout the ordering process. This will be most likely added to replace the search bar.
The second aspect to address is the home screen buttons. Finding a more attractive way to place them so they stand out more but without hiding the image.
Over the next iterations and releases, I would like to improve accessibility by adding a new language to the app.