Design Separation & Visual Communication

by Luke Wroblewski March 5, 2004

A recent post by David Rondeau on the Interaction Design mailing list did a great job of articulating a point I raised in a Boxes & Arrows article titled Visible Narratives: Understanding Visual Organization. David wrote:

The visual design aspects of layout or information presentation (the prominence and relationship of elements, as mentioned above) must also be considered when creating the interaction design. How can you present or test the interaction of a design if the layout confuses the user, if items are difficult to find because they are not prominent enough, or if the relationship of elements goes against the user's work practice? I don't think you can. In these examples, I think interaction design and visual design are so tightly connected, I don't see how they can be separated.
Of course there are other aspects of visual design that can be cleanly separated, such as the use of color to convey meaning and emotion. But what interests me is this space where visual and interaction design overlaps. Is this a different category of design? Does it make sense to dissect design in this way or should we just accept the fact that everything is intertwined and come up with a reasonable way to discuss and describe it?

I’ve come to make this distinction by discussing visual communication (or visual design) as the sum of two intertwined parts. The first is visual organization. Visual organization incorporates the principles of perception and visual weight to create informative layouts (layouts that guide users through content by exploiting visual relationships). Visible Narratives was intended to introduce those responsible for wire frames and “low-res” mock-ups to the building blocks of effective layouts. I believe this is the type of visual design David refers to as being very tightly connected to interaction design.

The other side of visual communication is look & feel. Look and feel requires selecting the right fonts, colors, shapes, textures, and images to communicate an appropriate and effective message to your target audience. Most visual designers (and anyone trained in graphic design) should tell you these two aspects of visual communication are virtually inseparable. Perhaps, this has (in some part) led to the commonly held belief that visual design is decoration, or I as I have heard it stated many times: making things pretty. Look and feel, by its very nature, communicates so instantaneously and powerfully that it may mask the deliberate visual organization “beneath” it.

However, if you were to strip away all the aesthetic properties of an interface design, you’d be left with a good amount of visual design in the form of visual organization: arrangement to provide insight about content (activities and information) and its relationship to the big picture.