Home

Portfolio

About

Contact

Home

Portfolio

About

Contact

Home

Portfolio

About

Contact

Home

Portfolio

About

Contact

Spend less time in the
kitchen & do what you love!

UX/UI Case Study

UX/UI Case Study

UX/UI Case Study

Duration time

Duration time

Duration time

Tools

Tools

Tools

Task

Task

Task

Problem

Problem

Problem

Three weeks.

Three weeks.

Three weeks.

Adobe XD, Figma, UsabilityHub

Adobe XD, Figma, UsabilityHub

Adobe XD, Figma, UsabilityHub

The task was to create a cooking recipe app as part of a Careerfoundry student project.

The task was to create a cooking recipe app as part of a Careerfoundry student project.

The task was to create a cooking recipe app as part of a Careerfoundry student project.

During the user research process, I realized that potential users needed the process of finding what to cook to be streamlined. Saving time was the top priority for them.

Before arriving at the solution, I followed different steps in the design process:

During the user research process, I realized that potential users needed the process of finding what to cook to be streamlined. Saving time was the top priority for them.

Before arriving at the solution, I followed different steps in the design process:

During the user research process, I realized that potential users needed the process of finding what to cook to be streamlined. Saving time was the top priority for them.

Before arriving at the solution, I followed different steps in the design process:

To get an Overview of the Competition I started by analyzing the Key Objectives, Overall Strategy and Market Advantage of two of the top ranked apps in the market.

After researching their Marketing Profile, and doing a SWOT and UX analysis I found the following needs of many of their users:

To get an Overview of the Competition I started by analyzing the Key Objectives, Overall Strategy and Market Advantage of two of the top ranked apps in the market.

After researching their Marketing Profile, and doing a SWOT and UX analysis I found the following needs of many of their users:

To get an Overview of the Competition I started by analyzing the Key Objectives, Overall Strategy and Market Advantage of two of the top ranked apps in the market.

After researching their Marketing Profile, and doing a SWOT and UX analysis I found the following needs of many of their users:

Needing some improvements in the Layout to better understand some of the functions of the app.

Needing some improvements in the Layout to better understand some of the functions of the app.

Needing some improvements in the Layout to better understand some of the functions of the app.

Many users were dissatisfied because of the reductions of languages in the app.

Many users were dissatisfied because of the reductions of languages in the app.

Many users were dissatisfied because of the reductions of languages in the app.

Lack of Filters or Tags that helps with the research inside the app.

Lack of Filters or Tags that helps with the research inside the app.

Lack of Filters or Tags that helps with the research inside the app.

Competitive Analysis

Competitive Analysis

Competitive Analysis

UX Research

WHO

The target is people between 25 & 49 years old who have a busy life. They would like to spend as little time as possible cooking.

They would love to get practical recipes with ingredients they already have at home and some inspiration for their everyday.

They would love to get practical recipes with ingredients they already have at home and some inspiration for their everyday.

They would love to get practical recipes with ingredients they already have at home and some inspiration for their everyday.

WHAT

Users may come home exhausted from work, without much desire to be creative when it comes to cooking.

Users may come home exhausted from work, without much desire to be creative when it comes to cooking.

WHY

UX Research Findings

UX Research Findings

UX Research Findings

Look for apps that saves them time.

Would like to have an option where they can find recipes that fit in with what they already have at home.


Like the possibility to add the ingredients to a shopping list.


Would like to have a more user-friendly site.


Wants to have the option to set the number of servings in the recipe.

Prefer to have easy to find ingredients in the recipes.

User personas

User personas

Linda

45 years old

Jornaliste

Flexitarian

Married with 2 kids

Linda likes to spend quality time with her two children, 9 and 5 years old and her husband. The three of them live in a house on the outskirts of Paris, from where she writes for a Parisian newspaper.


Frustations

It is difficult for her to find recipes that fit the products she already has at home.


She doesn't want to spend a lot of time looking for recipes.


Find simple recipes that her children can participate in as well.




Goals

Brian

35 years old

Teacher

Flexitarian


Single

Brian is a warm hearted person, who likes to share with people who are really important to him. After work he likes to go make Yoga in the park, work out at the gym, and spend time with his friends.


Frustations

Spend too much time searching for hard-to-find ingredients


When a recipe has very exotic ingredients and does not contain the ingredients that could substitute them.

To be able to adapt the recipes according to the number of guests.


Having a nutritionally balanced diet.



Goals

Sara

30 years old

Psychologist

Vegetarian

In a couple

Eva likes to help others and focus on solutions instead of problems. She cares about the environment and enjoy fighting for just causes. She likes to read, go to festivals, exhibitions and usually goes everywhere on her bicycle.


Frustations

Having to use an app with no visual aesthetics in its interface.


Finding unexplained technical terms in a recipe.


Not to have a step-by-step on the recipes.

Find recipes that suit the products she already have at home.


Easily add recipe ingredients to a shopping list.



Goals

User flow

User flow

User flow

USER STORY 1

USER STORY 1

USER STORY 1

“As a busy user, I need to be able to find a recipe that match the ingredients I already have at home, so that I can save time”.

“As a busy user, I need to be able to find a recipe that match the ingredients I already have at home, so that I can save time”.

“As a busy user, I need to be able to find a recipe that match the ingredients I already have at home, so that I can save time”.

USER STORY 2

USER STORY 2

USER STORY 2

“As a busy user, I need to be able to find a recipe that match the ingredients I already have at home, so that I can save time”.

“As a busy user, I need to be able to find a recipe that match the ingredients I already have at home, so that I can save time”.

“As a busy user, I need to be able to find a recipe that match the ingredients I already have at home, so that I can save time”.

Overall solution

Overall solution

Overall solution

How could I meet users needs through "Easy Cook"? After the results of user research and usability testing, I decided the following:

How could I meet users needs through "Easy Cook"? After the results of user research and usability testing, I decided the following:

How could I meet users needs through "Easy Cook"? After the results of user research and usability testing, I decided the following:

The design should be as minimalistic as possible, helping users to find the desired recipes.


The design should be as minimalistic as possible, helping users to find the desired recipes.


The design should be as minimalistic as possible, helping users to find the desired recipes.


Remove the hamburger menu and include different search options in the search bar.


Remove the hamburger menu and include different search options in the search bar.


Remove the hamburger menu and include different search options in the search bar.


Add to the footer an icon that allows users to quickly search for recipes based on ingredients they already have at home.

Add to the footer an icon that allows users to quickly search for recipes based on ingredients they already have at home.

Add to the footer an icon that allows users to quickly search for recipes based on ingredients they already have at home.

Add an option that allows users to quickly and easily add the necessary ingredients to a shopping list.

Add an option that allows users to quickly and easily add the necessary ingredients to a shopping list.

Add an option that allows users to quickly and easily add the necessary ingredients to a shopping list.

The language should be clear and concise to allow users easy access to the information.


The language should be clear and concise to allow users easy access to the information.


The language should be clear and concise to allow users easy access to the information.


Moodboard

Moodboard

Moodboard

Low fidelity

Low fidelity

Low fidelity

Mid fidelity

Mid fidelity

Mid fidelity

High fidelity

High fidelity

High fidelity

Wireframes

Wireframes

Wireframes

A / B Testing

A / B Testing

A / B Testing

Choosing which design direction to take becomes easy when the potential users are the ones who decide what aesthetics they would like.

Choosing which design direction to take becomes easy when the potential users are the ones who decide what aesthetics they would like.

Choosing which design direction to take becomes easy when the potential users are the ones who decide what aesthetics they would like.

Typography

Typography

Typography

Color palette

A a

Articulat CF

aldery Pro blockletter /

aldery Pro blockletter /

aldery Pro blockletter

aldery Pro blockletter

Header 1 - Regular - 45pt

Header 1 - Regular - 45pt

Header 1 - Regular - 45pt

Title 1 - Bold - 30pt /

Title 1 - Bold - 30pt

Title 1 - Bold - 30pt

Title 2 - Bold - 20pt


Title 2 - Bold - 20pt


Title 2 - Bold - 20pt


Label 1 - Bold - 25pt /


Label 1 - Bold - 25pt

Label 1 - Bold - 25pt

Text Paragraph - Regular - 20 pt

Text Paragraph - Regular - 20 pt

Text Paragraph - Regular - 20 pt

Link - Demi Bold Oblique - 20pt

Link - Demi Bold Oblique - 20pt

Link - Demi Bold Oblique - 20pt

Primary

Primary

Primary

#1A1A1A

#1A1A1A

#1A1A1A

Accent

Accent

Accent

#664CF2

#664CF2

#664CF2

Background

Background

Background

#F1F1FF

#F1F1FF

#F1F1FF

Accent

Accent

Accent

#FFFFFF


#FFFFFF


#FFFFFF


Color palette

Color palette

Color palette

UI elements & icons

UI elements & icons

UI elements & icons

Primary

Secondary

Tertiary

Just take a look around

Normal

Hover

Active

Active

Normal

Hover

Hover

Hover

Hover

Active

Language guidelines


Language guidelines


Language guidelines


The language should be clear and concise because the user should have easy access to the information he/she is looking for.
The tone should be close but mainly neutral.


The language should be clear and concise because the user should have easy access to the information he/she is looking for.
The tone should be close but mainly neutral.


The language should be clear and concise because the user should have easy access to the information he/she is looking for.
The tone should be close but mainly neutral.


Responsive design


Responsive design


Responsive design


High fidelity wireframes


High fidelity wireframes


High fidelity wireframes


High fidelity wireframes