Project Overview
Problem Statement
Busy workers in the Sarona business area (Tel Aviv, Israel) don't have enough time to cook or buy food.
Office workers, locals, and visitors do not have information about newly opened restaurants in the city.
Sometimes, restaurants don't have an option for delivery.
One of the popular features to plan the order and split the payment does not exist in most places.
In addition, there isn't the option to schedule your food order and split the payment on corporate order.
Possible Solution
To design an app for people who want to explore and order food easily. Provide order customization.
Workers will be able to order food and get it immediately
or after several hours/days, depending on their needs.
Office workers will be able to split the payment on the corporate orders.
Project duration
My role
UX/UI designer leading the dedicated mobile app design from conception to delivery
Tools used
March 2020 to January 2021
Design Process
For this project, my responsibilities included, UX strategy and visual design
Understanding the user
First, I conducted surveys and user interviews, building problem statements, personas, user journey mapping, and user flows. Then, after brainstorming, I created the paper wireframes and Lo-Fi prototype and conducted the first round of usability studies.
After gaining some insights, I built a hi-fi prototype and then tested it to ensure a fluid user experience throughout the mobile
application.
For my research, my target market was users aged 19 to 45. Professional workers in the area preferred to order food because of their busy schedules. Although their backgrounds and food preferences differed, all users expected high food quality and delivery speed, and food diversity, especially Mexican food.
Key insights derived from the interviews
-
Customers usually are unable to imagine the dishes without pictures.
-
Customers are not able to understand the dishes on menus without descriptions.
-
Customers feel difficult to read menus efficiently without well-organized categories.
-
Modern applications use modern ways to pay and different payment methods like a split payment.
-
From time to time, users look for new places to order food from and always stay with those who can come up with special prices/offers.
Personas
The following personas represent the user segments for the mobile app.
Personas explain the user's goals, challenges, demographics, and behavior.
User Journey Map
I made a visual representation of the user's journey across all touchpoints of our application to understand where it’s possible to improve the user experience.
User Flow
This user flow was created to illustrate how the user will navigate through the website.
Low & High Fidelity Design
Step 1: Low-fidelity wireframes sketched on the paper represent the skeleton of the interface
Low Fidelity Digital Wireframes
Step 2: The basic structure of the wireframes can be changed per usability testing outcome quickly and efficiently, making the process iterative before development efforts.
Step 3: Digital Wireframes in Figma.
Digital Wireframes
Big hero image
of the main screen
Log in/Sign Up
options
Different dishes are well categorized and displayed in a horizontal scrolling menu.
Scrolling menu with images,
basic description, add to
cart/favorite options.
Main navigation bar
Product page with big and quality image/gallery.
Add to cart CTA button
Usability Study
I conducted two rounds of usability studies. After the first round, I was ready to create Mockups. In the second round of the usability study, I used a High Fidelity prototype that revealed additional refinements.
Refining the Design
I conducted two rounds of usability studies. After the first round, I was ready to create Mockups. In the second round of the usability study, I ran High Fidelity prototype that revealed what aspects of the project I still needed to refine.
High Fidelity Digital Wireframes
The high-fidelity prototype included the design changes made after the usability study.
High Fidelity Prototype
Refined designs
Going Forward
Takeaways
Impact
Users shared that the Tel Mex app seems like something they could help to order simple and easy way food from the restaurant.
One quote from peer feedback:
"The app is easy to use for work people who want to order food on time. I like the navigation steps"
What I learned
I've learned that even if the problem I'm trying to solve was huge, diligently working through each step of the design process and adapting it to specific user needs allows me to come up with solutions that were both feasible and useful.
Next steps
Conduct research on how successful the app is in helping people make a fast order with this app.
Add more functions that might be useful for users.
Provide chat function to make it easier to contact the restaurants and check the order status/ask a question online.