Quick Cook
QuickCook is a website that offers daily recipes for food lovers and people who like cooking, who want to learn or prepare something good to eat, without any knowledge of cooking, the videos are made as tutorials with detailed steps to prepare something tasty. The typical user is between 20-45 years old, with any level of education. QuickCook’s goal is to make cooking easy, fun, and accessible to everyone.
ROLE
UX designer, from conception to delivery.
TEAM
Alejandro
Ramos
Rubio
STAKEHOLDERS
Quickcook's executives
TIME
July- August
2022
The problem:
Cooking websites frequently are difficult to navigate and usually are made for people with cooking skills, also they don’t recommend daily recipes to help to choose something easy. Another point is they are mainly focused on recipes that require a lot of time and they don’t have quick options and ways to share comments about the recipe.
The Goal:
Design QuickCook’s website to be easy to navigate with clear instructions and different ways to access to its content like desktop, mobile phone, or tablet. Also, it focuses on users with a short time giving them quick options and ideas to choose something good, accessibility is a key point to consider to give a better experience to all users.
Responsibilities:
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.
USER RESEARCH: SUMMARY
I conducted interviews and create empathy maps to understand the users I’m designing for and their needs. I discovered that primary targets look for new recipes, they are hobby cooks and want something new to eat, also those users are workers and they look for something quick and different to eat during the week and something more special for weekends. The users struggle when they search websites for something new, the websites are confusing and difficult to navigate. The users feel disappointed when they can’t follow the recipes or can’t find what they are looking for, spending time without any satisfactory results.
PAIN POINTS
Navigation
There is a lot of information with many links and images, recipes are in the same category and do not provide an option for new cooks.
Experience
The websites have bright colors and confusing navigation bars, some recipes do not have videos or the ingredients are not complete.
Options
The navigation does not have options to access to the previews recipes or have an account with favorites, also the users can't comment if they want to ask something.
PERSONA
"eating something new is discovering new stories"
DANIEL
Age
32
Family
Single
Hometown
San Francisco, CA
Occupation
Graphic Designer
Goals
-
Learn to cook new dishes from different parts of the world.
-
Find new vegetarian options.
-
Have fun with friends.
Frustrations
-
Find healthy recipe options for the week.
-
“Sometimes you can’t find the list of ingredients on the web”
-
Time searching for something different to cook.
PROBLEM
STATEMENT
Daniel is a hobby cook and food lover who needs an easy way to find new recipes because he wants to prepare tasty and healthy dishes.
Mapping Daniel’s journey map shows that a website with good navigation, offering great daily quick options with instructions, giving ways to share and read results with a comments section, also adding ways to find ingredients would improve his experience cooking.
SITEMAP
The main pain point of the users is the navigation, so this gives me the way to create a website easy to navigate only with the necessary information and focus on the user can find a good recipe just with a few steps.
PAPER WIREFRAMES
I worked in different sizes, to give the users options to access from desktop, tablet, and mobile phone.
DIGITAL WIREFRAMES
Moving from paper to digital wireframe shows how the navigation is going to be. The main point is to focus on the ways the user can explore the website on different devices.
website
tablet
phone
LOW FIDELITY
PROTOTYPE
I connected all the steps to find a recipe and play a video, also there’s an option to find markets around you. In this phase, I decided to change the ways the user click on the buttons and some confusing parts, so I addressed them to avoid these pain points in the usability study.
Usability study: parameters
Study type:
Unmoderated usability study
Participants:
5 Participants.
Location:
México, remote
Length:
20-30 min.
Usability study: findings
I conducted usability studies, wireframes revealed some aspects that had users confused, also I needed to refine some buttons and steps to move on the web.
Add Buttons:
The users find a bit confused to access the video recommendation on the hero section.
Ratings:
The users want a way to rate the recipes and write comments
Account:
Users want a more visible way to see their accounts.
MOCKUPS
Based on the insights from the usability study I added a button on the hero to make it easy to access, in addition, I used a bright color to emphasize the action. Also added the ratings and comments options to give a better experience to the users. I included some variations of responsive design for mobile devices, this allows the users to look at the recipe on the way home or anywhere using their phones.
Before
After
Website
Mobile
HIGH-FIDELITY
PROTOTYPE
The final high-fidelity prototype gives great navigation to find the recipe they want, and also they have the option to find markets around them, I adapted the changes of the first usability study to solve the previews problems.
Accessibility considerations
Landmarks were used to make it easy to navigate.
I used contrast in the action buttons to avoid any mistakes and be easy for the users to find them.
I used headings to give hierarchy
IMPACT
Users can navigate easily and find daily recipes, solving their problems by searching on different sites, also they have multiple ways to access sections, giving the option to find the recipe and category with just a click. With the option to sign up and save their recipes, they can select in advance and plan the whole week and go to the market to buy the ingredients.
WHAT I LEARNED
It’s important to think about how the user is going to use the product, giving them options to access from different dispositives can solve time and access issues that can lead to lose a user, sometimes the small details like color or buttons with the right size can change a lot the experience of the user, the use of typography and hierarchy are the key elements to transmit a great message.
NEXT STEPS
Create an option to link with local markets and supermarkets to have the ingredients already in the cart for each recipe, giving even a better experience for the user.
Conduct another usability study to know if the experience improved, and take note of everything, with this step I will realize if the pain points were solved efficiently.
Create additional features, like a photo section where the users can show their results.