Hot answers tagged

114

I am thinking of designing a website that will have no color other than black, gray, and white. May I ask what the rationale is behind this decision? The reason I ask is because I don't think a pure B/G/W is suitable for most commercial designs, unless client's branding fits that scheme. So before you decide to go with this route, make sure your ...


106

With your examples of Curtains, I would go with Black and White. Easy psychology and Cosmetic. Black: If it's too bright in the day, you'll happen to easily see the Black beads/string and it also means pulling it down will darken the room. White: If it's getting too dark, White will be easier to notice and will signify that pulling it will lighten the ...


96

There is no problem to work as a UX/UI designer, as choosing color is just a minor part of the usability process. There are lots of other activities that the UX-er should do, like usability testing, checking analytics, conducting A/B tests, writing reports. Choosing color is more like visual designers work. People often are confused between the two ...


79

It hurts the eyes Certain colors and color relationships can be eye irritants, cause headaches, and wreak havoc with human vision. Yellow, pure bright lemon yellow is the most fatiguing color. Why? The answer comes from the physics of light and optics. More light is reflected by bright colors, resulting in excessive stimulation of the eyes. ...


71

I'd go with a color that'll always retain stark contrast. I'd also avoid venturing too far outside of the styles that that users are generally familiar with. Because you're working in an atypical style, if you deviate and use unfamiliar elements you may risk confusing a percentage of your users. Here's what i think i'd recommend.


70

There has been a lot of research on this topic since the 1980s and a lot of it still holds true today. One study from the 1980s states this: However, most studies have shown that dark characters on a light background are superior to light characters on a dark background (when the refresh rate is fairly high). For example, Bauer and Cavonius (1980) found ...


69

I'm not exactly sure how your app works, but from what I understood, I would use a color like grey for the OFF buttons and a brighter color (the primary color of the application perhaps) for the ON buttons to avoid your problem. Also I'd make use of icons to serve as an indication for Hot/Cold.


67

High contrast such as black on white can cause eye strain. Also there is evidence that it is particularly bad for people with dyslexia. For further info read articles at UX Movement and The Bristol Dyslexia Centre. WCAG provide details on what is acceptable colour contrast, but dont state an upper limit. Personally, I like to use a different algorithm that ...


65

Just a guess: If they used black (minimum intensity for all three color channels) or white (maximum intensity for all color channels) you might think they are off, so instead they use only one of their base color channels (out of Red Green Blue). Red light may remind some people of an alarm and others of a district in Amsterdam. Green may seem like ...


62

I would go with something in the shade of the background, but have a more red text in the alert. You can add a border in the shade of the text to make it stand out as an error more, as well.


54

I've been doing front-end work for a decade, and I have deuteranopia or deuteranomaly (red-green color blindness). It has never been a problem. I largely rely on color codes and location/proximity on color picker UIs to identify colors. When doing a design from scratch, I will often look at pre-existing palettes for inspiration. I will also use an ...


52

Red can be used for ON, most sockets use this color when they are on : I would recommend BRIGHT RED for ON and DARK BLUE for OFF. The brightness difference between the bright red and dark blue will also indicate ON/OFF. Also use round shape because it resembles more with LED lights, used for power ON/OFF in many devices.


51

Beyond just suggesting places like Adobe Kuler, ColourLovers, Color Scheme Designer, ColorMatch5K ColorJack, and ColorStream (iPhone app), you may benefit from learning about color theory and why and how colors should be combined and chosen. Here are some useful resources: Worqx's Color Tutorials Basic Color Theory Smashing Magazine's 3-part series on ...


51

Darker color scheme are often used effectively in software that focuses heavily on visual content. For example Adobe Lightroom, Adobe After Effects, Microsoft Expression Blend, and Kaxaml are interfaces that have a dark color theme. This allows the interface to fade into the background and let the content come alive Why is it not widely used? I guess it ...


48

There is a better solution, at least in terms of legibility, perhaps not so much aesthetically. And I'm 99% sure you've already seen it. Black border, white letters. White letters are almost always brighter than the background, and the black outlines act as a sort of shadow, separating the text from the background. Of course, the best legibility is ...


44

Do not use colors to indicate that the system is ON or OFF, use instead a linguistic code, while use an iconic code to comunicate the HOT/COLD state. Here I used a thermometer with different colors (i did not use the snowflake icon since it communicates more a sense of active cooling -like a freezer-, rather than a passive dispersion of heat -like some ...


43

A bright yellow background with black text would work well. Fits the colour scheme of a warning sign.


41

Just because your brand color is red doesn't make the use of red for errors obsolete, it's just a matter of extent. Take the Viaplay signup form for example: Viaplay has red as their main accent color, which is used throughout the website for actions buttons, icons, header, graphic elements etc.. however, in the form they do tone down the use. They ...


41

Any sentence or fragment which is styled should apply the same style to its punctuation. In this case, the exclamation mark is part of the sentence being styled, so it should carry the same style as any alphabetic characters or punctuation within the sentence: The brown fox (trailing the chicken's feathers) jumped over the hill! A contrasting situation ...


38

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


38

Is it true? No. Nor is it true that it's good UX. It's a visual design question that can only really be properly answered in context...and part of that would be how it works with the overall page design. In the particular context of the cited question... ...it is asking very specifically about Red on Pink That's a very specific combination and ...


36

Dark on light vs light on dark themes can have multiple affects, such as: Bringing attention to an application vs bringing attention to the application's contents People focus on brighter areas - darker background brings attention to the content, while lighter background bring attention to the window itself vs the desktop. Imagine if the box around ...


36

In and of themselves the colors are fine; I think it's the particular combination of colors that you are using. The red rgb(192, 55, 47) is at 46% luminance, and your eyes will adjust to that accordingly; but the white text is 100% luminance, which requires your eyes to adjust slightly. On bright enough monitors, it can actually be kind of jarring, although ...


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

I think the blue goes back to the days of consumer-grade video cassette recorders with on-screen message displays. Superimposing an image on a video signal requires that one know which parts of the signal will be displayed where on the screen. If the video signal includes valid horizontal and vertical sync pulses, one can measure the time since the last ...


33

Legibility depends on high contrast between foreground and background, so black-and-white is the safest bet. See for example: Hall RH & Hanna H 2003. The Impact of Web Page Text-Background Color Combinations on Readability, Retention, Aesthetics, and Behavioral Intention, Laboratory for Information Technology Evaluation, Technical Report ...


33

Rather than the other answers that just express personal opinions let me direct you to this article that in turn cites some actual research which I will quote here as well: However, most studies have shown that dark characters on a light background are superior to light characters on a dark background (when the refresh rate is fairly high). For example, ...


30

Issues You are right about the use of color. Users are unlikely to remember what it means if you have 8 states. It also creates problems for color blind users. Using a legend is not great because it forces the eye to dart around the screen. It also doesn't solve the color blind issue. 300 items will be difficult to navigate, so careful cell design ...


30

A good example to consider would be the ibooks app in iOS which allows users to enable the dark theme automatically depending on the light sensor detection. However as PS86 rightly pointed out, dont build this automatically into the system but enable the user to set as a desired parameter. To quote this article, the ibook app enables this by an option ...


26

This disparity is likely due to a variety of factors: It's not clear exactly how many colors humans can see. For example, the table at the top of this page about the number of colors distinguishable by the human eye cites various academic papers as saying anything from "more than 100,000" to "roughly 10 million." In any case, the number of colors visible ...



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