Como Elegir El Color Perfecto

Before&After

BAmagazine.com

®

i UX

How to find the

perfect
color

Getting that just-right
color is part art, part science.
We’ll show you. Continued
Continued 

Perfect color

0453

Before&After

BAmagazine.com

®

i UX

How to find the perfect color

Hidden in your photo is the color palette you need. Here’s how to get it out.

No single visual elementhas
more effect on a viewer than
color. Color gets attention,
sets a mood, sends a message.
But what colors are the right
ones? The key is that color is
relational. Colors don’t exist in
a vacuum but are always seen
with other colors. Because of
this, you can design a colorcoordinated document based
on the colors in any element
on the page. Here’s how.

Here’s the situation: We have
anacademic schedule for a
women’s college to design,
and for a photo we have this
no-nonsense, freckle-faced
model. The goal is to look
fresh, alive and personal (no
buildings and grounds shots)
while conveying the sense
that the program is serious
and businesslike. A note
of trendiness will be good.
Color is involved in all of it.

 2 of 16 

Perfect color

0453

Before&After®

Perfect color

BAmagazine.com

3 of 16

i UX

Look close, closer, closest

Every photo has a natural color palette. First step is to find it and organize it. Zoom
in on your photo, and you’ll be astonished by how many colors you see.

At normal viewing distance
(left) we see a few dozen
colors: skin tones, red hair,
blue eyes, blue jacket, but
zoom closer, and we seemillions! First step is to reduce all
those colors to a manageable
few; you want 16, 32, 64 tops.
In Photoshop, first duplicate
the photo layer (so you don’t
lose the original), then select
Filter> Pixelate> Mosaic (right).
A large Cell Size gives you very
few colors; if you need more,
reduce the size.

 3 of 16 

Perfect color

0453

Before&After

Perfect color

®BAmagazine.com

4 of 16

i UX

Pull out the colors

Now extract colors with the eyedropper tool. Work from the biggest color (the one you see
most of) to the smallest. For contrast, pick up dark, medium and light pixels of each.

Work first on the big colors. These are the
ones you see at a glance; her skin and hair
colors and blue jacket. Then do the small
colors—her eyes, lips, thehighlights in
her hair and soft shadows. You can see in
this image a light side and a shadow side;
it’s subtle, but pay attention. Finish each
area before moving on. Sort your results
by color, then each color by value (light to
dark). Discard lookalikes. You’ll be thrilled
by what you find.

Light side

Hair

Face

Shadow side

Hair
Jacket

 4 of 16 

Perfect color

0453Before&After

®

Perfect color

5 of 16

BAmagazine.com

i UX

Try each one on

Place the photo on a swatch of each color. The results are pretty, aren’t they? What’s fun
is that this will always look good, because the colors you’re using are already there.

Warm colors
These are the warm colors—
pinks, salmons, sepias,
browns—of the red-haired
model. The warmer colors
make herlook softer and
more feminine. These colors
would be good for a cosmetic message or a caring
message.

Cool colors
The cool colors—blues,
mainly—make for a more
serious, businesslike relationship and convey a direct,
to-the-point message. Note
that as the values get darker,
her face gets perceptually
brighter and appears to rise
off the page toward you.

 5 of 16 

Perfect color0453

Before&After

®

Perfect color

6 of 16

BAmagazine.com

i UX

Add to the colors

The next step is to add more colors. Select any of the colors, and locate it on the color wheel.
The purpose of a color wheel is to show you a color’s relationship to other colors.

Pick any of the photo’s colors—
let’s use this blue—and find its
general vicinity* on the color...