Iced Out
Your all-in-one cocktail app
Designing for responsible cocktail lovers
Duration
3.5 weeks
Role
UX Designer & Team Lead
Tools
Figma, Figjam, Miro, Github, Visual Studio Code
The Story
In a world where costs are on the rise and home gatherings are increasingly popular, the desire to be an exceptional host and create lasting memories for guests is strong. However, the overwhelming abundance of online cocktail recipes often leaves hosts uncertain about what to serve. That's where Iced Out, our user-friendly app, comes in, guiding hosts to discover unique and impressive cocktails tailored to their preferences and guests' desires, ensuring an unforgettable and enjoyable event.
The Task
To create a cocktail app that helps users in choosing what cocktail to make for their next event. We started with extensive user research to discover the pain points of users’ when making cocktails and finding recipes.
The Problem
Kevin, a customer success manager, is hosting a small dinner party (3-4 friends) and is in search for recipes that his guests and himself will enjoy. Despite visiting numerous websites and social media platforms, he is overwhelmed by the sheer number of recipes available and desires a more streamlined approach. Kevin wishes to find recipes that are personalized and tailored to his and his guests preferences and occasion. Additionally, he values the visual aspect of recipes, as well as user reviews to gain insights into how real people have enjoyed these cocktails.
​
How might we assist Kevin in efficiently discovering recipes that will satisfy him and his guests?
The Solution
To develop a cocktail making app to help adults who like to drink cocktails and host small get-togethers solve the issue of finding the perfect drink no matter the occasion. Whether it be for relaxing after a long day after work with a friend or hosting a small get-together, cocktail enjoyers can discover and make their new favourite recipes.
Through our preference-based personal suggestions, user reviews, and refined search filters we will enable cocktail drinkers to make informed decisions about new cocktail recipes to enjoy and prepare for their guests.
My Design Process
Research Goals
-
Understand users’ background and past experiences with cocktail apps and finding recipes
-
Learn users’ motivations, behaviours, and attitudes on making cocktails and finding recipes
-
Identify users’ pain points when making cocktails at home and finding recipes
-
Discover what target audience would desire in a cocktail app
Research
The foundation of successful research begins by formulating well-crafted, open-ended questions that enable us to gain a deep understanding of our users' pain points.
Key Research Questions
-
Walk me through the process of the last time you looked up a cocktail recipe
-
What motivates you to look up recipes?
-
What factors influence your choice when selecting a cocktail recipe platform?
-
What would you want in a platform for discovering new cocktails recipes?
-
What are some of your pain points with platforms that you have used when searching for recipes?
Affinity Map
To organize all of the research information (gathered from the user interviews) an affinity map was made to sort the data and start identifying patterns.
Pain Points
Search Experience
Features
Key Points: Affinity Map
-
Filters would be helpful when searching- event type, spirit type, flavour profile etc
-
Lack of customization is an issue
-
Overwhelmed too many recipes don’t know what to choose
-
Pictures and reviews are important (visual factor)
-
Bookmark feature would be useful
User Quote
“Having the ability to filter recipes based on the type of event I'm hosting would be incredibly helpful, as it would allow me to choose the perfect cocktails that align with the specific occasion.”
​
-Dominic R-
Competitor Analysis
A SWOT (strengths, weaknesses, opportunities and threats) analysis was conducted on our main competitor, Mixel. The analysis was completed to enhance our design by identifying and leveraging our competitors' strengths, weaknesses, identify opportunities for improvement, and evaluate potential threats.
User Persona
Upon completion of our research, a user persona was crafted to provide us with a comprehensive understanding of the needs, motivations, and goals of our users.
I Like, I Wish, What If
To stimulate our creative process, we opted for an I Like, I Wish, and What If chart as a means to generate a plethora of ideas. While certain ideas may be unfeasible, it serves as an effective method to explore ideas and potential features that can help users.
I Like
I Wish
What If?
Feature Prioritization Matrix
In order to establish priority for the ideas, we categorize them based on their impact and complexity. Ideas that demonstrate high impact in addressing the problem while requiring the least complexity in terms of feasibility and technology are selected for further testing and implementation.
Storyboard
To visually illustrate our user's journey within our app, we developed a storyboard. This powerful tool assists in visualizing the user's experience and identifying any areas of dissatisfaction or frustration.
Step 1:
Kevin is having friends over on the weekend for a small dinner party. He is standing in front of his home bar, feeling frustrated and unsure about which cocktail to make.
Step 4:
He suddenly remembers a colleague at work mentioning a cool cocktail app that gives customizable recipes that fit any occasion. Kevin quickly downloads it from the app store and opens it.
Step 2:
Kevin opens a tab on Google, hoping to find cocktail recipes. He enters "cocktail recipes" in the search bar, but is overwhelmed by the sheer number of results.
Step 5:
Kevin explores the app's features and discovers a search filter for occasion type, spirit type, and flavour profiles. He selects "gin," "fruity," and "dinner party drinks" as his preferences.
Step 3:
Kevin tries to narrow down the search results by typing "gin cocktails" but ends up with a long list of recipes that don't align with his taste preferences and the occasion.
Step 6:
The app instantly provides Kevin with a curated list of recipes that match his preferences. Kevin reads the reviews and picks one that he thinks his friends will like and that goes with the theme of his dinner party. He is excited to make this recipe and wants to impress his friends. He looks at the ingredients needed and notes them down so he can buy them tomorrow!
User flow: Find a Recipe
.png)
Paper Wireframes
Before starting the design phase on Figma, we began by sketching initial ideas to conceptualize the app's appearance. Paper wireframes were used as a quick and low-fidelity method to explore design solutions and communicate ideas efficiently.
Splash Page
Sign Up Page
Home Page
Onboarding Questionnaire
Search Page
Filters Pop Up
Cocktail Page
Profile Page
Low/ Medium Fidelity Wireframes
Splash Page
Sign Up Page
Onboarding Questionnaire
Home Page
Search Page
Cocktail Page
Key User Feedback
Splash Page
Onboarding Questionare
.png)
Home Page
Cocktail Page
.png)
Home Page Iterations Based on User Feedback
.png)
.png)
Style Guide
.png)
.png)
.png)
.png)
.png)
.png)
Conclusion
Key Takeaways
-
Refining and revisiting the problem statement regularly is important in order to ensure solving the right problem
-
To genuinely understand user needs and address them effectively, it is crucial to invest significant time in the research phase
-
Iterating is essential, while effectively managing timeline expectations is equally significant
Next Steps....
-
Online community forums
-
Ingredients filter for ingredients already have
-
Ingredient substitute feature