Sketching Interactions

As designers, you already use sketching at key moments in your process. I just wanted to take a moment and show you some examples of how other designers try to convey moments of interaction.

Sketching comes early in the interactive design process, just as it does with other design disciplines. Before you wireframe, before you decide on interfaces, you sketch. Capturing the little moments—the drag-and-drop, the fly-out menu—that is the challenge. Some people choose to storyboard, just as film and TV motion designers do. Others develop a notation system of their own to depict the interactions. I will be handing out one example of the latter to you tonight.

What is a sketch?

To paraphrase David Malouf:

  • It needs to happen quickly.
  • It needs to be cheap enough as to be disposable (materials & time).
  • There need to be a lot of sketches for comparing and contrasting.
  • The visual style needs to be simple and clear so the entire team will understand it..
  • It needs to be rough so no one gets attached to it.

Labtime: Sketch ideas for your web site

For the rest of tonight’s class, I will be working with each of you as you sketch out ideas for the web site you would like to build during this quarter. Please have these sketches on hand next week as we will go over them as a group.

Keep it simple—use a big, fat Sharpie and move quickly. Use post-it notes on a larger sheet of paper, whatever makes it easy for you to generate several ideas in a short amount of time.

Don’t worry about whether you can draw or not—in fact, if you render it too well, you may start seeing your sketch as a final design. That is not the goal here—we are exploring possibilities, not nailing down the one and only concept we’ll attempt.

Articles used to create this lesson:

Interactive Design Notation (open as a pdf)
Jakub Linowski  |  October 29th, 2009

Shades of Grey: Thoughts on Sketching
Will Evans  |  June 24th 2010

Sketch, sketch, sketch
Joshua Brewer  |  January 21, 2010

UXLX report: day 2
David Malouf  |  May 19th, 2010