Design: Layout & Colour

Screen Based Design


This is the development of the layout and colour for the home screen. Firstly, I put in the icons i had designed and added the search bar, heading the page with the logo. Looking at the icons with the other page elements, I thought the page might be slightly overwhelming in colour, so i switched the colour to the icons and the text, this created an overall cleaner atmosphere. I also added drop shadow so the boxes didn’t get lost in the background.

In the first designs the the shades went from light to dark, I realised that ‘Settings’ being the darkest shade, drew attention away from the top few icons that are more crucial to the app because of this I tried switching the colours around on both designs.

Finally I looked at both designs critically and saw that the lightest shade was too similar to the light grey and white text/image. I resolved this by cutting the colour scheme in half, getting rid of the lightest and darkest colours and one of the in-between colours. Each level of icons then were one colour. In comparison to the previous designs it produced a more compatible design and drew in the logo as part of the fading effect as it is comprised of the darker shade that is no longer in the icons.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s