Tag Info

Hot answers tagged

35

First things first, this is what it looks like to color blind (deuteranopia; by the most common form of colorblindness) users: (also the zebrastripes are almost impossible to see, colorblind or not) Red on green is a classically bad color combo, though your magenta text isn't entirely unreadable. The background color is very loud though which can be hard ...


34

The following screenshot is taken from the speech by Jon Wiley at UXweek 2011 (Original video). He explains the design decisions made by google in the past months. Look towards the end (after minute 27) of the video to see it by yourself: red is for "create something" green is for "share something" blue is for "do something" (e.g. submit a form) Keep ...


17

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 ...


10

Yes, the colors may not be good for some. The screen is very organized, but I would suggest a better color theme. Not a drastic one, but I would make the background color much lighter than it is, as it is too loud. It seem to draw my attention passed the content. Also red, is not the best default choice for font, as most website use that for errors, and ...


10

I dont think you will get a definite answer to this since the colors you choose will have to mesh well with your game design and background. However I would recommend making the choices prominent and if possible use pictorial representations to show what each level might be. here is a good example : Alternatively you could go with a color scheme which ...


10

There are many studies about colour, but what is important is to use bright colours for the things that require action. We associate actions with the traffic lights. Green go, yellow check if you have time and red stop. Your actions are: Open - Go, so definitely green To be confirmed - Requires check - definitely yellow Postponed- Requires a bright ...


8

The background you choose for your website has the power to set the theme and set the mood for your site at a glance. But the main aim of the background should be to enhance the visual experience and not to distract the user too much from the content. Analysis: The image with grey background has more depth and there is a sense that the content area is to ...


8

Searching on the web for this I came up with this article. Quoting from an "Applied Colour Psychology Specialist": Colour Psychology Blue is the colour of the intellect, the mind, making it the colour of communication and when you think about social media, it’s all about communicating. Blue also has the perception as being trustworthy, dependable, safe ...


8

Red text on a green background never works very well, which is counter-intuitive because red and green are opposite on the color wheel, so one would think that the contrast would be great. Unfortunately, it doesn't really work that way, and it creates a kind of micro-haloing effect when your mind tries to sort out the difference. The green background looks ...


8

European ski slopes also have black. Mountain bike trails are also green, blue, red and black. Since this project is for younger ages, I'd skip the black. Such sporting activities as skiing, biking and others also make use of shapes to further differentiate, rather than using colours alone - thus appealing (or not) to the subconscious. So for example a ...


8

The best practice here is to display the social media icons in a neutral color, usually grey. This approach is both widely practiced and accepted. It's worth noting that most of the major social media brands have usage guidelines that explicitly prohibit the above. For example, Facebook's Brand permission center lists the specific brand assets that are ...


8

CheckMyColours.com uses the Web Content Accessibility Guidelines (WCAG 2.0) contrast tests. The validity of the tests is something to bring up with WCAG rather than checkmycolours.com. I am unaware of the WCAG providing the research supporting their contrast ratio standards. However, my experience with those standards is that they are fairly lax. I've ...


8

I've realised after writing this answer that @Brendon suggested the same in the comments - so I'm happy for any answer of his to take precendence. You want Colorbrewer, its the most awesome set of visually distinguishable colours. Given the parameters you've suggested (7 sequential colours) you want something similar to this pallette. With my client I just ...


7

I think you can get 5 distinctive enough colors that can impart the necessary notion of sequence or magnitude (lighter to darker): It's a matter of mixing the colors in the Hue/Saturation/Brightness (HSB) color model using simple arithmetic. In the above example the top color (in HSB color model) is hue:60 saturation: 25% brightness: 100%. Each ...


7

While a good color scheme will help the key thing to note here is contrast for enhanced readability. To quote this article from eyemagzine Light grey text on a white background and small text size both lead to an increased orbicularis oculi activity and decreased blinking. These two conditions are related to text quality, and we would expect to ...


6

The Colour Contrast Check is a great resource to test whether or not your colors are compliant with various standards. After checking your colors here, it seems like your design is only partway compliant. That aside, the green is rather bold and aggressive for a background. Depending on your target market this may work if it is somewhat of a niche market. ...


6

Both "register" and "Sign up" are bland and should be avoided in an actual call to action. Sign up is generally not preferred as it can be confused with "sign in". Note that "register" is still fine for a secondary command like when you're at a login screen and you don't have a login; register is the obvious thing to look for, so don't break those ...


6

Can't think of any. It's probably aesthetics. Recently I've been split-testing top-bars of large eCommerce website. The reason was changes made due to visual aesthetics Results: top of the top bar wasn't making any statistically significant difference in conversion (cpc business model, large sample - more than 0,5 mln people), no matther if it was pale or ...


6

This is both hard to read and aesthetically off putting. To qualify myself, I'm the owner of emeraldcode.com and kitgui.com and you can see UI design choices there. Note that my design choices are just that. I chose them, I didn't build them. I know that I personally suck at implementing design just like I know I should not go out to American Idol and ...


6

Personal opinion: The font size is a bit small The serif font isn't the best for readability Not sure about the colour contrast of some of the selected states/hover of the menu options Centrally justified text isn't great for readability either Just checked the green text for colour contrast and it seems to pass WCAG AA guidelines


6

I feel your pain on this one. I like to refer to Adobe's Kuler for some good ideas on color palettes/complementary colors. Also, PatternTap has a huge gallery of navigation elements, although if you're just looking for new colors it might be a bit much to sift through. I think the principle to follow here above all else is simple: make sure there's enough ...


6

I know of no good evidence that certain sexes intrinsically respond 'better' to certain colours. Modern gendered coloured schemes are pretty recent - back in the 19th century, pink was a boy's colour, for instance (because it's red-ish, and the thinking was that red = virile). What you can do, however, is use colours that match the typical branding of the ...


6

My suggestion is not to do this. Hue doesn't have an inherent order (ROYGBIV is surprisingly non-intuitive especially when you have to compare across the rainbow). "Is teal before or after forest green?" And individual colors communicate entirely the wrong meaning: e.g., when the project is 'red' does that mean it's behind? or in trouble? or blocked? Not ...


6

Red and Green are standard colors for errors and success and exist there irrespective of what color-scheme a site/application has. But in case you are barred not to use them, you can still live without them but your designer would need to put extra bit of effort to extract "meaningful" colors for SUCCESS and ERRORS from the given color pallet. Something like ...


6

This seems more of a graphic design question. That is, it seems you know you want green for authorization but need to know what shade of green (the graphic design bit). You can use a green that fits into your colour palette better. Say you took the pale blue and used the same lightness and saturation but changed only the hue to a green, you'd get something ...


6

You should not rely on color to differentiate between items in the chart. While it's mostly fine if you have only a handful of items, differences between one shade of green and another are really hard to see. Especially if you need to relate a bar in the graph to a color in the legend over at the other end of the screen, it quickly becomes really hard to be ...


6

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 ...


6

Hyperlinks should be distinctive from other types of text in a page. If your normal text is black then hyper link color should be different. According to Nielsen "The color for unvisited links should be more vivid, bright, and saturated than the color for visited links, which should look "used" (dull and washed out). " be consistent whatever color you ...


6

I'm not sure you can achieve this with any specific set of colours - because there are a wide range of different ailments grouped under the term "colour blind". No single scale that is based solely on hue is going to suit everyone - make sure you have variations in brightness as a minimum, and I'd recommend texture as well. Here's a mockup, based on your ...


5

I think as @agib said, it anchors the top of the page, but I wonder whether it is also serving to create a visual separation from the toolbars and stuff at the top of browsers - it indicates that the page stuff starts here. On the sort of minimalist pages that you link to, this might be sigificant - on SE sites, there is a top header bar in a distinctive ...



Only top voted, non community-wiki answers of a minimum length are eligible