top of page

Barry Food delivery

Light

Mode

barry.light.png

MY ROLE

Solo designer—discovery, user research, design, wireframing, prototyping and testing

Topics

  1. Overview

  2. Understanding users

  3. Define problem

  4. Generate ideas

  5. Wireframe & Lo-fi prototype

6. Test & iterate

7. Mockup & Hi-fi prototype

8. Summary and Learning

Overview

Barry is a food delivery app that is gaining popularity due to the increasing trend of online food ordering, especially among busy people who want trustworthy and fast delivery. Barry will come to solve their problem by providing a convenient and reliable way to order food online, with fast delivery times and a wide selection of restaurants to choose from.

Food Delivery

Discover

Understand users

Users experience

Psychology

Business

Food delivery integration model

Business

Inspired by the Doordash model, for the Red Ocean business, it must stimulate the marketplace gross order value (total market order value), which arises from having a higher order volume than competitors in the long run.

​

Psychology

Users' order intentions are related to 4 main factors: price, service quality, and perceived benefits. Key issues found from user interviews: price, delivery costs, cleanliness of the food, and speed of service.

User experiences

Focus on ordering food from nearby restaurants at low prices, while also improving cleanliness and adjusting steps in ordering food so that users can receive food as quickly as possible.

ที่มา: 

  1. (n.d.). How does Doordash make money? Thestrategystory. https://thestrategystory.com/

  2. Seghezzi, Arianna & Winkenbach, Matthias & Mangiaracina, Riccardo. (2021). On-demand food delivery: a systematic literature review. The International Journal of Logistics Management. 10.1108/IJLM-03-2020-0150.

  3. (2022). DoorDash and The Myth of Profitable Food Delivery. https://www.youtube.com/

  4.  Aryani, D. N., Singh, P., Khor, Y. X., Kee, D. M. H., Selvia, K., Lee, C. W., ... & Anantharavoo, L. (2022). Factors Influencing Consumer Behavioral Intention to Use Food Delivery Services: A Study of Foodpanda. Journal of the Community Development in Asia (JCDA), 5(1), 69-79.

Define prolems

Interview findings

Following interviews with five participants, it was found that the same variables, including delivery fees, special meals, situations, and promotions, affect the volume of orders. Additionally, food cleanliness and damaged packaging irritate them.

Food Safety

It can be difficult and time-consuming to fill health conditions when ordering food from multiple restaurants. Users may also feel frustrated when they have to explain their allergies to a new restaurant each time they order.

Delivery Tracking

Users may feel anxious and uncertain about their food delivery, especially if they are hungry or have a tight schedule. They may also be frustrated if they are unable to track the location of their rider or if their order is delayed or canceled.

Order Management

The ordering process can be long and complicated, especially for users who are new to the app or who have specific dietary restrictions. Users may also feel frustrated if they have to enter their address and payment information multiple times.

User personas

per1_edited.jpg
per2_edited.png
BMB.ux.portfolio (1).png

Two user participants from the group of five represent two different types of professionals: the first is a government official with an economical lifestyle who wants to cut down on transaction fees, and the second is a private official who wants to enjoy using various investment products.

Their journey

jnmap.pj2.png

Users are a little eager to sign up and register an account after downloading and installing the banking application. When entering personal information, they want to have trust that the user interface is secure. However, they think it tedious to read and confirm the PDPA consent and agreement conditions, and the majority of them prefer to skip. Additionally, they experience frustration during authentication and facial verification. They feel good when the signing up process is complete and they can begin performing transactions, making deposits, or withdrawing money.

Generate idea

Ideas were first developed using a variety of techniques, including competitive analysis, crazy8, card sorting and information architecture.

big.compaudit.png

Competitors analysis

.36crop

Result of the open card sorting

Information architecture

Idea summary

In addition to having trustworthy reputations and professional user interfaces, our direct and indirect competitors also excel in these areas. We want to create a similar experience for our users while also humanizing the content and providing shortcuts for features that are relevant to their everyday lives. The findings of card sorting and information architecture indicate that we should divide the material into three primary categories: "Manage," "Benefits," and "Contact." We will also incorporate money management feature.

crazy8ppt.jpg

A Crazy 8 tool to sketch many drafts of the interface of a responsive website

Wireframe 
& Lo-fi prototype

In the ideation process, we generate the sketches from Crazy 8 into wireframes and make page interactions into prototypes for desktop and mobile.

lofi.desktop.canva 30 aug.png

Medium desktop prototype

lofi.mobile.30aug.png

Medium mobile prototype

Usability test

Usability test from 5 participants with 20 minutes for each round to validate the prototype and identify issues, bottlenecks, and complexity of flows from users experiences.

usbt.collection.png

Affinity diagram 

Accumulating plenty of information and ideas from the usability test. Then organize the data into 7-8 meaningful themes, including home and overall page flow, confusing pages, scrolling to unlock terms, details of identity cards, face verification, etc.

pj2.affinity diagram for Canva.30Aug.png

Organize users' themes to find insight.

Prioritize the insights

🔴 P0 

  1. After inputting, password fields need to be covered, and there are rules for secure passwords.

  2. Importantly, the page should scroll such that the accept button can be enabled

  3. The choice button with the positive flow should be more noticeable than the reject button when denying consent or terms.

  4. The snap button and face scanning were unclear

    • A camera mask guideline for face scanning.

    • When users bring their face close to the appropriate mask, the scan or snap button should automatically activate and snap.

  5. NDID guide and maybe checking the password again is not necessary.

  6. OTP and email verification pages are absent

 

 ðŸŸ¡P1

  1. The product page wasn't sure which option to choose for signing up

    • Make the product card intuitively understandable with the title.

  2. More identity card details are required for registration.

  3. The homepage should prioritize each menu, and many people prefer vertical flow to horizon.

Summary

Based on findings from a usability test and affinity diagram involving five participants, key recommendations for UX/UI design improvements include clear password setup instructions and concealed fields for enhanced security. Simplifying the terms acceptance process by enabling users to scroll for the accept button and adding buttons to the decline dialog will reduce friction. Improving the visibility and functionality of the snap button for face scanning, along with automatic triggering when the user's face is correctly positioned, should enhance efficiency. Implementing a camera mask guideline for face scanning is advised. Eliminating the need to reconfirm passwords on the NDID page and addressing the absence of OTP and email verification pages are also crucial steps to streamline and secure the user journey.

Home page
& Product introduction

Mockup example

Hi-fi prototype

localbank.desktop.flow.png
flow.mobile.jpg

What I have learned and next

  • Conduct a further one or two usability tests to evaluate the design and flow of users' experiences.

  • It is necessary to compare the KPIs for user experience (time on task, success rate, error rate, drop-off rate)

    1. Within the subject (between the low-fidelity prototype and the high-fidelity prototype),

    2. Between-subjects (between the BMB website/app and other banking/investment apps)

  • Develop other features, i.e., investment options, investment tools, global stocks, and other financial products.

  • Adjustable view for more personalization.

  • Dark Mode

Beach Day

Let's explore the other projects.

bottom of page