January 2011

Establishing a visual grammar

Having a great idea doesn’t always translate to a great design. Fantastic, original concepts can still end up as run-of-the-mill executions, merely leaning on recent trends and contemporary visual approaches.

What is essential to any project is to define a visual grammar to clothe your idea and give it form, dressing it for the occasion, so that it stands out from the visual crowd.

In this short tract, we’ll explore a two-step method you can use to establish a distinctive visual language that sets you apart from your peers, often over-reliant on the latest visual trends.

After defining your idea – a topic we wrote about recently for 24 Ways 2010, in an article titled Good Ideas Grow on Paper – you need to establish a visual grammar that’s appropriate to the task at hand. The visual manifestation of your idea can take a number of forms and, as ever, an informed decision can only be reached by conducting research. So, how do you begin to define a visual grammar that’s appropriate?

The hunter-gatherer

The first, and most important stage, is to look beyond the computer. In any project the over-riding temptation is often to fire up Mr Google, and enter the ‘query of your choice’. The problem with this approach, however, is that the material you inevitably return is pre-filtered, passed through a mechanical sieve and defined by the logic of algorithms within a computer.

The key to finding a unique visual language appropriate to your idea, is to sidestep the mechanical filter and undertake the filtration yourself. The finding and sifting should be through you, not through the industrial sieves of Messrs Google, FFFFound or Flickr.

At this stage, it’s important to return to primary sources, visual stimuli that are informed by the ideas you’ve established. The easiest way to introduce new material is to return to primary research and, in so doing, uncover new, less explored visual approaches.

Whilst it’s true that sites like Pattern Tap can offer a valuable insight into established design patterns – something that, at the right time in the process, is extremely useful – the key at this stage is to look beyond the screen and find something new to inspire your visual approach. So, where do you start?

One technique we recommend is what we call the iPhone Rapid Scrapbook™ technique. This methodology, simple in its approach, is a powerful one for gathering visual stimuli. The procedure is simple and involves nothing more than an iPhone and, dare we say it, a trip to the library.

Roaming around the dusty shelves of a well-stocked library is always a pleasure, and when using the iPhone Rapid Scrapbook™ technique with our students, we’ve found that the results without fail bring out unexpected and reward- ing results.

The key here is to undertake applied research and use your camera as an impromptu digital scrapbook. By embracing this approach, the results will often prove serendipitous, chance discoveries of the sort rarely uncovered by the machine intelligence of search engines. Your idea should have focused you down to a field of opportunity and, like a hunter with his flint-headed spear, you should use your hunting tool, the camera, to gather visual raw material
centred around that idea.

All this should take no more than half an hour and the fresh visual inputs gathered should be enough to bring you to the next stage of our journey: the cataloguing and organisation of the visual inputs you’ve accrued.

The librarian

Once you’ve gathered a range of visual material, the next phase is to refine your collection by applying some organising and categorising principles. Looking at the material you’ve gathered, find common themes or linkages. This stage is critical and lies at the heart of discovering an emerging and cohesive visual grammar which can be applied in the service of your idea.

Like a librarian, the key is to take existing knowledge and apply an organisational framework to it. The librarian’s role is to find commonalities and, in so doing, tease out connections. Just as in a library we can use the Dewey Decimal Classification to group related elements, we can use this stage of the creative process to find common visual themes that might offer inspiration when moving from the idea phase into the design phase.

Our goal is now to ‘clothe’ the idea, to create a well-tailored suit that will do your idea justice and dress it in the attire that sets it apart from other superficial, off-the-peg approaches.

There are numerous systems for cataloguing and organising visual information. You might use iPhoto, Flickr or a giant Photoshop canvas. The outcome, however, is more important than the perfection of the process. Create your own system and find your own tools to apply your organisational logic. The principles you should consider are simple: the goal of organising is to help your brain find connections that you can explore further in the design process; keep things simple, work fast and don’t over-intellectualise.

The outcome of the process should be to define a series of visual or conceptual rules to govern the visual grammar that will best service your idea. Ask yourself: What design cues emerge from your research? What connections arise from your visual scrapbook? How might you apply the visual grammar that is emerging to your idea?

To summarise

To summarise, once you have your idea, resist the urge to clothe it in the latest visual fashions. Your goal is to stand out from the crowd, wearing a bespoke suit, finely tailored to your needs. The two, intertwined, techniques we’ve introduced offer you a way to discover fresh visual inputs and, in so doing, establish an appropriate visual grammar that ensures your work has its own unique, and appropriate, visual flavour.

By following these principles – going straight to the source through primary research and becoming the filter and, in so doing, discovering unexpected visual associations – you’ll find the visual approaches you apply in the service of your ideas are enhanced, setting you apart from your peers.

We wish you well on your quest in search of the perfect visual grammar, now armed with the knowledge that the best place to begin that quest lies beyond the computer.


The Standardistas

Two tweed-clad gentlemen (Christopher Murphy and Nicklas Persson) based in Belfast, The Standardistas write about design, web standards and assorted miscellany for your periodical pleasure.


This article was commissioned for our January 2011 magazine. Like it? View all articles, grab our RSS feed, and subscribe to our newsletter.