Design for Art or Clarity?

When creating images for digital or print, an important distinction must be made regarding our reasons for creating the image in the first place. A painter or photographer might create art for personal or artistic expression alone. But if you are creating images to communicate a message, market a product, or promote an action, then whatever distracts or confuses from your message or purpose should be avoided. The whole basis of this Information Design blog is to help us to understand the distinctions needed for using the abundantly available technologies of digital creation. A typical user of creative apps and software is not automatically prepared for user- or audience-centeredness just by learning the technology of making an image. Too often, the images created by novices appeal to the designer’s (or a similar someone’s) taste, preferences, or biases, rather than to what is meaningful to the audience. Unless the creator is the sole audience for it, an image needs to have accessibility, in other words, user-centeredness, at its core.

In this ID blog, I have already touched on purpose, audience, and clarity of message several times. Those posts are good reminders that the ever more easily accessed software tools and apps for creating and editing images for our everyday and business use must be seen in terms of who the image is for, what are we trying to communicate, and will the message get through the image.

Too often, we get distracted and start asking ourselves or our friends how we like a color, shape, placement, or font, without thinking about what an intended user will think about it or how it will look to them. Sometimes we don’t even ask, “Who is my audience?” or “Why am I making this?”

To illustrate this point: take color-blindness.

How do we design for color blind users?

There are several different kinds of †color blindness, but the most common ones relate to how the viewer sees red and green. *There are about 330 million men in the world (12%) and almost 20 million women (0.5%) with color blindness. How often do we think about how well this fairly large demographic sees our images?

It is fairly simple to check our images to see how they will look to people with color blindness. A number of browser apps allow you to upload your image to check how it would appear to a person with one of the several types. Any image saved to a JPG or PNG can be uploaded §for free to check that the image is clear or at least acceptably close to how you hoped it would look. Perhaps upon checking, some color changes might improve the image for the color blind without requiring a complete design makeover. Making those changes might make a big difference to the appearance of your image for the user. You’re unlikely to completely avoid every issue, since several types of color blindness seem to have almost the opposite visual effect from others. However, giving it a try to be sure that your font color, for example, has the proper contrast to a background color will make a big difference if you want someone to read your action button and buy your product.

Another accessibility issue to consider, and here color blindness can also provide a good example, is that before you even choose the colors for your image or brand, you should see how those colors look to people with color blindness. I have used the great free app, Coolers.co, to select brand colors and colors for images. This wonderful app allows you to generate whole color palettes with the Hex code and other numerical identifiers, and to export the palette image for your use. I would encourage anyone to run their palette through the Coolers’ colorblindness viewer, which can be found at the top menu once you have created a palette (i.e., the colorblindness viewer is found by clicking the icon that looks like a pair of glasses, see Figure 1), from there, you will be able to view the colors from various color blindness types.

Figure 1: With Coolors.co see your brand palette through the eyes of those with color blindness.

For example, one might create a call-to-action button using two brand colors. The color distinctiveness required for the user to read what action was requested might be obscured for a person who is color blind so that they are unable to take the action you are hoping to encourage. The text might be readable, but the colors might be “yucky looking” for your user and discourage them from your site. As you can see from the following pictures (Figure 2) from the Healthline blog, what seems like a nice colorful set of surfboards will appear very differently to a colorblind eye.

Figure 2: Normal vs protanopia (If you have protanopia, you’re “red-blind,” which makes red colors look greener.)

It is unlikely that you can create images perfectly viewable to every user, particularly with color blindness. Too often, though, image creators don’t do any research about this issue and only design for their own tastes and preferences—yes, their own biases—which makes their image designs fall short of the mark when it comes to good design and user-centeredness. Artful design might please one’s own sense of artiness, but will not necessarily reach the audience for your intended message.


* According to the World population statistics of male and female, https://countrymeters.info/en/World

† See also the very detailed article on Color blindedness on Wikipedia, https://en.wikipedia.org/wiki/Color_blindness

§ Here is one such browser app where you can check how your image appears for various types of color blindness. Or, Google, “How can I tell how my image looks to the color blind?” to find more options.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s