andrew ingram's homepage

  1. Home
  2. Archives
  3. Portfolio
  4. About

Abstract

A brief summary of the article

When I took design lessons at school the principle of Form versus Function was introduced to me. I can’t help but think that the way it was taught has helped to fuel some misunderstandings. I’m going to offer my thoughts on what it actually means.

Content

Main article body

I don’t have any real traditional design training, I took a few design classes like most British schoolchildren but in general I went in the direction of the more scientific subjects. However, I have a strong recollection of how one particular design idea was taught, the principle of Form versus Function. As the idea was introduced a horizontal line was drawn on the board with the word “Form” at one end and “Function” at the other, the lesson then went on to explain how design was about solving the conflict between Form and Function and that any design solution would be somewhere on that line. The inadequate line of form versus function

My opinion is that this idea leads people to the conclusion that a product can’t have both form and function, that the best you can ever achieve is a compromise. An example that springs to mind is Google, they could very easily have a homepage with better form and no additional overhead. But when people suggest that Google polish up their homepage, thousands of people rush to their defense arguing that Google’s strength is its simplicity. People seem to be under the misconception that a more attractive design will somehow make the site more complex and difficult to use, they genuinely believe that form comes at the expense of function.

There is another definition of versus, one that isn’t necessarily about pitting two sides against each other. I’m talking about the scientific definition. In science when you talk about one thing versus another you are probably referring to two variables in an experiment, but variables that aren’t necessarily opposed. What you get is a two-dimensional graph, this is an approach which I feel is much better at illustrating the essence of design. A graph of form versus function that better illustrates actual design

In this graph the red line would represent form versus function as I was taught in school, the blue line represents the possibility that form and function can increase with each other. The right side of the graph (shaded blue) shows the areas of good design, where function takes priority. The left side (shaded red) shows areas of bad design where we’ve focused on form. The top-right area is where we should all aim to be, it touches the 50/50 point on the old line, but that really is just the tip of the iceberg. This approach shows that we can reach solutions that ask for no compromise – it’s possible for something to look nice and be usable. Design is not the battle of form and function, it’s the marriage.

Comments

What people have had to say about this article

  1. John Lascurettes #
    08:15pm, 21st March 2007

    Ah, apologies. You are saying the same thing as me in the graph. I didn’t read carefully enough: “the blue line represents the possibility that form and function can increase with each other.” Indeed.

  2. John Lascurettes #
    08:22pm, 21st March 2007

    Okay, for some reason my original comments didn’t post, but the follow up did. To give my follow up a little context, here is the original:

    The traditional Bauhaus concept, from where this came in the first place, of form and function is not form VERSUS function, it’s form follows function. Or stated another way, form should not dictate function. For your professor to have drawn them on one continuum was definitely wrong.

    Form and function in design are both as independent and interdependent as content, style, behavior and structure are in markup. That is to say, they influence each other, but they are different spectrums altogether.

    Your graph therefore does not have to have opposing slopes. There is no reason that you cannot have both excellent form and excellent function. Continuing that thought, you CAN have something that fails abysmally at every level. Your graphs shows that this would not be the case.

  3. Andy #
    08:46pm, 21st March 2007

    Thanks for your comment John.

    I was familiar with the idea of form follows function when I wrote this article, I didn’t realise its origins as a Bauhaus concept though. I guess the point to be made is that some schools (hopefully limited to state education) are teaching the Bauhaus concept in such a way that the point is being completely missed. The image of that single line is something that I can still visualise from when it was taught to me about 10 years ago.

    I’m not sure why your original comment didn’t get posted, must have been some glitch in the system.

  4. John Lascurettes #
    09:31pm, 21st March 2007

    The glitch seemed related to Textile markup. It wouldn’t post until I removed anything resembling Textile. I had some underscores and asterisks for emphasis and I had some parenthetical phrases—the last of which wasn’t meant as any kink of Textile markup.

  5. Andy #
    09:39pm, 21st March 2007

    Hm, I seem to be able to use textile in my comments, though it seems I neglected to style the output – an oversight thanks to using YUI Fonts I suppose.

    I’ll have to take a look at trying to reproduce the glitch when I have my computer back.

  6. morganusvitus #
    01:00am, 06th April 2007

    The site looks great ! Thanks for all your help ( past, present and future !)

  7. crystal #
    02:55pm, 29th November 2007

    Form versus function doesn’t make design sense.
    It should be form=function.

    about googles homepage.
    keep in mind form = function
    It’s simple.
    Google is a search engine, a search field is all which is needed on the the homepage. Why muddy it up with content with has no function?
    The function is coveyed through the simple form of a serch window.
    In the end form=function.

    This applies to all design projects

  8. Andy #
    01:50am, 11th January 2008

    Apologies for not noticing crystal’s comment earlier.

    When I talk about the idea that Google could improve their homepage design I don’t for a second mean that they should be adding more things to it.

    On the contrary I am of the belief that once you identify the purpose of the page (in this case search and to a lesser extent providing access to the rest of Google’s products) you should do everything you can to ensure that nothing else is present.

    But this doesn’t mean that there isn’t anything Google could do to improve their homepage. There are a lot of alignment and whitespace issues that could be dealt with, the default font size is perhaps a little too small, and so on. By addressing these issues both the form (it becomes more aesthetically pleasing) and function (no functionality is lost, nothing is added that might confuse the message and the improved aesthetics do count as function too) increase.

  9. Za #
    01:14pm, 05th June 2008

    Your evaluation and explanation here has enlightened me. I am currently a Mass Communication student taking a Graphic Communication course. I am not much of an art student, which is why I am stuck at a Bauhaus assignment. Anyway, thanks for the enlightenment.

  10. Bogus #
    04:50am, 19th June 2008

    I think your analogy on form and function is good i like to think that you need a good balance between form and function. What do you know about the Bauhaus functional design and the Ashcroft (I think) formal design?

Add Comment

Use this form to add your own comments

Colophon

Andrew Ingram is a 24 year old British Web Developer. He hopes to one day be able to legitimately call himself talented. He currently resides in Clapham, London, which is more expensive than it deserves to be.

Feeds

Subscribe to the RSS feed to read new content at your leisure (requires compatible software).
Full-Entry Feed