Colour Bliend

Download as docx, pdf, or txt
Download as docx, pdf, or txt
You are on page 1of 8

Color blindness is the common term for a condition where

individuals often mistake shades or lose their ability to distinguish


colors at all. Women are less likely to have this disease, when
approximately every twelfth man is prone to it.

There are several theories of color perception and we are going to


consider the most popular one. According to it, the human retina
has three special cells called cones. Every cone is responsible for one
part of the color spectrum: red, green and blue. Cones react to light
and forward information about its environment to the brain. There,
all data is received and added together to produce the colors we see;
just like in the RGB color model! Only humans have a wider
coverage of colors than any existing standard of this model. Humans
aren’t actually unequivocal in terms of color; we don’t share the
exact same color vision experience. Because the human eye and
brain work together translate light into color, each of us see
colors differently. Your blue can be slightly more blue than someone
else’s. However, sometimes differences in color vision are tragic.

Defects of the cones lead to worsening of the color vision. Depending


on the seriousness of the defects, a human can mistake shades or
lose ability to distinguish colors at all. For the majority of people, the
disease is genetic. The most common types of color blindness are
due to the loss or limited function of red or green cone
photopigments. This type of color blindness is commonly referred to
as red-green color blindness. For example, in people with
deuteranopia, there are no working green cone cells, which means
that they are unable to see not only green but also the constituent
colors with it. The same is with protanopia, but in this case, the
individual has no working red cone cells. Blue-yellow color
blindness is rarer than red-green, and an even rarer type of color
blindness is called monochromacy (or complete color blindness).
Monochromatic people don’t experience colors at all, they
distinguish colors only by brightness. In other words, they see the
whole world in black and white. But why is it so important for user
interface designers?

You’re not color blind, but you still


need to consider a color blind
audience
As a normally sighted person, it’s hard to imagine what your work is
going to look like to a color blind eye. And yet, this can make a
tremendous impact.

Websites are a major concern because it’s crucial that they are legible
and easy to navigate for all users. This image underscores the
difference between a color blind-unfriendly hover, and a color blind-
friendly one:
The top highlight, which is similar in tone to the normal button, is
worst for a color blind audience; the middle is better, as it takes
advantage of differences in brightness; the bottom is best, as it also
adds a non-color component: a highlighted border

You can’t trust colors

Color isn’t omnipotent, you shouldn’t expect that it can solve all of
your problems alone. But with a proper base color is able to beautify
UI and improve UX.

Statistically speaking most people with a moderate form of


red/green color blindness will only be able
to identify accurately 5 or so colored pencils from a standard
box of 24 pencil crayons.

Any color designation can be supplemented with a caption or an


icon so that the object preserves its function no matter what
happens with colors. For example, because protanopia leads to an
inability to see red color, it becomes difficult to correct form if
designer uses only red to indicate mistakes. A better solution is to
supplement color with a caption or an icon.

In addition to color,  Square  uses an icon to point out mistakes

Sometimes it’s a good idea to add patterns and textures to


emphasize contrast between objects.
In  Messapps, we added dashed lines to pie chart in Vola app

Developers tend to make colorblind modes in the settings for that;


that’s how Trello, Two Dots and others do it.
iOS  Two Dots  regular and colorblind mode

Of course, every pattern and texture bring a lot of noise, so it’s better
to avoid them. Slack, for example, offers users special accessible
themes that change all colors of the user interface.

In  Slack, you can choose one of the preset accessible themes

Care about all

The development of an accessible user interface doesn’t require a lot


of additional time, and the final product will be easy to use for both
categories of people: colorblind people and people without any
visual impairment.

In order to avoid color blindness pitfalls, here are a few handy rules
and approaches to consider:
 Avoidthe following color combinations, which are
especially hard on color blind people: Green & Red; Green
& Brown; Blue & Purple; Green & Blue; Light Green & Yellow;
Blue & Grey; Green & Grey; Green & Black
 Make it monochrome: Using various shades of a single color
instead of multiple colors is of course the most surefire way to
avoid color blindness issues. Today minimalism is all the rage,
isn’t it?
 Use high contrast: Color blind people can still perceive
contrast, as well as differences in hue, saturation and
brightness. Use these to your advantage (Hint: many color
blind individuals report being able to better distinguish between
bright colors rather than dim ones, which tend to blur into one
another)
 Usethicker lines: Some mildly color blind people are able to
see a color, but only if there’s a sufficient “mass” of it. If a line
of color is too thin, it won’t show up as the right color.
 Don’tassume colors will signal emotions in and of
themselves: If you’re using red to signal “bad,” “warning,” or
“watch out,” consider adding another symbolic element to get
the point across to color blind viewers.
 Use texture instead: in maps and infographics, try using texture
in addition to color to differentiate between objects.
Texture, in addition to tone, helps a color blind audience read
something like an infographic.

Additionally, there are tons of resources that give you feedback about
your color choices. Some of them even provide simulations of what
your design would look like to a color blind eye! Check these out:

 Colorblind Web Page Filter: type in a URL, select a type of color


blindness, and their filter will show you what the web page
looks like to someone with that issue
 Vischeck: applied to files or web pages, it can either simulate
color blind vision or try to correct images for color blind viewers
 Newman services: another color blind simulation product
 Color
Laboratory: allows you to see how selected colors will
appear next to one another, in various foreground/background
combinations and to color blind viewers
 ColorOracle: more color blindness simulation for Window, Mac
and Linux
 Sim Daltonism: a color blindness simulator for Mac only
 Color
contrast visualizer: helps you choose good color
combinations in general

You might also like