Crafting a unique user experience
Rating beer through an app shouldn't be boring. We paired AI technology and advanced user interactions to create a memorable user experience. Includes: branding, user flows, wireframes, user testing, and prototyping.
Software used: Illustrator, Photoshop, Figma, ProtoPie
My role: Design direction, branding, user flows, UX design, prototyping
Project partner: Max Vecchitto
Problem: Beer lovers desire a robust rating app to track the beers they try and discover new brews. There is currently no robust rating system that goes beyond a simple 1-5 scale in a single category.
Solution: Create a comprehensive beer rating system that creates a custom beer profile for the user to match them to new beers and create a profile library for favorite beers.
About: Alemate is a valuable tool in any beer drinkers’ app arsenal. Use this app to identify beers that match your personal preferences, create custom beer profiles, and find the beers you like at the closest available location.
Along with being able to find the right beer that matches your specific tastes, it’s fun and easy to use while having a robust rating system to make sure the beer you’re picking is going to be the right one for you.
Show off your prowess next time you’re at a brewery with Alemate’s patented color identifier, which allows you to use your phone's camera to match the beer’s color with our database of beers. See if your mate’s beer matches your flavor profile to find out if it’s the right sud for you!
Untappd is a multifunctional app that allows users to rate beers on a scale of 1-5, and write personal descriptions for their taste notes.
It allows users to find breweries, direct message other users, and show the breweries you’ve checked in at.
What separates Alemate is that the beer rating is much more quantifiable than a simple 1-5 of how much the user enjoys the beer.
Overall, the app is convoluted and difficult to use.
Target Audience -
Beer drinkers under the age of 65. For beer enthusiasts and picky sippers.
People that are willing to try new things, but know their preferences and what they normally like to drink.
As the beer market continues to grow with an ever-expanding range of flavors and styles, so do user’s preferences for the beers that they like. Beer drinkers deserve to know if the beers that they buy will be one that they will enjoy!
Untapped has 9 million users. We believe there is a significant market share of users of the app that would use only Alemate over Untapped, or a hybrid use of both.
Final logo and branding
When walking the users through the wireframes we realized we were creating a stale and non-user friendly product. The rating system was indeed comprehensive (win), but at the cost of engaging the user in a fun way (lose).
We decided to work through user flows to decide what are the key functions and features of the product, while brainstorming ways to make the usability more engaging.
Our UX design shifted from a simple rating app, to an engaging rating system.
Intuitive: The user would begin by taking an image of the beer glass or the can/bottle. Our AI system would recognize the can or bottle and match it with that beers profile, saving the user from having to manually enter in the beer information (brewery, IBU, ABV, etc).
AI Features: If the camera recognized a beer glass, the user could swipe left or right to match the glass filter with the glass shape. Our advanced AI technology would analyze the beer color and make a guess on the beer itself based on the color, beer profile and geographic location.
Engaging: Next, a user would be taken to our rating page. An empty beer glass would appear with rating categories above the glass (aroma, flavor, taste, etc). The user would then "fill" the glass by sliding a bar to give that category a rating of 1-5. Then, they would swipe over to the next category, filling the glass again.
Comprehensive: Once the user has rated all the necessary categories, our system will create a rate card profile for that beer. The rate card includes the average score of the beer (averaging all the rated categories together) and breaks down the individual rating categories. The card will also tell you what your profile match % is based on your beer profile and the nearest location of where you can purchase the beer.
A breakdown of the UX screens and function
We conducted usability testing of our prototype to look for user pain points and areas of improvement.
Pain point 1: Through usability testing we recognized the sliding bar on the right side of the screen was not in a convenient location for most users (who are holding their phone in one hand and most likely a beer in the other).
Pain point 2: The sliding scale is not intuitive enough for the user. We needed to enlarge the thumb icon and add a brief animation showing the liquid filling to make the user more aware.
Revised prototype rating screens
Revised the user experience of filling the glass with an easier process.
User task studies - 100% success rate of users rating the categories correctly.
Final UX Screens
Alemate launch and marketing
Thank you for reading!