Cook it!
Project overview
The problem
Fast modern lifestyle does not encourage to cook at home or to cook healthy. People lack basic knowledge about healthy cooking and how to get started. In a result they go for a fast food or warm up processed meals at home. In the end their health suffers.
The goal
Design cross-platform tool that will improve education on the topic of healthy cooking as well as will offer easy recipes to get started.
The product
Cook it! is a cross-platform tool focused on helping people learn how to cook healthy meals. It offers guidance as well as easy recipes that will help get started. Primary target users include working adults living in big cities as well as well as any other who needs to take care of their health.
My role
UX designer leading the app and responsive website design from conception to delivery
Responsibilities
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs, determining information architecture, and responsive design.
Project duration
November 2021 – January 2022
Understanding the user
I conducted several user interviews in order to learn more about cooking habits. Most interview participants reported they lack time for cooking for many reasons. Additionally they pointed that there are many cooking rules sometimes contradicting on two different websites. They would like to start cooking healthy at home to improve their health. A simple solution that offers guidelines and recipes would be a great help.
User pain points
Time
Working adults are too busy to cook at home healthy meals.
Information noise
There are to many cooking rules, sometimes contradicting each other.
Complex recipes
Most often recipes are complicated and time consuming.
Persona & problem statement
Persona
Problem statement
Anne is a full time student as well as part time hotel receptionist who needs a website that will help her cook healthier meals at home because she would like to improve her health and reduce costs of living.
User journey map
I created a user journey map of Anne's experience looking for a recipe, shopping and cooking to help identify possible pain points and improvement opportunities.
Starting the design
Paper wireframes
I began designing with creating paper wireframes for the mobile app. My focus was specifically on digestible knowledge tips and simple recipe features.
Digital wireframes
When creating digital designs I focused on delivering cooking knowledge in a simple and digestible form.
Usability study findings
In order to check if the project is going in the right direction I conducted a usability study. During the moderated usability study 8 participants used a low-fidelity prototype to test the app. Below are the findings:
Home page
People want a tidy and simple look on the home page that offers clear categories.
Rules
People had to click to much to go through the rules section.
Search
People want to search for a recipe also using a key words.
Refining the design
Mockups
Based on the insights from the usability study I polished the mockups.
Accessibility considerations
Screen readers
Clear labels for interactive elements that can be read by screen readers.
Structure
Initial focus of the home screen on daily recommendations help define the primary task or action for the user.
The final product
Responsive Design
With the app designs completed, I started to work on designing the responsive website. I used app's structure to ensure a cohesive and consistent experience across devices.
Sitemap
Responsive designs mockups
The designs for screen size variation included mobile, tablet, and desktop. I optimized the designs to fit specific user needs of each device and screen size.
Desktop
Tablet
Mobile
The final product
Takeaways
Impact
Users shared that the mobile app and the website are simple and intuitive. They provide useful tips and guidelines. Available recipes are well suited for beginners therefore they do not discourage to take action.
„The design of the app as well as the website is clear and simple, therefore very usable. Information that you can find there is helpful and logically structure. I will definitely use it!"
App & web user
What I learned
I learned that even though the problem I was trying to solve was rather a big one, moving through each step of the design process and aligning with specific user needs helped me come up with solutions that were both feasible and useful.
Next steps
Add more educational resources as well as to add additional recipes.
