Dinner Crave
Background
In response to the escalating demand for streamlined and effective food delivery services in today’s dynamic landscape, this case study delves into the motivations driving users to seek a dependable food delivery service website. The objective was to comprehend the reasons behind users’ preferences for food delivery apps and identify potential challenges they encounter during their interactions. Over a period of one and a half weeks, I lead the design, prototyping, and research efforts for the Minimum Viable Product (MVP) of a food delivery service website.
Methods:
Directed Story Telling
Affinity Diagramming
Think-Out-Loud Method
Usabiliity Testing
Role:
Product Designer
UX Researcher
Tools:
Figma
Fig Jam
Google Slides
Defining the Problem
To grasp the intricacies of users’ challenges, I employed a directed storytelling research method. This method provided insights into users’ perceptions of current food delivery service websites and helped identify key pain points.
3 out of 3 participants experienced orders delivered to the wrong address
All of 3 participants faced instances of missing items from their orders
2 out of 3 participants highlighted concerns about the high cost of food delivery
All of 3 participants commonly ordered food for dinner after returning home from work
All 3 participants found it challenging to communicating with delivery drivers for drop-off instructions
With these findings in my mind, the overarching goal was to craft a food delivery site tailored to the needs of busy students and young professionals, and offer affordable, reliable, and contactless food delivery service, allowing users to unwind and enjoy a meal in the comfort of their homes after a long day.
When I go to the app and don't have to look through hundreds of tabs for food options with a seamless delivery - that what I consider a successful order
M.F.
Understanding Our Users
To align with this goal, low-fidelity wireframes were sketched, ensuring a hierarchy in page elements and maintaining consistency across designs. The design incorporated a prominent logo and navigation at the top, with affordance in the rating system. A dimmed and blurred background indicated the importance of user surveys. A standardized navigation bar across screens enhanced user understanding of website continuity, and a strategically placed search bar facilitated easy food and restaurant searches.
Design Goals
Developed 3 low-fidelity wireframes targeting the defined user group.
Ensured a clear hierarchy with a consistent navigation bar across screens
Incorporated affordance in the rating system with a dimmed and blurred background during user surveys
Established a search bar mental model at the top of the screen for user interaction
Reliability
Implemented overlays to enable users to see assistance, confirm delivery, and provide ratings for both food and delivery. A prompt encouraged users to provide feedback if they rated the service poorly
Design Decisions
Time and Affordability
Introduced dedicated sections on the website listing the most affordable restaurants and options for the fastest food delivery catering for users that are in a hurry or with time constraints.
Scenario 1: Order Food After a Long Day
3 out of 3 participants understood to click the plus button to add items to the cart
2 out of 3 participants successfully navigated to the cart for checkout due to the red notification that appeared when items were added.
1 out of 3 participants initially missed the notification but eventually found the cart in the navigation bar for checkout
Usability Testing and Findings
Usability testing was conducted with a sample size of three participants, employing a think-out-loud approach to assess the information architecture’s usability. The participants were presented with a series of scenarios to gauge their interaction with the website.
Scenario 2: Changing the address
3 out of 3 participants initially missed the notification but eventually found the cart in the navigation bar for checkout.
Scenario 3: Reporting an Unsatisfied Order
3 out of 3 participants initially clicked the hamburger menu for initial navigation.
3 out of 3 participants were confused about whether to click on Support or Orders, with all opting for Support based on guesswork.
3 out of 3 participants successfully submitted a report on an order
Overall, users demonstrated ease in navigating the site and accessing crucial information related to placing an order, achieving a 100% completion rate with minimal frustrations.
Final Solution
The final design embodies a user-centric approach, addressing key pain points, ensuring reliability, and providing accessible options for time-sensitive and budget-conscious users. Informed by insights derived from the usability testing phase. The design decisions, rooted in usability findings, have significantly enhanced the website’s functionality, contributing to a refined and efficient final solution.
Next Steps and Learnings
The usability testing phase has not only validated the effectiveness of the current design but also provided valuable insights for ongoing improvement. As we move forward, the following key steps and learnings will guide the iterative process:
Notification Optimization: Implement a quick pop-up notification system for added items to enhance visibility and user confirmation, addressing usability test findings.
Subtotal Visibility: Introduce a feature displaying the subtotal of items upon hovering over the cart in the navigation bar, fostering transparency in the checkout process.
Enhanced Delivery Instructions: Redesign the presentation of delivery instructions in the order summary for increased prominence, addressing concerns raised during usability testing
Terminology Refinement: Rename the “Orders” section to “Past Orders” for improved clarity and alignment with user expectations
Delivery Confirmation Text: Modify the text in the Delivery Confirmation pop-up to read “Help,” accompanied by a red button, for heightened visibility and user comprehension.
Sidebar Adjustment: Rename the “Support” sidebar to “Help” in red, streamlining user navigation during urgent situations based on usability test feedback.