3

I am trying to improve my design side on web design. I have design a mobile app using a platform called ApplicationCraft which gives me mobile 5 mobile themes (colours) and have created a 'nice' looking app using the green theme.

I allow the client to add their own logo & banner which then conflicts with the green theme I am using.

I can use CSS to change the colours of the theme so I need to know if there is a 'Standard neutral' range of colours to achieve this.

This is my current screen:

Screen dump

Improve this question
3
  • 1
    There is no "standard". Color theory is an exceptionally broad topic and not easily covered in a Q&A format. You might try here: worqx.com/color
    – Scott
    Commented Jan 20, 2014 at 13:46
  • 1
    As scott states, there is no standard. Though if you're struggling, it's probably best to strip down the color as much as you can. There's a reason a majority of the desktop UI consists of mostly light grays.
    – DA01
    Commented Jan 20, 2014 at 20:07
  • I agree with you both :) That's why I went for pulling the green out in my answer as well as providing some resources on where to start with colour theory - it's definitely a beast far beyond Q&A! :)
    – Jenna
    Commented Jan 20, 2014 at 21:14

2 Answers 2

Reset to default
4

I think the only way to keep this so that you wouldn't need to edit the colours depending on each client banner is to remove the green and replace it with an'almost' white (i.e not #FFF)

If you are using any particular colour there is always a chance that it will not be complementary to the banner or logo of the client.

Alternatively you could use a lower-opacity version of the most dominant colour in a banner in place of the green. This would be different for each client though.

I would also suggest

Making the Morrisons logo a little smaller in the boxes - (at that large size the colour here is distracting),

Changing the colours of the Push and <3 icons to the neutral tone of almost black (just like you can see on this GD.SE site), that would go with the almost white. Or if keeping the colour, maybe even placing them elsewhere (like the menu on the top right of my suggestion below)

  • though of course I am not sure of your app or its function so that is entirely your choice dependent on if it would be a suitable user flow.

Suggestion;

enter image description here

I would also suggest allowing the banner to take up the space at the top, though I'll leave this to you, of course. It might look best to perhaps make it larger to fill the space some more and leave the icons down where the back button is.

There is some basic colour theory covered here and in relation to digital displays in particular here

Good luck with your work.

Improve this answer
2
  • 1
    Thanks for the help I managed to do some CSS on the Mobile list to have space around the images and made a simpler colour scheme.
    – user3193843
    Commented Feb 13, 2014 at 10:59
  • Great its looking much better! Glad to have helped, the simpler scheme makes a world of difference. Just some icons need tidying up and then I think you're almost there :)
    – Jenna
    Commented Feb 14, 2014 at 13:18
1

Thanks for the help, here's what worked for me:

I managed to do some CSS on the Mobile list to have space around the images and made a simpler colour scheme with some new button images

screen Grab

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.