Overview
For my bootcamp course , I was given the prompt to create an app for an ai bartender. After some research into the few ai bartenders that existed, I stumbled across Yanu.
Yanu is a new fully autonomous Ai. powered bartender , created to minimize error, and speed up the ordering/delivery process of drinks in busy environments. I am seeking to create a fluid app from which you can order and pay for your drinks. Yanu has the potential to mix 200 drinks per hour; In order to streamline this process, and make it even more contactless, I decided to design a mobile app that would connect to this system.
Problem:
The primary concern confronting users pertains to prolonged waiting times when queuing for drink orders and payment, significantly detracting from their overall enjoyment during their social outings. Conventional bar service entails wait times ranging from 5 to 10 minutes, escalating to as much as 30 minutes in high-traffic environments.
Proposed Solution:
To address this challenge, we have devised the Ai. Bartender app, a sophisticated platform that enables users to place drink orders and execute payments directly through the AI-powered system, all from the comfort of their table. By bypassing the traditional queue, users can experience a substantial reduction in wait times, thereby optimizing their leisure time and overall satisfaction with the service.
Discovery Research
In order to better understand the users and the potential pain points they face when ordering drinks from their favorite venue , I conducted in-field user interviews with over 10 people (who stated that they go to a bar at least once a month), with varying age ranges, around Mexico City.
Some of the questions used to understand potential users were:
What are things you like / dislike about drinking / going out for drinks ?
Would you use an ordering app for drinks ? Why ?
How would you feel ordering from an ai. bartender ? Why?
When and where do you think someone would use this app/product?
What is your experience ordering at a bar like ? How does it make you feel?
Hearing the users responses to these questions gave me valuable insight into how they think and feel, which aided in shaping the personas, as well as helping me construct the app with less bias.
Synthesize and Define:
Personas: Using our research , we developed 2 personas that fit the general audience that would be utilizing this ai. bartender. I mapped out their characteristics after conducting several in-field interviews with over 10 different people with varying ages around Mexico City. We then used these personas to create User Storyboard , and User Journey maps.
Wireframing and prototyping:
Based on the research insights, I drafted out some wireframes. I then transformed my paper wireframes into a digital wireframe as well as a low-fidelity prototype. I then gathered 4 users to test out the prototypes before making iterations based on their insights
UI Design
After the low-fidelity usability studies, I chose the brands colors, font, and theme. I then began constructing the high-fidelity prototype.
I chose a blue for the primary color because of the boldness and the contrast of a 5.74:1 according to WCAG standards
The red chosen was to differentiate between the food and drink card options.
Usability Testing (1st Round)
After creating my lofi prototypes, I gathered some some testers to give me feedback on the overall functionality of the app. A couple of the issues brought up to me were:
issue 01: Recent orders
Users mentioned that it would be convenient if there was a way to remember recent orders, to make the ordering process even more fluid the next time around.
solution 01: Recent orders tab added
I added a recent orders tab, for a more swift re-ordering process.
issue 02: Payment
Users stated that often times it's a hassle to have to put in credit card info since generally on their phone, they have multiple payment options connected
solution 02: Adding payment options:
I added common payment method options like Venmo, Apple Pay, and Paypal to the checkout page.
Usability Testing (2nd Round)
Users brought up a few particular design issues based on contrast/visibility and lack of labels on certain buttons. There were also quite a few bugs and buttons I missed linking (including back buttons that led to the wrong screens) . I went in after several rounds of personal testing to make sure everything was running smoothly, without any glitches. I then had users revise it once more.
5. Finalization
High Fidelity Prototypes
Some considerations during the design:
Giving visual feedback when switching between tabs
Highlighting the bottom menu buttons when selected
Visually engaging the user with fluid but not overwhelming interactions
Maintaining consistency throughout the app.
Legible, with great contrast.
Takeaways
I really enjoyed working on this project, and if I were to continue developing this in the future , there are a couple innovative or more accessible things I would add.
01: Adding connectivity to Uber, Lyft or other ride share apps (built-in directly) , to minimize risk of driving under the influence.
02: Designing a dark mode for more accessibility.
03: I think it would be very useful to have a downloadable app with a map view, showing all the venues that offer the Yanu.ai system.
The App in Motion: