//
post
Design

What’s wrong with this picture?

The 1990s was an age of online graphic innocence. The WWW was populated with amateur personalised websites. Welcome now to the template age, where you can focus on content, and leave the packaging to others. At most you only need select from a range of page templates.

Facebook, Twitter, Flickr and blog content management systems encourage you to focus on what you want to say, your pictures and links. There’s no need to design the page.

For the technically minded this separation between form and content is also a feature of XML (extensible markup language), enabling you to format the same content according to different stylesheets. The graphical appearance of web pages has been professionalised — ie institutionalised, corporatised and anonymised.

I miss the good old days of badly drawn kittens, hearts, Gothic script muddled with Times New Roman, unaligned text and the pixelated clip art of amateur, home-spun personalised websites. At least it made the professionally designed work stand out from the rest. (Media amateurism has now shifted to videos and weblogs — anyone can be a filmmaker or journalist!)

Is there a method for producing good page design? The writings of the artist and Bauhaus teacher Wassily Kandinsky are often invoked to reinforce the rule-based nature of design. The title of his book, Point and Line to Plane, suggests a rigorous and scientific approach to composition: start with simple graphical elements, consider how they are arranged, and how they relate to each other.

The investigation should proceed in a meticulously exact and pedantically precise manner. Step by step, this “tedious” road must be traversed — not the smallest alteration in the nature, in the characteristics, in the effects of the individual elements should escape the watchful eye. Only by means of a microscopic analysis can the science of art lead to a comprehensive synthesis, which will extend far beyond the confines of art into the realm of the “onenesss” of the “human” and the “divine.” (p.21)

Fortunately it’s the theorist who is to embark on this journey, not the designer. The book is arguably a polemic to ground and justify abstract art in the face of art that represents (ie “objective” art). But those who believe art is grounded in Cartesian geometry part company with Kandinsky’s insistence on the sonic qualities of his graphic primitives, their “literary aftertaste” and the presence of heaven, home and earth in the construction of the square. This is theosophic design, synaesthetic, metaphorical and symbolic.

The tedious road

In a lecture on web design I usually present this personalised page layout with fake pride, extolling its virtues and invoking rules to justify its quality — the organisation along bilateral symmetry, the amusing content, the fact that it enables me to show off an environment I designed in a Tomb Raider level editor, the framing that defines its edges and gives it definition, and the fact that I’ve filled the page, a triumph when you have limited graphic means. The picture is graphically rich; the important text is picked out in sympathetic colours; it has variety, colour, personality – for what more could you ask?

When they detect my ruse we try and work out what if anything is wrong with the composition. The choice of components and words look somewhat random, but it’s an exercise in page layout not content. The symmetry is fine, but it’s not consistent across the whole picture. It’s not drawn precisely enough. The main border is all over the place. Some of the text is illegible. The meaning is not really very clear, and the images don’t relate to each other. The word “arbitrary” features prominently in our critique. Here are some further criticisms.

Lack of contrast in the use of colour; the areas of maximum contrast are not really the places where you want to focus the viewer’s attention (eg the messy frame); the attempted symmetry seems arbitrary; there’s annoying coincidence (eg one of the arbitrarily-placed pictures lines up with the centre line, and Lara Croft’s pony tail); the background is busy and distracting; the whole page is full of stuff, as if the designer is afraid of white spaces; there’s a mixture of fonts with no apparent reason; there may be humour or incongruity in the combination of images, but it’s not exploited to make a point; the designer doesn’t seem to be in control of the impression, meaning or mood of the image. Any humour, communication, or success is only accidental.

In summary the page does not look like the work of a designer. At best it invites charity rather than critique. Here are some alternatives, taming and ordering the same elements.

These attempts at least invite criticism in graphic design terms: too tentative, conventional, balanced, orthogonal; and improvements might be suggested in design terms: thinner, larger, lighter font, more relevant pictures. Rigour does not really account for the difference. Perhaps the most that can be said is that the latter participate in well-understood graphic languages.

There are many guides, online and off, for DIY page design. They follow several paths, providing

  • examples of good design
  • lists of common errors
  • a reminder about the components of composition, eg points, lines and planes, rhythm, centrality, balance, focus
  • method: think about what you want to say, consider your audience, look for precedents, generate alternatives, test the design, modify, brainstorm, think of a metaphor, etc
  • rules of composition and balance, and rules of proportion
  • analysis of certain compositional languages
  • sometimes there’s an appeal to aesthetic principles that have a basis in human psychology.

But practitioners, teachers and theorists of design like to keep such guidance at arms length. Here are some reasons.

Design knowledge is tacit and doesn’t conform to rules; you learn to design by doing it. Design is reflection in action. Design rules have to be interpreted, ie applied in particular contexts. There don’t seem to be any rules for how to apply rules. Rules are made to be broken; we want to discover something new. Methods and rules give a false sense of security; as if following the rules produces success; but often it doesn’t. Rules invariably contradict each other and apparent good practice (eg some guidelines say you should not have to scroll to see all the page content, and yet social network and weblog sites contradict this); some advise keeping white space to a minimum, others say white space relieves the eye. Graphic design is more than composition, which distracts from meaning. Rules, exercises, and formalism tends towards a kind of instrumental conformity, often thought to tame, marginalise and neutralise dissenting voices. (Think of how the reduction of the images above to issues of composition effectively neutralises any consideration of political content — and it’s there if you look.)

Many disciplines present their production graphically, including all the design disciplines, architecture, engineering, education, fashion, and the sciences (biology, physics, etc). To focus on graphical presentation as a compositional exercise can distract from and deprecate the work being so presented. The form-content distinction is artificial in any case. Good design need make no such distinction.

Here are some further approaches to page design, not exclusive of the above.

  • Content is king; ignore form
  • Usability and access are the focus
  • Communication: What do you want to achieve/say?
  • Optimise legibility
  • Focus on function: form follows function
  • Design for interaction
  • Be historical: build on precedents
  • Ask what does the medium want to do
  • Just practice, iterate, and review
  • Collaborate: invite contributions, employ crowd-sourced design
  • Aim for disharmony and discord; or at least consider the relationship between the two
  • Appropriate, steal and distort
  • Exaggerate
  • Organise in catalogues, collections and ledgers (make multiples)
  • Focus on systems, networks and flows
  • Make up your own (arbitrary) method and follow it to the letter

Manifestoes provide another source for thinking about design, as therapy during the tedium of travel. Here’s an excerpt from Carlo Carrà’s 1913 Manifesto, The Painting of Sounds, Noises and Smells, available at http://www.unknown.nu/futurism/.

The painting of sounds, noises and smells rejects: 1. All muted colors, even those obtained directly and without using tricks like patinas and glazes. 2. The banality of those velvets, silks and flesh tints which are too human, too refined, too soft, and flowers which are too pale and drooping. 3. Greys, browns and all muddy colors. 4. The use of pure horizontal and vertical lines, and all other dead lines. 5. The right angle, which we consider passionless. 6. The cube, the pyramid and all other static shapes. 7. The unities of time and place.

Perhaps overstatement and exaggeration provide antidotes to banality; a means of breaking out of the packaging.

Bibliography

  • Coyne, Richard, John Lee, and Martin Parker. 2004. Permeable portals: designing congenial web sites for the e-society. IADIS International Conference: e-Society, Avila, Spain, Edited by P. Isaías, P. Kommers, and M. McPherson, (1) 379-386. PDF
  • Desmet, Christy. 2001. Reading the Web as fetish. Computers and Composition, (18)55-72.
  • Kandinsky, Wassily. 1979. Point and Line to Plane. Trans. H. Dearstyne, and H. Rebay. New York: Dover. First published in German in 1926.
  • Knight, Terry Weissman. 2003. Computing with ambiguity. Environment and Planning B: Planning and Design, (30)165-180.
  • Wingler, Hans M. 1969. The Bauhaus. Trans. W. Jabs, and B. Gilbert. Cambridge, MA: MIT Press.

Also see posts: Exaggeration, Walking the line, Architecture as the last fortress, Nomadology and colour.

About Richard Coyne

The cultural, social and spatial implications of computers and pervasive digital media spark my interest ... enjoy architecture, writing, designing, philosophy, coding and media mashups.

Discussion

2 thoughts on “What’s wrong with this picture?

  1. Enjoyed this post.

    What I remember of those early days was not just amateur design but amateur programming.
    It was a time of HTML markup that everyone had a bash at. I am reminded of those pages when you see HTML without CSS or some sites when you are on a very slow mobile connection. You still see something like them on some academic personal pages where corporate conformity has not reached.

    I suppose templating opens things up for the non technical and aesthetically challenged. But it’s a democracy that requires conformity as the price of participation. I suppose the reason is as much about brand identity of the platform as an attempt to enforce ‘good’ design. I remember Bebo as a modern mass social platform that seemed more messy and personalised in this regard.

    On the design as rules question which is very interesting. I think an issue might be not that rules are created but our attitude in relation to them. If we take them as rigid instructions that accurately reflect the true method then indeed they are reductive and restricting. Instead our attitude could be that language is an imperfect pointer to the complexities of practice. Rules are fossils that are left behind by enactive perception much as Wittgenstien’s ladder at the beginning of the Tractatus, an aid that can be left behind once a state of embodied participation is attained.
    Perhaps with this attitude we can gain from rules without becoming their slaves?

    Posted by Mark wright | June 23, 2012, 12:02 pm
    • Thanks for the great observations Mark. There’s the argument that the strength of a rule resides in its application, which is a matter of human judgement, or at least it seems to be a skill, perhaps not itself susceptible to definition in terms of rules. This argument of course opens up the need for further definitions: heuristics, calculation, production rules, symbolic logic, grammars, language … My reply template is too small.

      Is there a graveyard for those pioneering DIY web pages? Perhaps it’s a heritage issue. Which reminds me … a new book just came out yesterday.

      Giaccardi, Elisa (ed). 2012. Heritage Matters: Understanding and Experiencing Heritage Through Social Media: Understanding Heritage in a Participatory Culture. London: Routledge.

      with a chapter by yours truly, “Mosaics and multiples: Online digital photography and the framing of heritage,” and Chris Speed, “Mobile ouija boards,” among others.

      Posted by Richard Coyne | June 23, 2012, 1:40 pm

What do you think?

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: