From Home website
Project overview
The product
From Home is a cooking tutorials website that offers options of planning the meal based on available ingredients. The main user group are busy students and workers at the age of 20-40 years. The From Home’s goal is to make planning of meals more easy to users.
Project duration
July-August 2023
The problem
A lot of websites provide large variety of recipes, but they are not adapted for users with different levels of cooking experience or has a lack of time to search the right recipe.
The goal
To make From Home`s website friendly and easy to navigate, so the users could find recipes in short terms.
Understanding the user
User research: summary
I conducted interviews with potential users, by using this information I created empathy maps to better understand their needs. I found out that the reasons why users looking for recipe online can vary from searching for recipe for special occasion to find the recipe for meal planning. Some of users noticed that they are not so often search for recipes online because they prefer to cook quick and simple dishes, so I thought about how to make this users also be involved on website and how it will face their needs.
User research: summary
Navigation
Websites with tutorials often have too much information and less structure.
Lack of unique recipes
Websites with recipes are often repeat informatin from others website wich makes them look similar and uninteresting to users
Qlattered designs
There is often a lack of negative space on websites and a lot of adverticing which disturbes user from their main goal.
Time
The cooking websites are full of information but often it takes a lot of time to find the recipe that suits all of the users needs.
Personas
Persona: Liam, problem statement:
Liam is a student, who works full-time, who needs quickly find easy recipe with available products because he don`t have much time to go for additional shopping or cook complicated dishes.
I also created second person Kamil wich represents group of users who search dishes mainly for special occasions
Starting the design
Sitemap
One of the pain points was problems with navigation, I made a sitemap to structurize the website. While working further I changed some cathegories to make the navigation more clear.
Digital wireframes
One of the most valuable pain point was navigation, so I decided to make it wide enough to users so they could find receipe more quickly.
At the step of creating wireframes I also thought about accessibility of From Home website, so I added a subtitles option to video and script of the video divided into logical steps.
Digital wireframes for different screen variations
Usability study parameters
The product:
Study type:
Moderated usability study
Location:
Kyiv, Ukraine
Participants:
5 participants
Length:
15-20 minutes
Usability study: findings
Navigation
The searching system wasn’t structured enough and was unclear to users
Functions
Users needed hints and more clear and intuitive options for calculating. The searching menu was too big.
Content
Some names and icons were unclear to users, also some of them expected to see the least of recipes not only for one day and month, but for week too.
Refining the design
Mockups
Mockups
While conducting research I found out that the system for searching was complex and not effective for users. So I decided to make one field that will be used both for ingradients and names of the dishes, which can help create more custom way of searching, also except adding a lot of tags by input form I decided to make a list where user can choose what they need.
Also while conducting research I found patterns that are reletad to icons: some of the users needed hints on what they mean, so I decided to use a more descriptive language (like account icon with name and label for stars that means difficulty. Also I attached the main menu and searching panel to the top, so the users wouldn`t need to scroll all the way backwards to find it.
You can click the interactive prototype below