Healthy Eats
The aim is for users to research new meal recipes on the web app so they can follow along and attempt cooking them. It provides the means to find a selection of healthy recipes, with an ingredient list and a list of instructions. This web app has been designed for adults, over 18 years old, who enjoy cooking at home because they want control over the type of healthy meals they consume.
My Process
Objective
To design a responsive recipe web app where users can search for healthy meals and access their ingredient's list and cooking instructions.
User Flow
Google Drawings was used to create the user flow. It shows how users can move from one webpage to the next, on the recipe app.
Users were interviewed to find out what they wanted from a recipe app. User personas were created from these responses.
Low-fi wireframes
Balsamiq Wireframes was used to arrange the placement of different components and elements used for each page.
Mid-fi wireframes
Figma was used to edit the arrangement of the selected components and elements used for each page. Real text was added to buttons, titles, sub-headings, paragraph sections, etc.
Hi-fi wireframes
Figma was used to add colour to the wireframes, using a colour scheme from the style guide. The style guide's typography was also applied at this stage.
Mockups
These mockups illustrate that this web app design is responsive. They show how they look on different screen sizes on various devices. These devices include: mobile phones, tablets and desktop screens.
Conclusion
The recipe web app was successfully designed. Users can easily search for healthy meals and find their ingredients list and cooking instructions. Improving on the design to attract over 18 year olds was also a success as user feedback from this demographic was collected and applied onto the web app designs.