Food Delivery App
Tracking | Notification part
PROJECT OVERVIEW
The Product
The focus is on a clean impression, almost reminiscent of a bistro or fine-dining restaurant, the style is appealing. The quality of the food is a key factor in standing out to customers, which the app already puts in the centre.
Key challenges
Users find it frustrating to be surprised by the delivery or not to be able to track where it is in order to make arrangements or make better use of the waiting time.
The Goal
Develop the tracking and notification part for the food delivery app that, according to initial research, it would be easier to visualise and offer better interaction and notification options for the user.
My role
UX designer designing a tracking and notification part for VAIVAI food delivery app from conception to delivery.
Responsibilities
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.
Target audience
Urban millennials
UNDERSTANDING THE USER
In SUMMARY, users want to know exactly where their delivery is and how long it will take to arrive so they can fill the waiting time with important matters without being interrupted by the driver. The app should remind them of this at the right time and be visually clear and efficient. Users also want to be able to communicate with drivers, restaurants or the service.
29 | São Paulo | College degree | Single Mom, 1 Son | enrolled in further education
Maxime
Maxime’s time is incredibly precious to her, and so she has little patience with anything that wastes her time unnecessarily. She loves to cook, but sometimes she doesn’t have time for it and prefers to order something so she can spend more time with her son.
Goals
Clear process so you don't have to look at your phone all the time
Making the process easier by graphical icons and images
Frustrations
Struggling with complicated settings and menus
Not to be notified, not being able to cancel
STARTING THE DESIGN
PAPER WIREFRAMES & DIGITAL WIREFRAMES
Taking the time to draft iterations of each screen of the app on paper ensured that the elements that made it to digital wireframes would be well-suited to address user pain points. As the initial design phase continued, I made sure to base screen designs on feedback and findings from the user research.
LOW-FIDELITY PROTOTYPE
Using the digital wireframes, I created a low-fidelity prototype. The primary user flow I created was to set a reminder, navigate to all tracking details and contact the driver so that the prototype could be used in a usability study.
BEFORE AND AFTER | LOFI
P01 | Users need better guidance on what steps are required to get from the thank you page to the notification page.
Supporting evidence from the usability study
Inserting a real wording for orientation
Better accessibility of the button
Minimise the page to one button
Get rid of the menu
“There were only two options -
Menu and Next, so it was easy to find” | Micha
REFINING THE DESIGN
HIGH-FIDELITY PROTOTYPE
The final high-fidelity prototype offered a clearer user flow. It also met users‘ needs for a reminder option and for an easy and quick way to access the information they need.
MOCKUPS
ACCESSIBILITY CONSIDERATIONS
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 and colours to help all users better understand the designs.
TAKEAWAYS
IMPACT
The app offers real help to users to get information in time and keep track of everything.
“The app is so neat, I can finally see all the info I need in one place. ” | Samuel
WHAT I LEARNED
Through repeated interviews and improvement loops – the fluffy animations, and the application of design principles make the app almost feel like part of a real product.
The consistent application of the product life cycle was a revelation.
NEXT STEPS
Conduct another round of usability studies to validate whether the pain points users experienced have been effectively addressed.
Conduct more research to determine any new areas of need.
Completing the app with the full range would be the biggest challenge.
