tools

diy tip: color matching by roel krabbendam

diy tip: color matching

photocopa.jpg

You've found an image that persuasively communicates your brand, and now you want to build a website around it.  Here's how you extract the color palette from that image so that you can build frames, backgrounds and text that matches (cut and paste the link into your browser after you read this):

http://www.colourlovers.com/photocopa

You'll have to sign up to the site in order to use the tool, but this involves no more than establishing a user name and password.  Once you're signed up, navigate to the "photocopa" page, click "photo" (just under "publish" at the top right), and type in the url of the image you want to use.  You instantly get a range of colors found in the image, expressed as small samples to the right on your screen.  Pick on various samples or on the image itself to create a palette at the bottom left.  Clicking a small icon at the top right of each palette swatch gives you the Hex, RGB and HSV codes.

If you ever wondered how graphic designers matched color, there's your answer.

tools: brand personality by roel krabbendam

tools: brand personality

jekyllhyde.jpg

Considering your brand personality, and taking charge of it, can be an important differentiating tool, especially if you deliver a common commodity or service.  In a large field of real estate agents for example, the WAY you deliver your service, and what you CONVEY about your service, may be the only distinction attracting customers to you.  Defining your brand personality, and then aligning everything that conveys your brand with this conception, is a powerful way to build brand recognition and loyalty.  We like this succinct explanation of brand personality (cut and paste into your browser):

http://www.slideshare.net/sjhus/brand-personality-presentation

Here is a list of dialectics to help you define your own brand personality:  Are you...
Humorous or Severe?
Expansive or Subtle?
Delicate or Strident?
Precise or Fluid?
Organized or Ad Hoc?
Machined or Handmade?
Neat or Messy?
Male or Female?
Progressive or Nostalgic?
Functional or Decorative?
Simple or Complex?
Geometric or Organic?
Plain or Fancy?
Trendy or Status Quo?
Youthful or Mature?
Ghandi or Sun Tzu?

You may ask yourself:
If you or your business were a plant, what plant would that be? Why?
If you or your business were an animal, what animal would that be? Why?
If you or your business were a car, what car would that be? Why?

Define your Brand Personality, and let it color your message and your collateral.

tools: typefaces by roel krabbendam

tools: typefaces

The vast, vast ocean of available typefaces may be daunting, so here is a rather nicely presented alternative: the periodic table of typefaces.  It covers the basic categories, offers representative fonts, and for those who see typeface selection as more of an impediment than an opportunity, may be just the tiny, tidy tidepool of options to move the decision-making along.

periodic_table_of_typefaces.jpg

department of appropriate attribution: cam wilde, squidspot.com

tools: color by roel krabbendam

tools: color

There is so much emotion and meaning invested in color and it is unquestionably a powerful component of brand identity.  As our case histories show, we often select color based on associations, not specifically on potential "meanings", yet those meanings are something to consider nonetheless and keep in mind in a selection.  The global color survey takes a stab at identifying those meanings, asking you for your color associations before showing you the results of their continuing inquiry (cut and paste into your browser to pay a visit):

gcs-icon.gif

www.colormatters.com/color-symbolism/global-color-survey

With only 20 or so colors and associations, the approach might be a bit reductionist, but on the possibly complex road to a color selection, not a bad place to start.

Another place to find meanings associated with color: Art Therapy

http://www.arttherapyblog.com/resources/color-meanings-symbolism-charts/#.UwutcvldV8H

Neat word clouds with footnotes for divergent international meanings distinguish this website.

color-meanings-symbolism-chart-blue.png

The Visual Voice approach relies as much on association as on emotion.  We ask for colors and images that speak to our clients to start, independent of context, but then rely on our own associations and creative thinking to generate options.  Sometimes an image or photograph will speak to us, and color becomes a byproduct of that selection rather than a focus in itself.

We always discuss both meaning and association in helping our clients choose among the options we present, but ultimately, here's what counts: is the brand identity appropriate, is it meaningful, is it visceral and evocative, and does the client feel empowered by it?

tools: typography by roel krabbendam

tools: typography

A resource for you do-it-yourselfers out there: Typedia.com

One of the decisions you make in creating an identity is what typeface to use.  This is one place you can go to learn what's out there, what makes up a font, how they are composed, how they are classified, who designs them and who produces them.

One approach is to hit "explore", view "by classification", choose a class like "sans serif", and view an encyclopedia of possibilities.  Bewildered by the vast array of possibilities? Start with this brief tutorial from Dan Mayer, who teaches this stuff (you'll need to copy and paste it into your browser):

http://www.smashingmagazine.com/2010/12/14/what-font-should-i-use-five-principles-for-choosing-and-using-typefaces/

One last thing to consider, if you are planning any digital communication at all: Apples and PCs are loaded with different typefaces, with very few overlaps.  When you consider mobile technology, there are even fewer.  Those overlaps are called websafe fonts, and they are the only fonts that will display exactly as designed on all web browsers.  If you care a lot about your design, stick to websafe fonts.  If you're flexible, at least include CSS code specifying font family alternatives and categories so that the basic intent of your design remains intact.

websafe fonts:

arial, comic sans, courier new, georgia, impact, palatino,
tahoma, times new roman, trebuchet ms, verdana