FMP – COLOURS

I always loved colours and I was always fascinated by psychology. I wanted to be one…I’m glad that my life took a strange turn and I ended up studying towards a career in design. Especially ever since I had a Michael Bieurt like enlightenment with regards to the visual arts.

not everything is designBut design is about everything

79 short essays on design

After the many great guest lectures we had and knowledge I have gained throughout this year I now know how much philosophy and psychology relate to graphics.

I was so excited and occupied by my research for the HMV project. I mentioned before that my personal style truly began to develop throughout that project. This is due to the nature of my theme and aesthetics…colour and colour psychology.

I felt so passionate about the research I have conducted and work I produced for that project I wanted to take that further. So in scientific and psychological means my research for the HMV project was the base for the FMP colour psychology research.

Due to me gaining relevant knowledge and understanding I felt I was able to combine colours in a way that will stimulate and trigger the mind to keep it excited and motivated as well as create a harmony and a balanced contrast that has a pleasant feel.

In terms of colour swatches I looked at some of the colours I have done for the HMV project. Mainly in terms of the choice of colour for the patterns, as I repeated – carried on with the style – of the same / similar patterns. However the HMV brief was different in nature, firstly because I only featured two colour groups (orange and pink) as well as I was heavily grouping together colours from either the same colour group or ones that relate to one another to create a specific mood (warm or cool – happy and upbeat, slow and mellow)

The idea for the FMP was to trigger and excite the human mind through psychology in order to motivate the subconscious of any, but particularly young adults who are likely to experience mental health issues and need a boost to stay focused and balanced

I wanted to ‘spice things up’ in terms of the choice of colour pairs for this project

I used the default swatches that appear on InDesign and modified them when needed
– this is where I went wrong while making colour choices for the app. Instead of creating the swatches in advance and having them in front of me to maintain consistency I edited the default swatches and tried to match the stationery ( For the app interface I opened a ‘mobile’ page in InDesign. Because it is web format the default colours appear differently)

Stationery – initial colour scheme

original colour scheme – organised – for stationery

These swatched show the main colours I have used for the stationery. Though there are gaps, there is a nice harmony and a system began to form. I arranged the colours to show a nice link and connection, however within the layout opposites are paired to show contrast.

For example: 

one of the spreads within the Meal Planner and Shopping List 

feature a series of pinks (various saturation) and a series of blues

Stationery – final colour scheme

This is the final colour scheme for the stationery products (Meal planner, Shopping list, Procrastination Diary)

I have looked at the previously used and created colours and swatches. I haven’t changed the original scheme, I just added to it and created an analogous for each colour in order to show the whole range of colours used within the stationery. As I considered colour psychology within my design, in my work I mostly used ‘opposites’ or complementary colours. Arranging the swatches this way helped me pick out and pair colours that will  create an exciting and lively contrast that is not harsh on the eyes but will trigger motivation and positive emotions.

App – Initial colour scheme

I have primarily focused on the stationery. Throughout the development and process of the app interface I was heavily focusing on the layout and neglected the colours. I was using similar colours but not the previously created swatches. The colours I used for the app weren’t working. I kept changing and experimenting. I was looking at the work I have produced for my work experience and decided to use some of the swatches from it. After much trial and error with regards to the colours I have realised where I went wrong. The colour scheme and swatches for the app should be the same as the stationery and maintain consistency. As I am new to UI/UX design, at first I didn’t realise how overwhelming the amount of colours I used. The nature and experience of web and app are completely different to print and I had to conduct more research in order to better understand the field of this practice and its rules.

The above swatches are from the first version I created for the app interface. In order to show how different the stationery and app swatches were originally I compared the two -the one on the right is the stationery and the left is the app. Though originally the colours of the stationery had gaps, the main colours I used had a harmony. Within the layout, work and initial designs I used complementary colours, the swatches I put together are grouped in an analogous way – which means that related colours are used/paired that don’t stand out from one another In comparison to that the colour scheme for the app was all over the place. Even the colours from the same colour group didn’t match. I had to simplify the colour scheme and make sure the swatches didn’t clash.

NEW COLOUR SCHEME – RESEARCH

I finally realised that I should’ve conducted more thorough research with regards to app design. I was so set in my ways and I had a ‘print’ mindset, not realising that in the world of user interface it is different and seen as UI/UX design – though still relevant and related to graphic design – it is an individual discipline with its own principles.

So I began to research in order to better understand these principles. I came across this online article that provided me with the best resource I could look for in a short space of time. It helped me understand that user experience and app users respond better to simplicity.

Thanks to this article I now realised I have to limit my colour scheme and swatches. A research showed that majority of app users mainly prefer simple colour combinations made of 2-3 colours. – I chose 5 colours. The article also mentioned Adobe Colour CC, a software

Screenshots of Adobe Colour CC – copying/ transferring colour no./names from InDesign to Adobe Colour CC

Adobe Color CC made color selection extremely easy. The software allows you to select individual colours and shows when swatches clash.

I began by selecting a few colours from the stationery scheme – in order to maintain consistency

The colours I originally chose were:

I entered the no./name of these colours and I began playing around. I came up with four templates I thought worked the best for my project. I chose the final from these.

Adobe CC automatically adds five swatches to your template. Though the most preffered app interfaces are minimal in terms of number of colours that are used, I decided to use 4-5 colours. I began with the chosen swatches from the stationery colour scheme as you can see in the first version (V#01-CC). 

I played around and edited the swatches. I was experimenting with different variations that express and have different effects. Some of the versions are very calming and some are more stimulating. I decided to go with a stimulating series, as that matched the overall theme.

FINAL COLOUR SCHEME

This colour scheme matched the mood and aesthetics of the stationery. Stimulating colour combination, it creates a happy and excited emotional, physical and psychological effect due to the colours from yellow, red and orange as well as a nicely balanced calming contrast due to the shades of bules.


Leave a comment

Your email address will not be published. Required fields are marked *