I designed a new brand identity for We Act Radio, a progressive AM radio station in Washington, D.C. The identity includes an acronymn (above) and a full logo (below). The lightning in the full logo is intended to appear differently every time you see it; here I have included three different lightning strikes in a short animation.

The staff at We Act Radio sought a bold identity that expressed action and motion; their goal is to motivate audiences to make change. After throwing obvious, cliched solutions out the window (the raised fist being the most predictable), I decided to use lightning as an elemental representation of action. Its other associations include electricity, power, and ideas. The effect is very bold and dramatic, just like We Act Radio’s personality.

The music fans who launched Festivals For Less are committed to providing great deals on tickets to live music festivals. The identity I designed for them incorporates a primary ‘ticket’ logo with a series of secondary icons. The typography is modern, but the decorative elements add a festive, nostalgic flair – and I find that the curled stripe resembles a bass clef.

Proof Pudding is “the ultimate blog of food and proof.” Having designed the original logo and site a few years back, I decided it was time for a refresh. The new logo (above) is a bold stamp of approval emphasizing the concept of ‘proof’: when site author The Proofmeister grants a recipe or restaurant with his approval, that’s Proof.

The identity carries over to a series of header banners I designed – which now rotate on every page load. The banners (thumbnails below) feature the site’s logo, title, and slogan emblazoned over bold close-up photos of food. Proof!

Regardless, the results of the contest have been published online – although I don’t know when it was launched or if the NEA made any noise about it at all. They almost seemed to lose interest in the project shortly after launching the RFP – and who can blame them? They must’ve been swamped with questions and backlash from day one.

Winning design by Why Not Smile, LLC

NEA Art Works logo submission by Dan Redding

In conclusion: just say no to speculative design work.

.

Motion and animation emerged in identity during the 1980’s when brands like MTV and Nickelodeon adapted their identities for the television format. Those themes have only recently become dominant factors in the industry. Today, identity is adapting to a variety of emerging and evolving formats: 3D and the handheld web among them. Here’s a look at some of today’s advancements in identity design that have the potential to grow into major themes.

Three-dimensionality
BFI Identity by johnson banks

The British Film Institute identity designed by johnson banks utilizes motion and animation – de rigeur qualities in identity these days– but its real innovation is its use of three-dimensionality and light. Discussing this identity at the Brand New Conference, Michael Johnson described his decision to avoid predictable and outdated concepts (film reels, clappers) in favor of an elemental signature of motion pictures: the lens flare. The result is a dazzling, illuminated identity that implies the distance between a light source and the viewer’s eye.

The MTV logo is often credited with being the first identity to adapt to the television medium. Now that television and cinema are going 3D, one can imagine identity systems that literally jump off the screen to expand and move in three dimensions. When asked about identity design’s potential in coming years, Johnson said, “I tend to think that it can only get better from here.”

The Brand Universe and the Anti-Logo
Universiteit Twente Identity by Studio Dumbar

The identity for this Dutch science University is a daring revision of the meaning of identity. Studio Dumbar partner Tom Dorresteijn explained that the “basic material of the identity” was not a logo or a color scheme, but “a world of exploration”: an array of colorful organic and geometric forms. The spare, minimal logo exists as a matter-of-fact typographic label that quietly identifies the “universe of form.”

Studio Dumbar’s approach to branding prioritizes artistic personality over conventional corporate identity. Bold concepts are used to dramatic, awe-inspiring affect; this feels like fine art as identity.

Much like the world of fine art, designers often seek to shatter the conventions of the previous generation. Now that identity has been liberated, where do we go from here? Someday, rebellious identity designers may return to that forbidden, shattered sacrilege: the logo.

Flexibility
PwC identity by Wolff Olins

Brand New founder Armin Vit cites the PwC identity by Wolff Olins as “the most encouraging sign in all of 2010 that interesting, daring work can be done with corporate clients.”

Launch PwC Animation

This is an identity that is flexible enough to expand or shrink in size depending on the media and format. Its scalability is its greatest strength, and it may be the first time that usability trumps symbolism in identity: its bright rectangles provide no representational meaning of their own, but rather canvases for text and image.

Diversity
La Transat AG2R La Mondiale identity by Studio Dumbar

The visual identity for this international yacht race includes 26 different symbols in eight colors representing the style of maritime flags. This broad range of striking symbols comprises a visual language of its own. The next generation of identity designers may eschew a single mark or identifier in favor of the development of diverse ‘languages’ of communicative symbols.

Interactivity

Interactivity shows so much potential in identity design – and it’s virtually unexplored terrain. We talk about interactivity often – but few identities can actually be edited, customized, or played. Google’s PAC MAN doodle turned their logo playable, but as web and handheld platforms evolve, this will just be the tip of the iceberg for the individual user’s personal experience with interactive brands.

Conclusion

The Brand New Conference featured a wide variety of inspiring and daring work. However, it’s worth noting that just because something is new doesn’t make it good. Identity design will continue to adapt to mobile, 3D, and whatever newfangled contraptions disrupt the market next year. With studios like johnson banks and Wolff Olins at the helm of identities in those arenas, the results will surely be exciting – and likely, controversial. Despite the thrill of the new, these firms will continue to find their most powerful tools among design’s timeless sources of communication: concept, composition, color, and symbolism.

This is a logo I designed for a friend’s band last year. Each day this week, I’ll be posting a design of mine – new or old – that I’ve never shared before, so please stay tuned! Thank you.

This case study is fascinating because transformation and motion are dominant themes in identity design today; see Luke Hayman’s SECCA identity for another recent example.

The ‘Transformative’ UCLA Mark

‘Transformative’ is a word that emerges often while Eddie talks shop, and the theme is certainly manifested in this daring identity.

Eddie’s original mark (two variations above) is architectural and so abstract that the letterforms almost become a secondary realization: the acronym emerges after a moment of viewing the bold shapes. It’s very hip, bold, and implies three-dimensional structure.

However, according to Eddie’s tale in his presentation, this identity was (mostly) abandoned by the university after about a year in favor of what they have now (“It’s Optima Slanted,” Eddie laughed, “…you could have done it in about fifty minutes”). Here’s where things get interesting.

Eddie side-stepped the University’s abandonment of his identity by transforming it into a sort of incognito post-identity. He designed an iteration of the identity that takes abstraction to the extreme: the letterforms are now gone. “It doesn’t say UCLA, does it, eh?” Eddie says with a smile. “It doesn’t say anything!” Visit the architecture school’s homepage and you’ll see a video of the transformation of this revised post-logo.

I’m impressed by Eddie’s cleverness and tenacity in finding a way for this identity to live on in its new, subversive reincarnation. Some might say that there was a fundamental problem if the client was unhappy with the identity in the first place (Eddie says the Architecture school fought for it but the University decided against it). Whatever the politics of the situation were, this project is the work of a designer who is willing to take risks and strongly believed in the results.

Another theme that resonated with me was Eddie’s discussion of designing imagery that references the past. He says that these images should be “contemporary and nostalgic.” I loved this way of describing the necessity of updating the past and viewing it through a contemporary lens (instead of merely regurgitating history).

View Eddie’s presentation below or read Alissa Walker’s Eddie Opara article and interview at Fast Company.

The Social Security Works logo emphasizes the message inherent in the organization’s name. Through typography and punctuation, the words become not just a name, but an emphatic statement. In previous designs that were considered, other iconography was used: pillars (which you’ll see on your Social Security card), an eagle, elements of the American flag. We eventually decided that all of these things were superfluous; the name says it all. The final logo utilizes bold typography and color to amplify what’s already there.

The animation above features a series of graphic statements developed as assisting materials in the graphic identity. You can see another version of this concept in the background of the Social Security Works Twitter page.

This idea was inspired by a series of blog posts that the Social Security Works team had written. These posts are titled Social Security Works for People of Color and so forth. The articles are informative and persuasive. These phrases and statements proved to be quite persuasive as well. They expound on the meaning present in the logo.

Above is a screenshot of the website I built at socialsecurity-works.org. This site is a branded, customized WordPress content management system. The header features a Javascript photo slideshow portraying a range of societal demographics that benefit from Social Security. The ‘Social Security Works…’ articles have been given their own prominent area of the left sidebar. The right sidebar is devoted to social networking.

Many thanks to the fine folks at Social Security Works.

]]> http://www.magneticstate.com/blogdept/2010/brand-identity-web-design-social-security-works/feed/ 1 http://www.magneticstate.com/blogdept/2010/the-age-of-miniature-design/ http://www.magneticstate.com/blogdept/2010/the-age-of-miniature-design/#comments Thu, 29 Apr 2010 15:19:12 +0000 Dan Redding http://www.magneticstate.com/blogdept/?p=595 “Basically the future of web design is gonna be on a little tiny screen.” -Google designer Ryan Germick

It’s no secret that images need to reproduce at very small sizes in order to be effective online. And when I say ‘very small,’ I mean ‘the size of a pencil eraser.’ That’s freaking small. It’s always said that logos should be scalable (i.e. they need to function at large and small sizes), but we have moved into an era where scale itself has a different calibration. Twenty years ago, the smallest canvas you’d be likely to design for was a business card. Never before have artists or designers had to consistently focus on scales so miniature. I recently designed an album cover which I frequently shrunk to iPod/iTunes sizes to check its readability and visual impact (it’s looks rad and it’s coming in mid-May).

From left to right, the favicons above belong to WordPress, Google, and this blog. You might say that favicon design – which is typically 16 pixels by 16 pixels – is an art of its own (I squished a Warhol into a favicon here. I think he’d approve and/or laugh). It has been said that designing with the favicon in mind is the contemporary equivalent to the fax: designers used to stress that a logo or brand identity had to reproduce well in a low-quality black and white reproduction.

Favicons aside, the age of miniature design appears to be around for awhile. Handheld web devices continue to be a dominant form of web browsing. Digital information is commonly consumed in condensed and aggregated forms like RSS feeds. Most brands are frequently represented by images smaller than a postage stamp: the app button on your iPhone, the icons in your Twitter feed, etc.

Owners' marks on pottery, circa sixth century BCE.

In this type of design, simplification reigns. ‘Less is more’ is truer now than ever before. In brand identity, one great place to look for inspiration are be the simple runes and symbols of early forms of writing. Great power can be derived from very simple symbols and letterforms.

It’s also important to take every opportunity to spaz out and make drawings and designs that subscribe to the ‘more is more’ philosophy. An entirely minimalist world would be a boring place. Working at both ends of the spectrum will increase your skill with both ‘less’ and ‘more.’

So… whaddaya think of the new digs? After I made some new decisions about how I plan to use this blog (I plan to use it more and bigger and better), I decided a redesign was necessary. Of course, that’s got me rethinking the design of the entire Magnetic State portfolio site as well – but one thing at a time.

Two vintage title screens from Columbia Pictures

My first goal was a new logo that represented the ‘Blog Dept.’ as an entity that functions both as a component of Magnetic State as well as a standalone publication. In both the name of this blog and the design of the logo, I was inspired by film noir movies (you know, the black and white ones where Humphrey Bogart carries a flask and a revolver in his trenchcoat and says ‘dame’ a lot). I always admired the title screens and studio i.d.’s from these films from the thirties and forties, and I specifically emulated the three-dimensional block letter effects of Columbia Pictures (above). I used a somewhat wild color combination to give my design a modern flair.

Bogart pursues the facts and just the facts. Notice the bold 'Spade and Archer' label on the window.

In films like The Maltese Falcon (pictured), there’s always a business name on the detective’s window or an officer’s name and title on the frosted door window of a cop’s office. I liked the idea that this blog is a ‘department’ at Magnetic State and that the logo can serve as the title on the door, if you will.

As for the web design, I intended to prioritize the content. My previous layout placed blog posts under a distracting header, but now the blog content has plenty of room to breathe, is prioritized vertically, and is more readable. I am thankful for Small Potato’s tutorial on writing WordPress themes, which I have referred to many times over the last year or two. I consider myself an expert on custom WordPress themes now; I have one bare-bones theme that I wrote by hand (from SP’s instructions) which I’ve customized for each of my last four or five WP sites.

Thanks for stopping by and I hope you’ll subscribe via RSS! I have some big things planned for this blog as well as a bunch of new design work to unveil in the next few weeks.