10 Rules of Color: Understand Limitations
Here we are. We have made it to the end. But it’s not the end is it? As a lover of color, you are encouraged to create your own rules and bend the ones you've mastered.
Rounding up our posts, here or the 10 rules of color that every designer should know:
3. Attract and hold attention.
4. Remember that context is everything.
5. Consider that experimentation is key.
6. Know that people see color differently.
7. Assist in mnemonic value.
8. Think about composition.
9. Use standardized color systems.
And finally, RULE 10: Understand limitations.
It has been said that necessity is the mother of invention, and naturally, that applies to graphic design as well. Sometimes budget constraints are a limiting factor that wears down and frustrates designers. Stretching design dollars does not mean that down and dirty must be ugly and ineffective. Effective color usage can provide impact and beauty on a limited budget. Financial concerns are not the only reason for limiting the number of colors specified; sometimes it is a question of aesthetics as well.
Using only a few colors, perhaps on colored stocks, can result in a rich-looking piece. Pushing the boundaries with limited resources often means pushing the limits of production technology or thinking of new ways to incorporate old manufacturing techniques and materials. Stretching design dollars means embracing and leveraging limitations. However, it is best to understand the client’s budget up front so designs can be formulated within it.
This is the program for the Tag Des Dutchmen Films in Tbilisi film festival. Budget constraints required that it be printed with two colors, cyan and black, on the back of the event poster. The program contains a schedule, film descriptions in two languages, and still images from each movie. Transparencies, pattern, and typography all work to produce a strong visual statement seemingly unhindered by budget. Andrea Tinnes
Print vs Screen. Colors can vary.
Delivery Media Affects Color
There is a vast difference between the way color works on coated versus uncoated paper stocks. It is important to design and prepare artwork correctly for the paper type being used in order for the specified colors to look their best. Uncoated stocks absorb more ink, so color tends to sink or flatten unless separations are made to compensate for this.
Halftone dots in color images tend to spread and deform on uncoated paper, a problem known as dot gain. Therefore, scanning and separations must compensate by opening the dots more so colors will appear to be at normal densities.
Coated stocks are made by casting the paper against highly polished, heated steel drums. The result is a harder surface that provides what is known as ink holdout, meaning that the color stays on the surface and is not absorbed into the paper. Both paper types have their own appeal, and colors will look great on each if the designs are properly prepared.
Color on screens—computer monitors or television sets—has its own limitations. The designers’ biggest challenge is their inability to control the end product; each screen’s calibrations and display properties are beyond the reach of standardized color specifications. For example, Macintosh and Windows operating systems use different platforms and protocols, and color can look very different in each.
Manufacturers work within a variety of technical parameters. Consumers can also make personal adjustments in image quality and color saturation. The result is that designers never really know whether their work is being viewed exactly as they intended it to or not.
Miracle Creations is a designer toy shop in Singapore that sells interesting collectibles sourced from around the world and manufactures its own unique handmade toys as well. A corporate identity package was created that incorporates a series of magical and fairy tale creatures illustrated as silhouettes. The stationery is all fi t on a large A2 sheet, separated by perforations that provide the design with an interestingly interactive twist. Only Rhodamine Red (in positive and reverse color formats) was used, in order to limit costs. The red is fun and stands out against the stark white, giving the piece a surreal feel because it is an unnatural color for the imagery used. Kinetic
The key to great color on paper is working closely with your printer both in preproduction and on press. The dimension of color is always a concern, especially if you like very saturated, vibrant colors like we do at AdamsMorioka. Here are some tips for great results:
• Tell your printer up front if you’ll be specifying coated or uncoated paper stock.
• Get samples of the paper. Ask for “commercial printed samples” because these are actual print jobs from designers like you, and you can see real-world results. If your printer has run this stock before, ask for these samples as well.
• Provide your printer with any production and technical information you may have from the paper manufacturer. They often have great guidelines.
• Make sure your scans and separations for uncoated stocks compensate for dot gain.
• Make sure to compensate for the color of the paper itself. For example, reduce yellows in scans of images to be used on a cream-colored stock to achieve an accurate reproduction.
• Let your printer know in advance if you’d like to use specialty inks such as soy based, metallics, or fluorescents.
• Request an “ink drawdown,” which is a sample of the ink you’ve chosen on your actual paper stock.
• Add fluorescent ink touch plates under large areas of four-color process to add vibrancy to image color on uncoated papers. Using UV inks will also add richness to colors on uncoated stock.
• On press, make sure your printer takes both a wet and dry ink-density reading. Because uncoated stocks take longer to dry, the variances could be dramatic. Make sure the printer records this if there is a possibility of future reruns on the job.
• Preparation saves time, money, and disappointment and is the key to getting great color on paper.
How We Perceive Color over Time: Aging is a natural human limitation. Color perceptions and preferences change with a person’s age. A study in Germany conducted by anthropologist Dr. Manuela Dittmar showed that age group differences in both males and females affected color preferences significantly. With advancing age, people’s preference for blue steadily decreased, while the popularity of green and red increased. The results suggest that color preferences can change over the course of the adult lifespan. These changes might be attributed to alterations in the ability to discriminate colors, the yellowing of the crystalline lens of the eye, and the decreased functionality of the retina’s blue cones.
SamataMason was the Creative Director for this Appleton Paper promotion, consisting of a series of small books created by different designers and contained in a black case. Each book interprets the same theme and utilizes the same black and red color palette. The directive of the series was to “offer meaningful thoughts and insights in a frenetic age of meaningless information and vapid graphic metaphors,” as described by one of the book designers, John Bielenberg. Subjects included numerous translations of jokes, poetry, showcases, a sociological study of designers, and a personal diary. It is interesting to see the variety of graphic results using the same set of color limitations. SamataMason, Creative Directors
Above are the Appleton Utopia books created by AdamsMorioka, Concrete, John Bielenberg, Michael Mabry, SamataMason, Howard Belk, and Stefan Sagmeister.
Using color on screens should carry this warning: WYSIPNWYG (What You See Is Probably Not What You’ll Get).
Color On Screen: Design for Web & TV
by Victor Bornia
If you are color-obsessed, bristling at anyone who mistakes your eggshell for white, you may need to ease up when it comes to designing for the screen.
Any use of color online—intended for viewing by the masses on personal computer screens—is far more of a hit-or-miss affair than color on paper. Once the design is online, it will be viewed on different platforms (Macintosh, Windows, etc.), each with their own gamma curves on different monitors (e.g., CRT, LCD), each set to brightness and contrast levels that no designer can control. That deep, lush burgundy you specified might be blown out to fire engine red, while that subtle pattern of darker hues you designed as a background may well end up a solid black. However, the disparities are not that ridiculous now that technology has advanced, and most people view websites in 24-bit color.
• Test your design on both Macintosh and Windows computers. See the resulting variances for yourself.
• Try simulating a variety of brightness and contrast levels to see how your design stands up.
• Understand graphics formats. The basic rule is that images composed of solid colors (type, icons, etc.) should use GIF; photos or complex images should use JPEG. Try both when exporting your graphics for the Web to see what works best— that is, creates the smallest files with the best-looking result.
Color and Broadcast Design
The problem with designing for broadcast is similar to taking your design to the computer screen (which is RGB) and preparing it for print (to CMYK). However, rather than go flat or dull, colors now explode. This is because the standard television color space for video in the United States is NTSC (National Television System Committee). PAL (Phase Alteration by Line) and SECAM (Systeme Electronique Couleur avec Memoire), in Europe and Asia, all use a different gamma curve for luminance than your computer monitor. For example, any dark or muddy areas in your design may well blossom into vivid detail when viewed on an NTSC monitor.
Video also uses a different color space (YUV instead of RGB) and is often subject to limitations on what can be recorded onto a particular format (e.g., videotape). As a result, what you see on your computer monitor will only get you so far in predicting what you will see on video. Only using an NTSC monitor allows you to see what the design will really look like. The good news is that most video software allows for a simple FireWire connection to an NTSC monitor, so you can keep tabs on the results as you design (you’ll need a FireWire NSTC breakout box as well). Also, most video graphics software (e.g., Adobe Aftereffects, Apple’s Final Cut Pro, etc.) have a built-in shortcut—a broadcast safe filter that attempts to automate the process of making your colors ready for television.
Basic Broadcast Design Tips
• Always view your work on a properly calibrated NTSC monitor. If that is not possible, use a television with a video-in jack. It will serve as a NTSC monitor and will be more accurate than viewing on your computer monitor.
• Do not trust built-in filters exclusively to go broadcast safe. Use your own eyes; sometimes desaturating an image works best. At other times, adjustments to the brightness or contrast will be required.
• Test designs in their final delivery format. Laying off to VHS affects images differently than MPEG-2 encoding required for DVD.
• Read books by Trish and Chris Meyer, especially Creating Motion Graphics. They provide excellent advice.
Victor Bornia made the transition from print to Web (producer for an online music magazine) to motion graphics (led workshops in Aftereffects for Adobe) to visual effects (member of the Emmy Award–winning team in 2001 for Star Trek: Voyager). He currently works as a 3-D animator in Los Angeles.
The Glant website takes advantage of the unique qualities of design for the web. Glant designs and manufactures fine textiles, primarily for use in interior design, in the United States and Europe. Built mostly in HTML, the site functions as an online catalog, so reproductions of product textures and colors are critical.
The use of a neutral gray background throughout the site creates a unified feeling and allows the photos of the Glant products to stand out on screen. Methodologie
Motion Theory and Weiden + Kennedy/Tokyo collaborated to merge graffiti, an urban art form, and sophisticated motion graphics to promote Nike Presto to a Pan-Asian market. Colorful graffiti paintings literally come off the wall in animated television commercials. Graphics are intercut with Tokyo and Shanghai street scenes set to the music of Japanese DJ Uppercut, all toward the goal of capturing the spirit of art, music, and culture of contemporary Asia. Wieden + Kennedy/Tokyo Motion Theory
There is a ridiculous wealth of knowledge in this book. So, don't stop here. Pick up a copy today and get working on your color designs!