Project 4 — Visual Design & Branding

Visual Design Week - Using Colour, Styling and Brand Development for 
Project 1. Jimmy’s Fitness & Nutrition App - Happy Feet.

Visual design week was a fantastic introduction to visual design, colour theory, typography and the principles of branding. I would be taking the app I designed specifically for my colleague Jimmy and would develop it into a brand. Then using the techniques learnt in design week I would style the app with colour and typography, identify its character and through user testing refine and define its branding.

The Brief:
I was asked to revisit our app from project 1 and develop the app, taking it from the current paper prototype into a high fidelity wire frame prototype with colour and a defined branding.

Approach:
Before I could consider developing and building the high fidelity wire frame prototype I had to establish a colour scheme and branding. Firstly we build a mood board, I collected images form a variety of food magazines and running magazines. I cut out the most inspirational and nicest pictures and glued them in a collage on A3 boards. I used these boards to synthesise colour and design style ideas. Next we looked at brand affinity and used this exercise to determine what kind of character traits my app would have if it were a car or a person. We also looked at existing brands to see what similarities my app would have with other well known brands. From this we were able to make a brand personality document consisting of 
1: brand affinities — those brands with which my app would like to be associated. 
2: Personality Traits (other wise know as Goldilocks statements): for example — “I’m reliable but not boring” 
3: Voice description: which is a statement outlining the objectives of the brand personality. Next I set about creating a style tile, this is a document containing type styles, a colour palette and several of the key buttons and elements required for the app. The purpose of the style tile is to influence the look and feel of the apps interface ensuring it matches the brand personality. Using the brand personality we could now move onto the re design of the app’s interface, I looked at the feedback and recommendation from project 1. Most of the changes were very small and I was able to prepare 3 of the major screens with which to test colour scheme, typography and branding philosophy. I was able to gain valuable feedback from numerous user testing sessions. After each round of user testing I was able to iterate and develop the app further.

Mood boards:

Pic 1: Mood boards: Taking the most inspirational, relevant and colourful images from magazines and newspapers, I cut them out and glued them onto sheets of paper to make a collages. These sheets formed the basis of my colour palette for the app.

Brand affinity and personality statement:

The brand affinity exercise allowed me to define the brand character and give my app a personality, which I could work towards. The personality statement was the consolidation of the brand affinity exercise.

Style tiles:

The style tile combines all the colour and type styles for the app based on the mood board and brand personality. It aims to influence the look and feel of the app. We see here my first iteration and the final version. There has been plenty a development on the colour palette.

Interface and icon development:

I looked at the interface and made some basic changes as suggested in user feedback form project 1. I also looked at the icons and simplified the interface. These were refined and included in the final hi fidelity wire frames.

First prototypes:

we see the original final prototype form project one and the first iteration of the wire frame prototype, based very loosely on the style tile and brand personality.

The latest prototypes:

After several round of testing and a critique from two of my classmates, I was able to implement valuable feedback which brings me to the iterations you see here.
“The steps to goal needs to be less confusing”
“The buttons on the bottom are too small”
“The background colour is not very appealing”
“The logos say exactly what they mean”

Outcome:
The power of style tiles and having a defined brand personality cannot be underestimated. I learnt that a clearly thought out colour scheme and use of good typography can lift a design and add value. When all the elements of visual design are brought together the result can be stunning. Taking simple wire frames and adding the elements of visual design has been an enlightening experience. Moving forward the app still needs further development and iterations to refine the app and move it closer towards the brand character.

View the current prototypes here:

https://invis.io/M65PYUAPK

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.