italian homemade recipies hero

italian homemade recipes app

ux/ui app

The Italian Homemade Recipes App is focused on teaching users how to cook Italian food in their kitchen. The Italian Homemade Recipes App, provides an extensive collection of Italian recipes, sources some of its recipes from allrecipes and has proper credit to the original source. The app allows the user to find and favorite their recipes, join a community from across the world to share creations, and have their own account. This app uses classic Italian imagery and colors inspired by the Italian flag. A wireframe process to outline the app’s primary sections; including the homepage, recipe categories, and a user section, along with features such as a search bar, recipe filters, and social sharing options.

The Italian logo is in Look Script and features a tomato for the “i” giving the look an element of grace. The body copy and icons use DIN Alternate Regular and Bold, a clear san serif font for easy readability. The headers in the main section use the serif font Source Serif 4 Variable Semibold for consistency and legibility. The food imagery throughout the app helps the viewer to choose what they want to make. The app icon takes inspiration from the tomato featured in the logo. The prototype design of “Italian Homemade Recipes App” was user tested and created in MarvelApp.com.

illustrations

home icon

home

pastas icon

pastas

lasagnas icon

lasagnas

pizzas icon

pizzas

raviolis icon

raviolis

desserts icon

desserts

ingredients icon

ingredients

calories icon

calories

color & type study

red tomato icon

c:13 m:94 y:84 k:3

r:206 g:52 b:56

hex#:cf3339

green tomato icon

c:89 m:28 y:100 k:16

r:3 g:121 b:62

hex#:007934

white tomato icon

c:0 m:0 y:0 k:0

r:252 g:252 b:255

hex#:ffffff

black tomato icon

c:73 m:65 y:65 k:72

r:33 g:35 b:34

hex#:212322

look script regular font
source serif regular font
source serif semibold font
din alternate regular font
din alternate bold font

sketches

icon sketches

icon sketches

wireframes sketches

wireframe sketches

app screens

home page screen phone mockup

home screen

pasta recipe screen phone mockup

pasta recipe screen

pasta choices screen phone mockup

most popular pasta recipes screen

join the community screen phone mockup

join the community screen

join the community nav icon screen phone mockup

nav icon screen

settings screen phone mockup

settings screen

prototype mockup