Skip to content

Latest commit

 

History

History
40 lines (28 loc) · 1.77 KB

style-reference.md

File metadata and controls

40 lines (28 loc) · 1.77 KB

Design Principles

Warm: We want people to visit ChefUp and feel a sense of community and be excited to start cooking home made meals
Visual: there will be lots of photos of food and ProfilePage photos to encourage trust and enthuse people to use the app
Consistency: this style guide aims to show how we wil provide consistency through out the app, with colour, sizing, text and more
Don't reinvent the wheel - we want to take inspiration from other products and how for example they display a map - people who regularly use these products are familiar with a certain functionality and we want to emulate that

Design choices throughout app

Accessibility - at the forefront of all design choices
Icons - using recognisable icons for 'home' 'search' and where it is not recognisable, adding text
Mobile-first Design
Navigation - ability to guide through the app as the user wishes, going back and forth easily so the user is able to check over information.
Language - plain and simple communication.
Authentication - when a user is authenticated they will be able to book and add lessons otherwise, they will be requested to login/register

Icons & Colours

#DE561C, #FDA831, #F4D143, #D0EF84

Typography

Header: Roboto, bold, (size 24)
Sub-Header (info): Roboto Mono, Regular (size 18)
Paragraph: Source Sans Pro, regular, (size 16)
Action font: Source Sans Pro, bold, (size 16)

Golden Ratio

--space-xs: 0.382rem;
--space-s: 0.618rem;
--space-m: 1rem;
--space-l: 1.618rem;
--space-xl: 2.618rem;
--space-xxl: 4.236rem;