Developing a design guide

key factors that must be included:

• What are the three most essential features? 
• What is the most essential feature?
• Simple overview of what the programme does
• Detailed walk through of every click
• Wireframes/patterns
• cite map
• Design aesthetics:
• Typography/type size
• Colours
• Usage of icons 
• Size of icons in comparison to type (pixels)
• Physical attributes needed

The three most essential features to the product include:

• The ability to complete payments, confirm ID and to store receipts. 
• To provide a safe/secure centre for this information
• To express a user friendly product

Simple overview:

The programme allows for quick payments, Id checks and hassle free receipt storage. The user is able to develop their own online wallet in which this information may be safely stored. Once the setup is complete the app will be accessible through the control centre with fingerprint verification acting as the key security feature. 

Walk through of app:

When initially entering the app a landing page faces you, this can then re-direct you to three aspects of the app (PAY, ID and STORE), the outcome depends upon the initial selection, variations are expressed below.    

When Pay is selected the consumer is directed to a page in which allows for the scanning of their bank card, after completing this action two variations are expressed (an approved or failed spread). If the conformation has failed, further options are expressed to allow the consumer to either ring their bank or apple. After confirmation the consumer is then directed to a screen whereby all their current cards are stored. (Only 3 cards may be stored at one given time). An option is then accessible to the homepage, whereby a screen allowing both RECEIPT/ ID setup is expressed. 

When ID is selected the consumer is directed to a page in which allows for the scanning of their ID (provisional/diving licence), after completing this action the consumer is re-directed to the .GOV website whereby they must log in to confirm their details. An approved page then appears and after 10 seconds the page is then re-directed to the landing strip whereby a screen allowing both RECEIPT/ PAY setup is expressed.

When Store is selected the consumer is directed to a page in which allows for the scanning of their receipts, this being conducted through the QR code present. One scanned the consumer is directed to the store page, whereby all receipts are stored. Options are then available to add/remove receipts. 

Design aesthetics:

Typography:Avenir is used throughout

Type should be centralised, apart from add ons.

The type size is dependant upon the usage of the type, for example heading etc. 

Headers: 48 pixels

Subheading: 36 pixels

Bodycopy: 27 pixels

White is primarily used for the set up background, with black later being introduced.
Black backgrounds contain are opaque by 20% to allow background apps to appear present. 

Red-Header

Blue-bodycopy

Colours used: 3595b1, f59e19, 58b032,ffffff,000000

Icons: