Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

Our customer said they wanted a minimalistic user interface, with a Windows 8 feel. However, I am a developer and do not have any experience with user interfaces. So, I went ahead and found the color codes Microsoft uses and now it looks like a unicorn puked into my program.

colors

There are really good UIs out there, I just cannot figure out what the problem with mine is. I did a "dark theme" to figure out if it was about placements, but guess it is not.

dark

What is the main weakness of my design or color selection?

Explanation about the UI:

The buttons on the left are for selecting forms. The rest of the screen changes according to the form selection. I am using winforms, if it matters.

share|improve this question
17  
+1 for unicorn puke! :-) –  LindaBrammer Aug 1 '13 at 14:31
1  
Thanks. I am trying your great suggestions. I will get back when I'm done. –  HebeleHododo Aug 1 '13 at 15:03
1  
This would be an appropriate question for Graphic Design. –  zzzzBov Aug 1 '13 at 19:52
    
Well it is Windows 8 :) –  Michael Aug 30 '13 at 9:34
add comment

4 Answers

up vote 6 down vote accepted

It may not be your color scheme -- it may be that in your layout, nothing "wins", and there is a lot of visual noise.

Every selection looks equal in importance, but I'm sure they are not all equal. Make your hierarchy of information visual. Maybe your default button should be larger than the other choices. Let the thing that is most important to the user win the bid for attention.

There is also little visual interest, because everything is a box. Provide some contrast by varying sizes or shapes.

There is a lot of visual noise. All those different colors are competing for attention. What if instead of making each of the left side items big colored boxes, you made them all gray, and only applied a stripe of color to the left edge? A lighter hand with color might help.

Or, hire a visual designer. :-)

share|improve this answer
add comment

The metro interface is actually made of one color in two shades, a dark one in the background and light one for the tiles. The dark color can be replaced by gray. You never get real black in any of microsoft's interfaces, and you don't get two different colors.

The other colors come from content displayed on live tiles - photos and videos, mainly, but also applications' specific colors - and they are usually less bright and less saturated.

If you take a look at the outlook or the office cloud designs, you'll see they follow the same rules (using white, grey and orange OR blue).

Black and bright colors are both very agressive on screen. You shouldn't use both at the same time.

share|improve this answer
add comment

I wouldn't use black as your background. It's way too much of a contrast between the content you have. Windows UI also has quite a colorful UI palette.

If you're looking for something minimal, but less "colors of the rainbow", I would look at alternative minimalism UI examples and take inspiration from those. Take a look at Mailchimp, Zendesk and Desk's UI. They are still minimal and very easy to understand.

So far your explanation for adopting the metro ui style is because you're users said they like it. They may like it for the Windows OS, but that doesn't mean you should copy it for your own app. It sounds like your users just want something simple and easier to understand.

share|improve this answer
add comment

Gradients Adding on to Linda's point, I would suggest use of a slight gradient to make each element a little softer than one bold color on top of another.

Visuals The Windows UI also makes use of bold white visuals to break up the monotony, which could help. Place a huge white icon in the middle of each of your buttons and add a small text on the bottom left corner with the description. Also, change up the sizes. The Windows UI does a good job of changing up the sizes so they all fit in together, but two elements next to each other are rarely the same sizes. They alternate between squares and rectangles.

Contrast The current contrast on the screen is making it a little bit of an eyesore. Use a colored background and overlay hues of the same color. i.e., instead of using red, blue, yellow, green use light blue, dark blue, purple, lighter purple, soft red etc. Colors that aren't totally opposite of each other on the color wheel tend to flow better when seen together.

share|improve this answer
2  
I thought with Metro, gradients were so "Yesterday" –  Mark0978 Aug 2 '13 at 20:13
    
@Mark0978 Yes and no. Overall, Windows modern UI wants to give off this look of solid colors. But they do in fact use shadows and lights to give that softer gradient-like appearance. For example, the mail button here: i1-news.softpedia-static.com/images/news2/… –  hidrees Aug 7 '13 at 19:51
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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