Cocktail recipe mobile app design

Cocktail recipe mobile app design

Home mixology sparked by lockdowns during the pandemic

more than 30% of people in the United Kingdom, are choosing to make more cocktails at home in 2022 compared to 2020

introducing

Bacardi cocktail trends report 2023

Project

Category/lifestyle entertainment

Date/2024-2024

Background

If you get a group of cocktail enthusiasts together, at some point in the evening, they will inevitably discuss three things:

what’s your favourite cocktail bar in the city?

what’s your best drink you had recently?

what’s your liquor choice?


Problem Statement

How might we help cocktail enthusiasts discover the best drinks recipes and bars in their cities, ensuring home mixology and bar experience are interactive and fun while connecting to others with same interests and explore local bars together?

Solution Statement

By creating a user-friendly&interactive cocktail recipe system and bar community empowering cocktail enthusiasts to follow recipes easily & connect with like-minded individuals.

9+

31+

180+

iterations

screens

hours

before we get started here is the

Project timeline

1 weeks

presentation

I delivered an impactful data-driven presentation

focused on specific audience needs.

4 weeks

Redesign

I redesigned user interface and add new features based on usability testing feedbacks,

solved problems by 3 strategies

improved user engagement by 30%.

2 weeks

Research

I carefully analyzed the market and surveyed users to gather data on user preferences, habits, and desires related to cocktail making and social features of app.

First hi-fi prototype

1 weeks

Usability testing

I invited 5 target users, for accessibility, identified 7 critical issues, gathered actionable insights on user behaviour and preferences.

3 weeks

Design

I explained the process how design is iterated, how the research results are reflected in the solution.

Mixo case study would focus specifically on the user of Mixo app as the solution. The design section would delve into details of recipes exploration, community platform development, and other functionalities utilized within Mixo.

Second hi-fi prototype

05 User Demographic

Target Audience

Target Audience

who?

The app is a cocktail recipe tool and also a cocktail community platform designed for young people, specifically targeting those aged between 18-40 interested in mixology, both beginners and seasoned mixologists, however it’s open to everyone who likes to practice cocktail making and bar exploring 

why?

selected for their interests in mixology, our target group seeks for tools to make cocktails for different occasions easily and connect to local community 

As their technique evolve, this calls for tailored mixology practice plan, ensuring inclusivity for all 

06 User Research

Perspectives

on cocktail recipes

7

interviews

30

online survey

Can you explain what led you not to try cocktail making in the past?

28%

too many obscure ingredients to prepare or have to buy a huge bottle just for a cocktail

49%

lack of available recipes (online searching is fruitless, many ads)

Preference for Traditional Sources(recipe books, websites, word of mouth)

9%

14%

hard to search by ingredients you have

25%

searched for cocktail recipes in the past (e.g., online search engines, recipe books, social media, etc.)

What would motivate you to start using a cocktail recipe app in the future? Are there any specific features or functionalities that would convince you to use an app?

Social sharing functionality, community platform for local bars

12.5%

Interactive instructions

16.7%

a wide variety of cocktail recipes

48.4%

generate recipes according to ingredients on hand (Recipe Finder)

17.6%

other

4.8%

Have you ever tried local bar exploration app, if not what do you think would be helpful functionality of this app?

clear and interactive menu information attached

42.9%

community to explore news of local bars

28.6%

network others who love pub quiz and cocktails

14.1%

making order of cocktail deal of local bars

12.1%

other

2.3%

There’s just too much information out there, so I usually give up when I try to search for new recipes.

I try to find a new drink to make, but it can be hard to search by ingredients you have.

so confusing when ordering in the pub, menu doesn’t show much about the cocktail information

before we get started here is the

User research

I recently conducted user research involving 30 individuals, Through 7 interviews, 30 online surveys, or usability testing, I gathered valuable insights into user preferences, habits, and desires related to cocktail making and social features in app.

25%

searched for cocktail recipes in the past (e.g., online search engines, recipe books, social media, etc.)

Analysis

What features of the Mixo app are most important?

Social sharing, community platform for local bars

74%

90%

66%

A wide variety of cocktail recipes, Interactive instructions

Personalized recipe based on home ingredients

Pain points

Complex and confusing interface

Personalized recipe recomendation

Keep updated latest bar events

Lacks of motivation or interest

78%

46%

68%

84%

Competitor Analysis

we’d need to find a way to set our app apart from the crowd. Many apps provided plenty of drink recipes and information but often displayed the material in a confusing way, with cluttered screens thick with content, We identified areas and opportunities to explore.

Mixel

Distiller

noflair

Bartender's

Choice

Cocktail Flow

Drink Recipes

Strengths

· Some apps offer extensive knowledge about spirits on the market, and check the reviews.

· Some apps has different categories of cocktail to narrow user choice, and good combination of tools (recipe book, my bar, custom recipe, note, basic tips of mixology etc)

· Some apps offer extensive knowledge about spirits on the market, and check the reviews.

· Some apps has different categories of cocktail to narrow user choice, and good combination of tools (recipe book, my bar, custom recipe, note, basic tips of mixology etc)

Weakness

· Not enough explanation of obscure ingredients and professional words.

· Cluttered screens with unclear navigation causing confusion.

· Combinations of features and informations on a single page make users feel overwhelmed. visual hierachy not designed well

Opportunities

· Enhance user experience by providing more interactive and immersive instructions.

· Simplify process of finding a recipe&offering custom recipe so they can record their own recipes.

· Providing a community platform not just a discussboard, where bars can promote themself and people share thoughts and connect to others

Threats

· A lack of mixology professional learning process may lead to user mistrust.

· A confusing platform may discourage people from learning, sharing and connecting process.

· Overwhelmed information can be addressed by considering personalized experience for diverse target audiences.

Feature Analysis

Based on User research, here are

Key Insights

I struggled with finding several cocktail recipes for my family party, according to their preference, don’t know where to begin...

Joyce

Accountant

50

New to this city, hope to find friends to enjoy pub quiz together and keep up-to-date local bars menus and nice events

Madina

Digital designer

27


really need a tool to help me to sort out what drinks ingredients at home and get reviews of spirits in store to make better choice and generate recipes for me accordingly.

Kacper

Engineer

31

So, to solve these problems, here are

Product goals

Cocktail recipe app serves not just as practical tools for making drinks but also as platforms for education, social interaction, and community engagement within the drink-making culture.

Simplify ingredients choosing process

enable users to effortlessly choose right ingredients and track home ingredients for less waste and cost.

By providing a user-friendly interface for easy navigation and clear category to add your own bottle to your cabinet.


Improve engagement

of cocktail making learning process

and boost motivation

offering a more engaging and appealing recipes with AR instructions.


motivate users with clear step by step instructions and visually appealing interface.

Connect people and build community

not just a tool in your pocket, but a social platform

Implementing social features that connect users to explore local bars together.

offering Bars official profiles to share their exclusive cocktails, promote events, and interact with the community.

customized content

users have more freedom for Custom Recipes and community building to enrich database.

offering a more engaging and appealing recipes with AR instructions.


Simplify ingredients choosing process

enable users to effortlessly choose right ingredients and track home ingredients for less waste and cost.

By providing a user-friendly interface for easy navigation and clear category to add your own bottle to your cabinet.


Improve engagement

of cocktail making learning process

and boost motivation

offering a more engaging and appealing recipes with AR instructions.


motivate users with clear step by step instructions and visually appealing interface.

Connect people and build community

not just a tool in your pocket, but a social platform

Implementing social features that connect users to explore local bars together.

offering Bars official profiles to share their exclusive cocktails, promote events, and interact with the community.

customized content

users have more freedom for Custom Recipes and community building to enrich database.

offering a more engaging and appealing recipes with AR instructions.


Age: 25

Location: Edinburgh

Country: UK

Sheryl

architect

I love preparing drinks for parties, instead of boring instructions, I prefer vivid and interactive cocktail learning process and cocktail community for sharing

Personality

User needs

User goals

Pain points

Apps

Extrovert

Sensing

Feeling

Introvert

learning cocktail-making

motivation to start learning

clear navigation to recipe

customized recomendation

tracking home ingredients

updated local bar events

struggle finding drinks for party

struggle ordering drinks in the bar

can’t track home ingredients

Intuition

Thinking

Time spent on

cocktail making

20%

38%

11%

49%

Here is the first design version

Prototype

after that, I did

Usability testing

I recently conducted usability testing on different tasks, which provided me with key insights to improve accessibility and user engagement for redesign.

here is their

Key insights

46%

of users

struggle to understand user interface, prefer simple and intuitive interface.

by addressing user key feedbacks after usability testing, Mixo aims to streamline

recipe exploration, ingredients management, and improve user engagement and motivation in terms of recipe user interface and community platform.

24%

of users

consider advanced features and customization options to share their own unique cocktails and themed recipe recommendation.

67%

of users

expressed a desire for a wider range of social function for networking and stay updated with local bar events.

Was there anything missing from your experience?

7

521

708

824

774

write reviews

post own recipe

engaging instruction

my profile

recipes folder

local bar account

events, menus

make drinks order

bottle scanner

search by difficulty

share recipes through chat

Based on usability testing, here is

Problem&solution

Solution

By providing a user-friendly interface for easy navigation and clear category

Integration of AR features.

Motivate users with clear step by step instructions and visually appealing interface.

Integrating social features that enhance connection within community , not just a recipe tool in your pocket, but connecting to people through whole app.

integrating local bar community and augmented reality (AR) features to merge traditional mixology with cutting-edge technology to enhance the learning, making cocktails, and social experience in local bars, providing an all-in-one platform that caters to both educational and social needs.

Problem

how to simplify ingredients choosing process without feeling overwhelmed?

how to Improve engagement

of cocktail making learning process and boost motivation?

Tequila

50ml/1.5 fl oz

Lime Juice

25ml/1 fl oz


Triple Sec

25ml/1 fl oz


Lime

Garnish


Servings

1

Recipe card

Recipe collection

VisionOS dashboard

SMART

TAB

user can effortlessly check Actiobar

interactive and dynamic tab feature that enhances user navigation and engagement

smart tab

switch easily between different sections smoothly

Simplify user interface

with a clean layout and minimalistic design

01

FILTER

MY CABINET

NOTIFICATIONS

MY SHOPPING CART

MENU

SMART

TAB

01

Narrow your options easily
to find the right recipe for you

smooth and fluid triggering animation
to enhance the user experience

Flavours

Liquor

Non-Alcohol

Ingredients Amount

Filter

image cocktail name type of drink spirit base, difficulty level, ABV

Recipe

Card

02

Discover a World of Flavors

with Seasonal Cocktail Collections

Each card represents a single cocktail recipe

This helps users quickly scan through options without feeling overwhelmed.

Card layout is an effective way to present recipes clearly and attractively

Recipe

Card

02

Not enough?

you can also post your own recipe

share with others

Users can receive feedback from other users which can help users refine recipes and improve mixology skills, motivate learning

Users can engage with each other by commenting on, liking, and sharing each other’s recipes, which enhances the social experience of the app.

Share your own recipe either from books friends websites

after that, I did

VisionOS dashboard

Cards layout should adapt seamlessly across different devices, such as VisionOS

My

Bar

03

Select
Shake your phone
Personalized recipe is ready!

Ingredients are organized by categories, empowering users to managetheir ingredients more efficiently
Users can easily access their cabinet, add or remove ingredients from it

Scan the bottle at grocery store or home
Make the right choice of ingredients

04

Community

chat

keep up-to-date local bar recent events
Share your friends
recipes, menus, contacts, posts....

Not just a recipe app

you can also explore local bars and connect to community

AR

Menu

05

Struggle ordering drinks in the bar?
We got you!
check menu anywhere anytime

Local bar official account updates about new cocktails, special events, or themed nights
Customers can receive real-time updates about menu changes

AR menus can offer a straightforward visual and textual explanation while helping users make informed Decisions

Now let’s explore

Branding&logo

Mixo

Mixo

Sip Share

Connect🍹

🌟 Elevate Your Cocktail Game with MIXO!

9:41

Mixo

Apply a grid system to maintain consistency throughout the design:
utillizing consistent spacing system for margins, padding, and the gaps between elements.

Mixo

Grid system

Now let’s explore

Aa1

Aa1

Mai Tai

Margarita

Whiskey sour

Gin

Rum

Whiskey

Now let’s explore

Typography

Design system