palatable u x case st udy - artemis design labs case st… · palatable u x case st udy ... kshitij...

Palatable UX Case Study A redesign of an on-demand food delivery platform ─

Team Members Pritish Sai Kannan - UX Design, UI Design

Kshitij Sinha - UX Research, UX Design

Vaibhav Gupta - Gamification of UI

1

Introduction

It’s the end of 2019 and on-demand food delivery platforms are on

the rise. With a large number of options to choose from (including

Grubhub, Doordash, Uber Eats, and Postmates), how does a new

entrant into this market compete with these existing behemoths?

Palatable is the newest player in this market and it currently operates

only in New Jersey with plans to rapidly expand all across the United

States.

We worked with Palatable to redesign major portions of their UI so

they could compete and become a market leader in the on-demand

food delivery sector.

Note: This project is currently in progress so all the final prototypes

are not listed below

2

Problem Definition Users have access to a lot of on-demand food ordering platforms

that offer very similar services. How do they choose which one to

use at any given moment and more importantly, is possible for them

to completely switch to only one platform that has the most intuitive

user-experience.

3

Design Process Our design process is broken down into three sections.

Research + Findings

Define Objectives

Prototyping

4

Research Competition Analysis

We made a list of primary features from some of the immediate

competitors to Palatable. We also listed features that Palatable could

incorporate in their design which are not present in current apps.

5

Online Surveys

We conducted an online survey and asked users about their current

experience with on-demand food ordering platforms to gauge their

level of satisfaction with current services and if their user needs are

met.

Key Findings

● Most users often order the same food

● Most users order food during dinnertime

● Over 50% of surveyed users state that they order food for

themselves as well as others

● Most users add something to their order (like fries) before

checkout

● Most users went with item suggestions to fulfill the minimum

delivery

Usability Testing

We then tested the Palatable iOS app with several potential users at

a college campus and recorded their observations.

Key Findings

● Users often forgot which swipe is like and dislike

● Users prioritize time and distance over price

● Users had issues with font inconsistency

6

● Users were overwhelmed by the number of choices

● The modal that appears after users click ‘My’ is confusing

● Users would like the option of restaurants that offer a specific

dish appear

● Users want more information on the item’s card itself before

swiping for more details

● Users had issues with inconsistencies in font sizes

Heuristic Evaluation

Our next strategy was to do a heuristic evaluation of the service to

identify all major usability violations in line with Nielson’s usability

rules.

Onboarding

Violation Nielson’s Heuristics

Home icon at the center Consistency

My->Swipes does not show

updated list of swipes instantly

Efficiency of use, visibility of

system status

Info opens a modal, slider Consistency

Hamburger menu slides up Consistency

The icon used for ‘My’ is more

suited for access to the user’s

Consistency

7

profile

Whitespace in filter and

onboarding screens with diets,

allergies and cuisines are too

much

Whitespace, aesthetics,

minimalism

Title on search page is unlike a title

and looks like a clickable link

Consistency, visibility of system

status

Search page nearby is not

clickable, looks like you can click

and change location


status

Badge for cart is on the left Consistency

Home

Problem Violation

“Liked” is shown above the image,

overlapping with the location

Flexibility and efficiency,

aesthetics, recognize and

diagnose errors

Duration for liked and disliked

different when thumbs used and

swiped

Consistency

Swiping system needs a better Match between system and the

8

hierarchy real world, Recognition rather than

recall?, Efficiency of use,

Recognize and diagnose errors

‘Order Now’ page

Problem Violation

Ingredients are truncated while

visible on the cards


state, help and documentation

0.8 Mil, distance of the restaurant

is not clickable

Consistency

Restaurant data not there on cards Consistency, real world and

system match

Cuisine on page is green, looks

clickable

Consistency

Ingredients have different font

weights

Inconsistency, external and

internal

Restaurant Page

Problem Violation

Top bar keep stacking wasting UI Consistency and standards,

9

space aesthetics, efficiency of use

The menu button in the center is

redundant

Consistency

Does not allow to jump to top User freedom and control

Contact info is grey and looks

unclickable

Consistency

Bottom cart can easily be missed Aesthetics

90% of the navbar items have no

information

Aesthetics and Minimalism

My cart

Problem Violation

Order type opens a modal when

looks like a dropdown

Consistency

Select tip amount - amount looks

like a subtraction

Consistency

Proceed to pay bar is small Aesthetics

Delivery not available error is basic

alert

Consistency, aesthetics

10

Define Objectives Define User Needs

● Users don’t want to think hard about their order

● Users trust the app will give them the best choice

● Users value time and distance over pricing

● Users often order during specific times of the day or during

specific events

● Users want to have the most relevant information when it

comes dishes or restaurants Target KPIs (tentative list)

Due to limited resources, we couldn’t measure the target KPIs we

listed prior to the research. However, for future research purposes

we estimate that the following KPIs need to be targeted in order to

understand Pal atable’s current standing in the market.

Objective KPI How to measure

Customer Acquisition Downloads App store (public)

Sign-ups Analytics Tools

Engagement Swipes Usability Testing / Analytics

Favourites Usability Testing / Analytics

Likes / Unlikes Usability Testing /

11

Analytics

Order edits Usability Testing / Analytics

Searches (dishes…) Usability Testing / Analytics

Order now Usability Testing / Analytics

Add to order Usability Testing / Analytics

Preferences Usability Testing / Analytics

Retention Bounce Rate Analytics

Returning users Analytics

Session duration Analytics

Happiness / Overall Satisfaction


Usability Testing / In-built tool



SUS score calculation

12

Target Personas

Based on all the data we uncovered from both the market research

as well as the user research and keeping the user needs in mind, we

generated three target user personas who would benefit from using

the app.

13

Maslow’s Hierarchy of Needs

Using the UX version of Maslow’s pyramid, we allocated features

that are of immediate importance (functionality) to features that

have less importance, but are still relevant to the app.

Feature Level

Checkout Screen

Easily differentiate between delivery and pickup.

USABILITY

Empty entire cart with one click or edit order RELIABILITY

Tips dynamically show up on ‘Delivery’ option USABILITY

Easily switch between current and previous orders

USABILITY

Easily reorder a previous order (all info including tip is saved)

PROFICIENCY

Swipe and Dish Screens

16

A clear and visible indicator of whether the swipe is a like or dislike while the user is in the middle of the swipe so they can revert or continue the interaction

USABILITY

More relevant information on the card itself so the user does not have to open the card for more info

USABILITY

An ‘order now’ symbol so the order gets added to the cart without obstructing the journey the user is on (swiping)

FUNCTIONALITY

More images of the dish in an image slider RELIABILITY

List of additional restaurants that serve that particular dish

FUNCTIONALITY

Liked and Unliked Items

Easily move an unliked item to a liked section or delete them entirely

FUNCTIONALITY

Add liked items to the cart easily FUNCTIONALITY

Preferences overlay

A new section called ‘Moment’ which features scenarios when users might want to order food.

RELIABILITY

A dropdown option with primary and advanced filters

RELIABILITY

Minimum delivery suggestions

The app will suggest several items that will make up the minimum based on the user’s preferences

FUNCTIONALITY

17

Design + Prototyping User Flow

After creating our LoFi wireframes we designed a user flow that

focused on the primary features outlined in Maslow’s chart.

18

High-fidelity wireframes

Checkout screen

1. Our checkout screen has the following functions

a. Easily differentiate between delivery and pickup

b. Empty entire cart with one click or edit order

c. Tips dynamically show up on ‘Delivery’ option

19

d. Easily switch between current and previous orders

e. Easily reorder a previous order (all info including tip is

saved)

20


2. Our swipe and dish screens have the following functions

a. A clear and visible indicator of whether the swipe is a like

or dislike while the user is in the middle of the swipe so

they can revert or continue the interaction

b. More relevant information on the card itself so the user

does not have to open the card for more info

c. An ‘order now’ symbol so the order gets added to the cart

without obstructing the journey the user is on (swiping)

21

d. More images of the dish in an image slider

22

e. List of additional restaurants that serve that particular

dish

23


3. Users have the following options with liked and unliked items

a. Easily move a unliked item to a liked section or delete

them entirely

b. Add liked items to the cart easily

24

Preferences overlay

4. The preferences overlay has the following functions

a. A new section called ‘Moment’ which features scenarios

when users might want to order food

b. A dropdown option with primary and advanced filters

25


5. If the user’s bill is below the minimum delivery

a. The app will suggest several items that will make up the

minimum based on the user’s preferences

26

Interaction Design

Checkout screen

27


28


29

Preferences overlay

30


31

palatable u x case st udy - artemis design labs case st… · palatable u x case st udy ... kshitij...

Documents