UX
Studies

UX
Studies

A curated selection of product design projects. These deep dives highlight my approach to product strategy, execution, and business-centered solutions.

A curated selection of product design projects. These deep dives highlight my approach to product strategy, execution, and business-centered solutions.

Mangio App

Gamified Casino

Coming Soon…

Mangio App

Gamified Casino

Coming Soon…

APP OPTIMISATION WORKFLOW - 2022

APP OPTIMISATION WORKFLOW - 2022

CONTENTS

0

Intro

1

Research Phase

2

Design Phase

3

Mockups & Testing

Mockups & Testing

4

Implementation Phase

MANGIO

FOOD DELIVERY APP

MANGIO

FOOD DELIVERY APP

Mangio is a newly-launched food delivery app which requires enhancements to provide improved services to customers. This involves offering greater transparency regarding their food orders and streamlining the ordering process for increased speed and efficiency.

Mangio is a newly-launched food delivery app which requires enhancements to provide improved services to customers. This involves offering greater transparency regarding their food orders and streamlining the ordering process for increased speed and efficiency.

Problem statement

Problem statement

Order completion rates are below client’s expectations. Only about 45% of app interactions result in orders being sent to restaurants.


When orders are completed, users complain about not being able to track their order and have no indication of when their orders would arrive .

Order completion rates are below client’s expectations. Only about 45% of app interactions result in orders being sent to restaurants.


When orders are completed, users complain about not being able to track their order and have no indication of when their orders would arrive .

Project overview

Project overview

The goal of this project was to elevate user satisfaction with our app, surpassing expectations and streamlining the ordering experience.

We focus on boosting order completion rates, crucial indicators of our platform's success.


After analyzing Mangio's user interactions, we address some pain points and streamlined the ordering process.

Our enhancements should create an efficient, user-centric environment, ensuring each interaction is as frictionless for our customers as possible.

The goal of this project was to elevate user satisfaction with our app, surpassing expectations and streamlining the ordering experience.

We focus on boosting order completion rates, crucial indicators of our platform's success.


After analyzing Mangio's user interactions, we address some pain points and streamlined the ordering process.

Our enhancements should create an efficient, user-centric environment, ensuring each interaction is as frictionless for our customers as possible.

My role

Research

Personas

Wireframing

UX design

Testing

Collaborations

Stakeholders

Setting expectations and project scope, iterating ideas

Users

Testing and validating our designs

Making sure the designs are implemented, technical validation of designs and quality assurance

Developers

Research Phase

Research Phase

Starting out

Starting out

We analyzed the feedback given by users by prompting them to express their satisfaction after each order.

We analyzed the feedback given by users by prompting them to express their satisfaction after each order.

We looked at reviews retroactively and also while we were working on the project.


Most prevalent issues reported by customers:


Lack of order status/tracking

Expand payment options

Browsing restaurants needs to be improved. Categories missing.

We looked at reviews retroactively and also while we were working on the project.


Most prevalent issues reported by customers:


Lack of order status/tracking;

Expand payment options;

Browsing restaurants needs to be improved; Categories missing.

Competitor analysis

Competitor analysis

Analyzed competitors' food delivery apps to identify industry best practices.

Bolt Food, Glovo and Tazz are the main competitors in the local space.

Analyzed competitors' food delivery apps to identify industry best practices.

Bolt Food, Glovo and Tazz are the main competitors in the local space.

Bolt Food does not have cuisine categories on their homescreen, but offers them with an additional tap on the Search screen.

Bolt Food shows customers the stages of their orders, ending in a real-time delivery tracking

Bolt Food does not have cuisine categories on their homescreen, but offers them with an additional tap on the Search screen.

Bolt Food shows customers the stages of their orders, ending in a real-time delivery tracking

Cuisine categories are present on the top of Glovo’s main screen (when choosing restaurants, since the app offers grocery and other specialized shopping categories too).
When it comes to order tracking, Glovo uses a similar approach to Bolt Food: staged tracking of your order status with real-time map updates.

Cuisine categories are present on the top of Glovo’s main screen (when choosing restaurants, since the app offers grocery and other specialized shopping categories too).
When it comes to order tracking, Glovo uses a similar approach to Bolt Food: staged tracking of your order status with real-time map updates.

Design Phase

Design Phase

User Personas

User Personas

Developed detailed user personas based on the research findings, representing different user demographics and preferences.

Personas included busy professionals, families, and students. This is an abridged version of the personas:

Developed detailed user personas based on the research findings, representing different user demographics and preferences.

Personas included busy professionals, families, and students. This is an abridged version of the personas:

P1

Professional

Age: 33

Professional

Age: 33

Time-Conscious: Values his time and seeks efficiency in all aspects of his life. Needs a food ordering app that allows him to quickly browse through options, customize orders, and place them effortlessly is crucial.


Tech-Forward: As a tech-savvy professional, he expects a seamless and intuitive user interface with modern features. A visually appealing app with easy navigation, quick payment options, and real-time order tracking aligns with his preferences.


Reliable Delivery: His schedule leaves little room for uncertainty. A reliable and punctual delivery service is essential for him, ensuring that meals arrive on time and in optimal condition.

P2

Mom

Age: 38

Mom

Age: 38

Family-Focused: Mom's priorities revolve around her family. A food ordering app that understands the needs of families, with options for kids and adults alike, appeals to her. Family meal deals and customizable options are particularly attractive.


Flexible Ordering: Given the unpredictable nature of family life, Mom values a food app that offers flexible scheduling for deliveries or pickups.


Rewards and Discounts: As a mom on a budget, Lisa appreciates loyalty programs, discounts, and promotions. A food ordering app that offers exclusive deals for families or regular customers is likely to earn her loyalty.

P3

Student

Age: 38

Student

Age: 38

Budget-Conscious: Affordability is a top priority for the student. A food ordering app that provides student discounts, combo deals, and value-for-money options is likely to be a favorite.


Quick and Easy Ordering: With tight deadlines and class schedules, Alex values a food app that allows for swift and straightforward ordering. Features like saved favorites and quick reordering contribute to a hassle-free experience.


Variety of Options: The student lifestyle craves variety. Options for quick snacks, hearty meals, and late-night cravings are all essential.


Rewards and Loyalty: While budget-conscious, he values loyalty programs. A food ordering app that recognizes and rewards frequent orders is likely to foster loyalty.

Key takeaways from analyzing personas, and missing features:

Users need to see how close their food is to being delivered

We need a category of restaurants that serve kids’ portions

We need a category of restaurants that serve kids’ portions

Give the option to schedule orders in advance

Give the option to schedule orders in advance

Incentivise businesses to run loyalty programs

User Journey Mapping

User Journey Mapping

Mapped out the entire user journey, from app launch to order delivery, identifying key touchpoints and potential pain points.

Prioritized critical moments such as selecting a restaurant, placing an order, and tracking the delivery.

Information architecture and wireframing

Information architecture and wireframing

Restructured the app's information architecture to improve browsing and navigation.

Restructured the app's information architecture to improve browsing and navigation.

Implemented new features for main stages of the user experience:

Browse Restaurants, Place Order and Track Delivery.

Below are a few examples of our wireframe prototypes.

The homescreen of our app was improved by offering quick access to specific cuisines in an easily accesible area.

The homescreen of our app was improved by offering quick access to specific cuisines in an easily accesible area.

We prototyped an order-status screen with stages. On the top there is a tab with the current or past orders. On the “current order” screen you can see the progress of your order, including a map feature that lets you track the delivery in real-time.

We prototyped an order-status screen with stages. On the top there is a tab with the current or past orders. On the “current order” screen you can see the progress of your order, including a map feature that lets you track the delivery in real-time.

Prototypes included user flows for restaurant selection, menu browsing, payment and order tracking.

Prototypes included user flows for restaurant selection, menu browsing, payment and order tracking.

Mockups and testing

Mockups and

testing

High Fidelity Prototypes

High Fidelity Prototypes

Translated wireframes into high-fidelity interactive prototypes, incorporating brand elements and visual design.

Translated wireframes into high-fidelity interactive prototypes, incorporating brand elements and visual design.

Implementation phase

Implementation

phase

Collaboration with development team

Collaboration with development team

Handover was done with Figma’s DEV MODE tool, a powerful communication tool between designers and developers with features that help translate designs into code, faster.

Handover was done with Figma’s DEV MODE tool, a powerful communication tool between designers and developers with features that help translate designs into code, faster.

(From within this tool you can easily generate production-ready CSS, iOS, or Android code snippets from your design— or even use a plugin to customize code for whatever framework the dev-team is using.)

Dev Mode is like a browser inspector for your design file—simply hover and click objects to get details like measurements, specs, and styles—all within a safe space that won’t impact the design file.

Dev Mode is like a browser inspector for your design file—simply hover and click objects to get details like measurements, specs, and styles—all within a safe space that won’t impact the design file.

Worked closely with developers to ensure seamless implementation of the UX/UI design.

Worked closely with developers to ensure seamless implementation of the UX/UI design.

Conducted regular check-ins to address any technical challenges and maintain functional-design fidelity.

Conducted regular check-ins to address any technical challenges and maintain functional-design fidelity.

END OF DECK

Play some synth.

Now playing:

HIRE_ME.mp3

0:00/1:34

Now playing:

HIRE_ME.mp3

0:00/1:34