Posts Tagged ‘colour theory’
Rueminations: Homegrown, 3416 Fremont Ave N, Seattle, WA
Tuesday, March 16th, 2010Rue – a street or road (French). Rumination – to meditate or muse; ponder. Rueminations – to dissect, analyze, inspect or appreciate design found on the streets.
I’m hoping that many of you are familiar with The Sartorialist, what might be considered the standard as far as street fashion/photography/journalism is concerned in the blog-age. There are many others, mostly based on location like Japan, Korea or Toronto. There’s even Street Peeper. Rueminations, you could say, is similar. Instead of keeping an eye on fashion, however, I’ll be keeping my eye on signage, billboards, storefronts and the back of cars, looking for great typography, color and overall aesthetically pleasing graphic design. It’s something as a designer I do anyway (I’ve gotten separated from friends many times as I stop to ponder a company logo), it will be a good resource for aspiring designer as well as old, and I feel that companies with good design (and their designers) deserve some love.
First up is a sandwich shop in the Fremont neighborhood, Homegrown. Beyond being a pretty darn good sandwich shop (the Bluffernutter blows my mind), it has a brand and logo combination that easily trumps everything else in the wannabe trendy Fremont neighborhood.
photo credit: Rachel: Photo Diary, http://www.rachelphotodiary.com/ used without permission.
A simple, clean typographic treatment (of which is unmistakably Garamond) with a single artistic mark fashioned out of the letterform of the ‘g’ which makes an easily distinguished rooted vegetable.
The Garamond typeface which is kerned slightly tighter than normal helps give an upscale and rich atmosphere. With the tradition of Garamond, it also speaks to a rich heritage of craftsmanship as if to say this store is handcrafted, artisanal, which it is.
On top of that, the rooted vegetable screams organic, which again, the sandwiches are, and are crafted to appeal to those who shop at places like Trader Joe’s, PCC or Whole Foods and want healthy, homegrown, organic alternatives for their lunch break.
That makes the name itself genius as, instead of trying to hint at what a place is or does, it comes right out and says it: Homegrown.
It’s a bit tough to tell with the signage lit up, but Homegrown also employs a simple two, three color scheme for their brand. Their signage in daylight is simple white on what looks to be maybe a 60-70% black.
photo credit: Fremont Universe, http://www.fremontuniverse.com/ photo used without permission.
The rest of their branded materials – including their website – deploy the logo in a solid black on a background that looks like scanner paper sacks. This speaks to the concept of “unfooled around with.” The logo is simple, presented with simple colors. The logo itself is a work of art, made of simple, uncluttered elements…exactly like the sandwiches in the shop.
I don’t know who designed the logo/identity/brand – I’m still trying to pin that down – but I gotta say, this is absolutely a hit. They should definitely be proud.
UPDATE:
(4/8/10) I was recently contacted by the graphic designer behind Homegrown! His name is Dax Borges and the logo was designed and developed by him and the co-owner of Homegrown, Ben Friedman. So, there you go, big props go out to them.
This is what Dax had to say:
Hi Mike,
My friend and co-owner of Homegrown (Ben Friedman) just sent me the link to your Homegrown signage article… Can’t tell you how much I appreciate the kind words. Ben and I worked long and hard on that logo. I’m the graphic designer but Ben played a major roll in refinement and overall branding. It would only be half what it is without us working together.Either way your observation of our hard work is awesome and speaks a lot to your own design and brand sense.
Thanks again for the writeup!
Of course, Dax has a website, and I’d be remiss if I didn’t pass the link along:
Credits:
Original articles from which the images were taken can be found below:
http://www.fremontuniverse.com/2009/03/31/homegrown-sandwich-shop-off-to-good-start/
http://www.rachelphotodiary.com/2009/03/20/homegrown-fremont-seattle-coming-soon/
CASE STUDY: Capture Press Identity
Monday, March 8th, 2010
Capture Press aimed to be an internet and print-on-demand publishing platform. They wanted eschew the traditional relationship that writers have with their publishers, which is to say, there isn’t one. When there is, it’s the publisher wanting something from the writer, wanting it now, and without any say in it from the writer. This was different, all the power and 100% of the proceeds from published materials were meant to go to the writers. The website would pay for itself hosting free content to bring in traffic, as well as hosting a strong community for the writers to meet and benefit from each other.
Before any of that could happen, however, the client needed not only a brand/identity, but a concept and a name. That’s where Razterized and I came in. The client was familiar with me as a writer first, and realised that I’d best be able to identify with their needs and execute their goals when it came to design related elements.
The first step was to address the client name.
Naming Capture Press
The client and I had talked at length about the goals of this venture, and the attitude it should carry. It was meant to be revolutionary publishing, “giving the power back to the serfdom” in the writer-publisher relationship. It was meant to be publishing for a new age. The mind immediately ventures toward thoughts of great societal constructs being crippled under a revolution. The fall of any great government. The burning of Rome. There’s a danger in using something like that for a company name, though. It might lead customers to believe it’s a choice based on genre, not mission. The only things we could come up with that were even slightly decent along this path were “Grey Culture Publishing,” “The Fourth Estate” and “The December Press.” Which is to say, I chose a different direction.
The final product needed to sound fresh, new and exciting. Not traditionally used as a company name, but versatile, and describing a forward action of some kind are action verbs. Words like acquire, defer, and improve, etc. They’re also vanilla enough so that they wouldn’t be associated with genre first.
Pouring through several lists of action verbs, as well as any others I could think of, I compiled a list of action verbs I thought would work well.
A List of possible action verbs for client name.
Afterward, I had the above list of twenty-eight action verbs. To narrow down the selection, I ran through each verb, applying to it any associations I had to see if they fit the tone we were trying to reach. After the litmus test, I had narrowed it down to the ten that I thought as standalones sounded the best.
I was left with launch, attract, inspire, uncover, transform, defend, gather, solve, upgrade and capture. I then asked the client for three terms (nouns) that they wanted their product to encompass that I would then pair with the action verbs. They said, “excitement, imagination and suspense.”
With that information in hand, I went back to pen and paper pairing the verbs with the nouns.
As I moved onto this part of the process, it became quite clear that some of these – while sounding great on their own – didn’t work very well when paired up, and moved too far away from our goals. It was important to make sure that the pairs worked, too, because the verb/noun pairs could easily work as taglines for branded materials.
Afterward there were five clear winners.
I had narrowed the initial list of twenty-eight down to five: capture, upgrade, transform, uncover and launch.
Now with the action verbs, I wanted to create concrete company/business names. Simply “Capture” or “Transform” just wouldn’t work so much. I decided to pair each up with a couple industry-standard terms that everyone would understand: press and publishing. I also wanted to pair them with some other non-standard terms like vault, repository, registry, and library.
This worked with mixed results, and on pen and pan I wrote down the lists, then went over them over and over again, making notations about what wasn’t working.
Some were too wordy, some too genre and others just too dry.
At the end of making all my notations, I’d had a good group of ten workable names, but wanted to narrow it down further for the client presentation. I kept only Capture Press, The Upgrade Repository (my personal favourite), Transform Publishing, The Unlock Registry and Launch Press. Materials and a cleaned up presentation in hand, it was time to visit the client.
Throughout the meeting, two stood out in the client’s mind. Transform Publishing was too much of a commentary on what they were aiming to do, The Unlock Registry just didn’t make enough sense and The Upgrade Repository was too flashy and abstract. They loved both Capture Press and Launch Press. They really didn’t know how to choose between these two. It came down to my opinion. I went back through my notes and scribbles and got back to the original pairing of the action verbs with the three vital nouns.
Capture Excitement! Capture Imagination! Capture Suspense! vs. Launch Excitement! Launch Imagination! Launch Suspense! Side-by-side, to me, Capture was clearly the stronger of the sets. Launch just seemed to be a starting point for each of these descriptive nouns whereas Capture seemed to already have these things, own these thing, taken by force. In this context, Capture seemed much more provocative. The client agreed.
We had our name: Capture Press.
Drafting a Logo
The first thing I want to do when drafting a logo are a series of “cocktail sketches.” I call them these because of the old idea of drawing or writing on cocktail napkins. I have several smaller notebooks that I will use, scribbling logo concepts into. These are often very rough sketches, in various states of completion. They’re just there to get my mind rolling, or the conceptualise what I see in my head. As you can see, they’re pretty crude.
A sample page of Capture's "cocktail sketches."
From the instant we had decided upon Capture Press, I had a central theme I wanted to explore: handcuffs. Little says “capture” quite like handcuffs, and the circular shape lent itself perfectly to the letterforms of the client initials, “c” and “p.” A majority of my early sketches reflect an attempt to make that work. Other rough concepts centered around my associations for capture, like escapism, prisons, lassos and Houdini.
Afterward, I’d go back refining these sketches in better detail, picking apart the ones that might work, perfecting the ones that would and discarding the rest.
Then it was time to step into Adobe Illustrator, and get the best concepts dialed down, cleaned up and properly treated with type samples. A smattering of them included:
The iconography and type samples.
I still liked the concept of the handcuffs, but it became obvious that trying to force the “p” was not working. Not to mention that there was an associated element of inappropriateness to the handcuff motif. The stand alone “c” above the serif capturepress was effective, but was perhaps too traditionally print-like. I also decided to leave the more circular typefaces at home in favour of gothic typefaces. I quickly settled upon Alternate Gothic No. 2 as the best option. I still liked the joined handcuffs inside the circle above a simple CAPTURE treatment, as well as the simplified concept of the keyhole. I’d also still be willing to tug at the “c” handcuff icon.
I ended up presenting just these two:
The client liked both, but concluded, as I did that handcuffs might not be the correct style of iconography, no matter how cleanly it was presented. They also insisted that the term “press” be brought back into the logo. I showed a few samples of that logo with press beside it, below it, struggling with the balance of weight that adding press took away from the lock-element, finally settling on the approved logo:
We have a winner!
I’ll save for another post how we expanded the identity into a full brand across web and printed collateral.
1, 2, 3…Let’s Colour Theory (A Rhyme?)
Sunday, March 7th, 2010This post is a direct response to the aggravation I was under teaching design. More importantly, teaching design to developers. Let’s be clear, there are developers, there are designers and then there are the hybrids. The hybrids never bothered me, they got it…mostly. However, it’s amazing how many people are baffled by colour (or correct colour choices). Let’s make one thing clear: Colour Theory is one of the single most important parts of design. I often told my students that with “good colour theory and typography you’ll never miss a day of work.”
What’s worse, is that with the internet, the colour-hopeless have “help.” And by help, I mean, not at all. Things like Adobe’s kuler, and ColourLovers (bonus points for the British spelling) have provided templates and themes for them to take. There’s no teaching there, there’s no learning. Not that colour can be taught or learned by everyone. We should at least try, though. Worse yet, is that sites like kuler and ColourLovers are a mixed bag of successful colour palettes, and often are far too busy. Some of them are downright dreadful and even those that aren’t often offer up to five colours(!) which is far too busy as it were before adding in the associated shades and tints.
I’ve seen the pitfalls of this, where a developer (or someone a company has thrown unwittingly onto designing something) has nicked a theme from one of the above sites and because it’s seen as a set, or a theme, they feel they need to use all five, six colours. Oh, no, no, no. There’s a word for that, and it’s busy.
As a rule of thumb, you should not need more than THREE colours. Note that this does not mean only three shades and tints. Three colours.
NOTE: If you’re not natively aware of the difference of colours, shades and tints (without running to Wikipedia) we could be in some trouble here. Let’s marshal on anyway, shall we?
So, we take that as a guideline. We’re setting out to use only three colours. The next important question is…which three colours? There’s no set rule to this, as successful colour schemes can come from anywhere in the spectrum. However, there’s a few things that always cross my mind when I’m selecting colours:
Association.
Attitude.
Ancestry.
With Association, I mean Colour Association and Colour Psychology/Symbolism. One of the core tenets of colour theory. What feeling, emotion, word, object, traditions are associated with a colour? By now we’ve all heard of “green rooms” used frequently for guests of talk shows. Green is a very calm, soothing colour and as such, waiting rooms were painted green to calm the guests. Green can also be associated with money, the outdoors or Saint Patrick’s Day. For example, green is a common earth tone used for outdoors/earth related websites. Take a look at REI’s latest website.
REI's latest website would bring a tear to Captain Planet's eye...
Inversely, in the United States, a colour like red is very alarming, and might agitate (or inversely, make them feel joyful, dependent on person) a user. Even for a company like Honda or Coca-Cola who’s company brand is dominantly red, it is used sparingly, only to grab attention for important things. Likewise, red is always an attention grabber. That’s why insurance is higher for red vehicles. Instead, for something they want people to actually use as opposed to just look at, they use a bunch of neutrals that will neither disturb nor distract from the brand.
If you’re designing for a company with an international presence, you should definitely be aware of cultural associations. I’d mentioned above that red in the United States is a very aggressive, attention grabbing colour. What about in Canada? Patriotic. For instance, in Tibet, purple might be an impactful colour choice given it’s association to Buddha. While in the U.S. white is seen as a virginal colour, associated with purity (hence, weddings) through out parts of Asia, it’s a colour of mourning, replacing the western view of black.
There’s of course, way more to association/symbolism/psychology (especially when taking into account the idea of “colour placebo”) and it’s a dense conversation to have. I’m not going to present any more information however. If you’re looking for more, you should certainly read books, blogs, and study the brands of the world. For a book, I’d suggest Color Design Workbook (also linked to on the right) by Rockport. It’s a pretty solid starter book (if you buy it through that link I also get paid, hey-yo!).
Next up, Attitude. It’s exactly as it sounds…what kind of attitude do you want to send with the design or brand? For example, “neutrals” like blue (especially darker shades) and grey are often seen as unbiased and professional. Have you noticed that even though Presidents (or Prime Ministers) could easily dress like they walked off a GQ cover, they dress mostly in boring navy suits with a blue or red tie? There’s a reason and yep, it’s to appear unbiased, professional, and to an extent, more focused on the work than on themselves.
Instead of this...
...we have this.
And this.
The point being, if you want to appear professional, unbiased, trustworthy, use grey, or a dark shade of blue. Inversely, if you want to send a message of vibrancy, use something like pink, magenta, a bright green or orange. These are often used as brighter, attention grabbing colours without being stark (like primary colours).
Pinkberry's logo you notice for its youthful vibrancy.
Lastly is Ancestry or heritage. There’s something to be said for a company with tradition. Just like typography and art treatments can date a brand, so can colours. You have to decide given subject matter of the company, or the heritage of the company whether to go with fresh-faced, contemporary colours, or more traditional. For example, the “chocolate/sky blue” pairing is all the rage now. You go into Bed Bath and Beyond and it’s everywhere. It’s fanciful, but also ult-modern. Would that be appropriate for an art school that’s been around since the 1930′s…probably not.
Ancestry handled in the wrong way, and you might end up like Pepsi, with your base divided in half. I for one at least like their idea of stepping off the primary colours, in favour of more versatile, muted versions, if not the execution. That’s right, I hate primary colours. They’re too stark and clashy.
It’s good to note that none of this is “rule” just firmly explored opinion. In the hands of the right designer, anything is -technically- possible.
Anyway, so, you’ve put some thought into the Association, Attitude and Ancestry of the brand. You’ve got some ideas of a primary colour, and maybe a secondary colour, but it seems wholly incomplete, and a bit limiting still. Besides, I promised you a third colour. So, what is that third colour, and how do I decide. Well, you could just eyeball it, but that’s impossible to teach and wholly unscientific.
A process to decide alternate options that I’ve come to like (and seems more analytical) is doing something of a venn diagram. Do we still remember those from schools? Spheres of overlapping influence? I’ll show you an example:
This is accomplished by taking two colours in either Photoshop or Illustrator and messing with the blending/overlay options. This is not always going to result as a win. The bright green and the navy-ish grey look great together, the two greens look great together, all three look good with white and black. However, mixing the darker green with the grey is mostly disastrous. I left these colours together because, well, I wanted to show the good and bad to the process and that it cannot be 100% trusted. It doesn’t mean you shouldn’t use the two colours together, and that there isn’t a good third option. It’s an experiment meant to give an idea.
While snooping around the internet, you’ll note that others are doing essentially the same thing. Check out Brand New’s article on attempting to re-brand Valentine’s Day (it’s a great article anyway).
But, but, but, it’s still not enough! First off, you might be right. Three colours may not give you enough variation across all the various materials and collateral you may need to be brand. However, before accepting that conclusion, absolutely make sure you’re right. If, and only if you come back with the same conclusion, should you then explore shades and tints.
A more successful color study with shades and tints
In Adobe Illustrator, using the color palette and spot colors, we can add amounts of white to create tints. Using process colors we can add amounts of blacks to create shades. Shown here are now twenty-seven shades and tints that are perfectly on brand and at your exposure, while keeping to only three colours.
So, in a nutshell, colour theory. Have fun. Hope to see you in the comments.
ads
Facebook
Twitter
LinkedIn
Last.fm
Shelfari
Flickr
delicious
Youtube