Globefish is a local sushi restaurant. The main purpose of the Ordering App is to allow customers to place take-out orders directly through their platform.

Overview of the current UI:

Background

To understand the problem users are experiencing with the app, I set out to conduct user interviews.

The objective of the user interview is to understand:

users’ general expectation for food ordering apps
users’ motivation to user food ordering apps
users’ pain points directly related to usage of Globefish app

The user interviews were conducted remotely, all interviewees were asked to use the app prior to the interview.

All interviewees mentioned that to get discount is their biggest motivation to use the Globefish app and other food ordering apps in general. In addition to save money, a majority of the interviewees mentioned that by using the apps, they hope to reduce wait time, and get their food faster.

User interview

User Research

Interview Findings

In summary, the interview insights can be summarized into 3 major points:

In addition to the insights mentioned above, most of the pain points that got brought up during the interview were surrounding Menu and checkout process.

After collecting the qualitative data from the user interview, I developed survey surrounding the interview insights. The survey was sent to broader audience to collect quantitative data to either validate the interview insight or invalidate them.

User Survey

Survey Findings

The data from the survey suggested that user is largely motivated by discounts and time saving convenience. In short, users’ deep needs are to save money and time.

In respect to saving money, the survey data has suggested that 84% of the participants would like to “being notified about the promotion information before browsing the menu is important”. However, on the contrary, none of the participants who have used the Globefish app before were able to find promotion information.

In respect to time-saving expectation, one of the interviewees shared her frustration on the checkout process. She thinks it’s very lengthy. She did not have an account when starting the order, however, when it came to checkout, she was told it is mandatory to sign up for an account, and it is not possible to check out as a guest. At the end she had to give up the entire order. This high risk user flow does not provide any signifier to the user at the beginning to prepare their mental model.

The survey data has suggested only 33% of the participants who used the Globefish app before were happy with their checkout process.

Define the Problem

After analyzing the qualitative and quantitative data collected from user research, I defined a persona - Alex.

Persona

During the problem definition workshop, amongst many problems Alex was experiencing, the team decided to prioritize the issue below, as users who come across friction points early on in their journey will be more likely to give up on the entire process.

How might we help Alex build her order faster?

Problem Definition Workshop

The team then brainstormed for solutions. We wrote down all the ideas that we could think of that would solve our discovered pain points, going broad and fast initially. Then we did a dot vote on the best/most relevant one that focused on designing features around those ideas. At this stage, it was important to focus on speed and rapid ideation instead of perfection.

Our hypothesis solution is:

We believe that adding a feature to provide recommendations of the dishes based on user history and preference for Alex will help users build the order faster.

Ideation

Based on the hypothesis solution, I created user story maps to identify the opportunities in the flow for the improvements, and a flow diagram to visualize the workflow.

user story map:

Wireframe Design

before

After

flow diagram:

Design Language

The design inherits the existing Globefish branding elements to ensure the branding message is cohesive.

Low Fidelity Wireframe

High Fidelity Prototype

After we developed the high fidelity prototype, I conducted a usability test with 5 participants. See the usability test report below:

Usability Test

Based on the results of the test objective, 2 changes have been made.

A carousel indicator is added to show there are more slides available. It does not perform the page change actions, the actionable buttons remain at the chevron buttons.

An automotive slide feature is also added to the carousel.

Iterations

The drag-down bar is replaced by an exit icon. A subject line is also added in the shopping cart modal to show the hierarchy - Main Nav Bar, and shopping cart nav bar.

Prototype Demo

Globefish TAKEOUT APP REDESIGN

Awele Shipment Booking Platform

Shortly URL shortening APP