Initially, I was brought on to tackle the UI and visual design, while designing the A.I. interactions and compatibility for the app, but noticed almost half of the UX needed more attention and refining. I was given a few preliminary materials to begin this project (target audience, personas, competitors, and a rough understanding of the project’s direction). I spent the bulk of my time restructuring my wireframes, improving the UI, and branding.
The app’s defining feature is its A.I.- compatibility and machine learning. I researched how AI is utilized in mobile apps and the different UI patterns that easily train users to become comfortable working with a machine. Through this research, I created a chatbot that the user could either text or utilize a voice-chat feature to respond – as if they were texting with a live person.
To further define the UX and help Kitchen Sink stand out, I created a competitive analysis from the list of competitors I received – Listonic, Bring!, and Yummly. I chose to analyze the user experience, each app’s special features, and to see where Kitchen Sink could fill in some holes.
However, because I was initially brought on under a UI role, I saved time by making a general chart for all three brands instead of highlighting each app's strengths and room for opportunities separately.
For this project, I was provided a couple of personas from another UX Designer. From there I was able to quickly create an empathy and journey map to further understand one of the target audiences.
Persona: Cindy – a 28-year-old graphic designer who connects her social identity and experiences with food and wants to master her cooking skills so that she can meet new people.
Persona: Jess – a 35-year-software engineer who is often busy and wants to find easy, new, and quick recipes so that she can get back into the joy of cooking.
Journey Map: Jess wants to pick up some missing ingredients on her way home from work for a dish she recently discovered on Pinterest. She already feels that she has limited time and energy to cook, but feels a bit inspired anyway. After going home and realizing that she is still lacking some ingredients she ultimately ends up making something quick and simple and plans to make another attempt for tomorrow instead.
Empathy Map: Jess doesn’t feel that she has the time or energy to cook, but would love to find something new, quick, easy, and most importantly, delicious!
After going back over the project notes and my maps, I made a quick initial sketch for my user flow and tried to visualize it as a wireframe that I would later iterate upon.
Since the project mainly required me to focus on designing the A.I. interaction with the user, I wrote one user story to help guide me through the user experience.
“April wants to find a tasty easy recipe with the ingredients she has leftover in her fridge.. ”
I then wrote out a user flow that explains how April could find trending recipes recommended based on the ingredients she provides the A.I. in the app.
I originally digitized my wireframe in Figma based on my sketches. After reviewing my low-fidelity wireframes with a Sr. UX/UI Designer, I re-structured them to have the closest solution towards a happy path. I wanted to make sure the users retained the option to use the app without inputting the ingredients they already have in their kitchen as well (i.e. - without using the A.I. assistant in the app).
To test my design solution, I put together a few screener questions in Google Forms and contacted a few respondents to test. Each participant was given the same task to complete while I collected qualitative and quantitative feedback through their body language or facial expressions (behavioral observations) and any verbal feedback received.
The biggest road bump during my testing was the chatbot. While people noticed it, mainly due to its placement, button color, and pop-up text bubble, they seemed more hesitant to interact with it. When asked why they replied that they didn't understand how they were supposed to interact with it or what it was exactly. The rest of the prototype tested well otherwise. (based on original prototype)*
"Use the app to find a recipe based on the ingredients you have in your kitchen and then add the missing ingredients to your grocery list.”
I am interested in designing an additional sync feature that would connect with any smart fridges, like the LG InstaView refrigerator, allowing the device to see into your fridge when inputting ingredients instead of manually adding them.
