UX/UI Design

Freshly Dropped is a meal delivery service. I designed their new product, an app for recipes, with ability to purchase meals and ingredients directly from the app.

Challenge

This app concept is my graduation project from UI/ UX design course. The client, Freshly Dropped, a meal delivery service, already has an app and in their brief they specifically asked for a sister app with recipes. The challenge was to convert the users who are using apps just to read recipes, into paying customers of the meal delivery service.
The alternative would be to use the app as the recipe book and grocery list, and shop elsewhere. My goal was to design an experience where an alternative scenario would be less likely, and users would enjoy quick, smooth, and easy ordering through the app.

Research and Define

The first step was to check what competitor services are out there and what do they offer. I analyzed three biggest ones in the market. I noticed that all of them have exclusive partners that you users can order ingredients from, and those vendors can not be changed. After the research I conducted a survey with a focus group (5 users) to find what are the user needs? One of the finding was that users think that most recipes are unnecessarily long. With data gathered from the survey and competitor research, the target group was identified. New parents and Young couples, 25-35 years old,  interested in a healthy lifestyle and hobbies such as sports and film. They are busy building careers, they are always on the go and use many modern digital services. They don’t have much time and, on average, they are highly educated with good enough income to afford not to cook every day. They need short recipes with the option of ordering all the ingredients in as fewer steps as possible.
After I defined users needs, I summarized it and created the User persona.

Ideas and Prototype

Once I recognized the needs and goals of the user group and created a user persona, through the brainstorming session, I came up with several ideas, from which I narrowed down to a few. With the target group I conducted the interviews, and with the insights from it I decided on one solution, an app in which users can browse recipes, save them, and directly from the recipe or from the list, with one tap, order ingredients from Freshly Dropped meal delivery service.
The alternative use, as client insisted on having, would be to save the ingredients as a grocery list, and shop elsewhere with the possibility of linking other shops, e.g. Walmart.
Next, I created a user flow chart to help me visualize the steps user would take to complete a task. After this I conducted a usability inspection with the wireframes and learned how the product is used. The main takeaway was that users were mostly looking to take short steps and going straight to the the checkout. Following the results from the tests, the final design could begin. You can see the user flow chart below, and some of the final app screens design.

UI Design

Style Guide

I used natural colors to represent the freshness of ingredients. Green was chosen as a primary color since it directly associates with fresh and healthy fruit and vegetables. Gilroy font is selected as strong and memorable for headings and Noto Sansa as body text for easy and simple readability. The minimal look with friendly icons ensures pleasant browsing for users, and simple and straight-to-the-point buttons are designed to lead the users, from onboarding to purchase, with as least steps as possible.

Logo

Colors

#19EE59


Malachite

#136D6F


Skobeloff

#F95428


Portland Orange

#FFBC42


Supernova

Typography

Aa
headline

Gilroy ExtraBold

AaBbCcDdEeFf
1234567890

Headline

 

Aa
body

Noto Sans

AaBbCcDdEeFf
1234567890

Body

About

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae.

Icons

Buttons

Default

Pressed

Inactive

App Icon

Thank you for your attention!

Feel free to check another project

UX/UI Design

Unstuck is an assisting platform, that offers 1-on-1 helping sessions and coaching for digital tools, when you are stuck in your project.

Check project