Color
Palettes and how to use them
Choosing the correct color for your touch panel layout is
very important. Most of us are not color experts so here we'll
discuss some very basic color theory and tools that you already
have in your tool box.
Most touch panels on the market today support millions of
colors but we are not going to need all of them. To make color
selection even easier, most software breaks this palette down
to 48 colors. To ensure that you keep your design consistent
across all of your screen, it is advisable to design your
color palette before you begin any work on the panel. Before
we discuss how to design a color palette, we first have to
discuss how color works and how people perceive it.
Color
- How does it work?
Okay, let's keep this easy... For our purposes we will discuss
two types of color. Cool colors and warm colors. Cool colors
tend to recede into the background of an image while warm colors
move to the foreground. Do you see where I am going with this?
Your background images, button face colors or anything that
is considered background should be a cool color. Anything you
want to stand out should be a warm color.
Typically
cool colors are in the blue range of the spectrum but it is
possible to have cool colors though the color spectrum - if
you mix a cool with a warm color.
Warm color are at the other end of the spectrum in the red area.
|
|
|
|
Cool colors recede
into the background while warm colors move forward
|
Color Palettes
What is a color palette? A color palette is simply a collection
of colors. In the case of your touch panel design, your base
color palette will probably be limited to 3 or 4 color. The
fewer the colors in your color palette, the easier it will be
for you to use in the design process and your users to use when
they are interacting with the touch panel.
Choose
a cool background for the screens
The
coolness of your button face colors depends on how many colors
or layers of color that you are using in your design.
Choose
a warm color for foreground elements like button faces in simple
color palette designs.
How to create a Color Palette
This is going to be far easier than you think! You have already
used the color picker tool when you previously designed your
layouts. Your design software comes pre-built to help you design
a great color palette.
|
|
|
|
Two Typical Color
Palettes
|
The principle in color palette design is the same for both
types of palette examples above. To create a palette of harmonious
colors (colors that "go together"):
Start
by selecting a color from anywhere on the outside of the grid.
I like to start coolest to warmest in color so I would normally
start in the blue colors.
Next,
simply select colors along a direct line either horizontally
or diagonally in the palette on the left or vertically or
horizontally for the palette on the right above.
Do
not sway from the line or you will not have a harmonious color
palette.
Continue
selecting as many color along this line until you have the
number that you need.
How to use a Color Palette
Using your color palette will become second nature after a
short time. Remember to layer your touch panel design with
the coolest colors in the background and the warmest colors
in the foreground. Select one color to start with and use
your design software's color palette as a guide to keep you
on track using only the harmonious colors.
Next we will discuss the importance of text and fonts.
|