The Sketchbook Chapter 1.4 in Sketching User Experiences: The Workbook

The Sketchbook Why a sketchbook? supports the design funnel process Modified from Pugh, S. (1990) Total design: Integrated methods for successful products engineering. Addison-Wesley. P. 75

The Sketchbook Why a sketchbook? brainstorm many initial ideas – both good and bad explore & refine ideas both in the large and in the small develop variations, alternatives, details archive your ideas for later review reflect on changing thought processes over time communicate ideas to others by showing choose ones worth developing record good ideas you see elsewhere clip inspiring images from sources like magazines shoot, print and collect inspiring photos

Properties of a good sketchbook To consider durability page count size fold over aesthetics archival paper

These are not sketchbooks To consider durability X X page count  X size   fold over X X aesthetics X X archival X X Image from: image from biblicism.files.wordpress.com

Sketchbook instruments The pencil cheap, flexible easy to carry (in coil binding) always carry one with you

Sketchbook instruments The eraser and sharpener handy, but optional

Sketchbook instruments Tape, scissors and glue for cutting and pasting in found objects don’t have to carry it with you

Sketchbook instruments Small camera for taking photos of interesting ideas select, print and tape photos into your sketchbook

Sketchbook instruments Other media sure, as long as it doesn’t get in the way

Best practices Carry and use your sketchbook regularly and frequently sketch anywhere, anytime, frequently only works if you carry it with you

Best practices Fill your pages a single well composed idea a series of related drawings about a design idea things you see that inspire ideas

Best practices Sketch alternatives (getting the right design) different aspects of the interface different interface representations different contexts of use… Sketch details (getting the design right) detailed sketches that elaborate on interface nuances… Annotate drawings descriptions that you cannot draw, textual addendums, sources of ideas, date, any other relevant details… Don’t erase ideas it’s a record of all developing ideas, good and bad Don’t use it for other things for design only

You don’t need to be an artist portion of a page from Saul Greenberg’s sketchbook

Sketchbook examples artist's sketch page by Emily R. Feingold Artist ideas variations

Sketchbook examples Artist variations studies artist's sketch page

Sketchbook examples Industrial designer ideas variations annotations Source: sketch page from student Industrial designer Samnang Eav Form factors for wearable computer watch

Sketchbook examples Idea variations Source: Nicolai Marquardt sketchbook, with permission. Four different versions of an idea

Sketch examples – design variations From Carloyn Snyder’s Book: Paper Prototyping (2003) Morgan Kaufmann, p350

Sketchbook examples Computer science student Andrew Seniuk – a metaprogramming environment (with permission) many ideas + variations

Sketchbook examples The result Computer science student Andrew Seniuk – a metaprogramming environment (with permission)

Sketchbook examples Overviews flow over time relationships Source: Nicolai Marquardt sketchbook, with permission. Arrows indicate relationships and flow

Sketch examples – storyboards Overviews flow over time relationships Source: Nicolai Marquardt sketchbook, with permission. Storyboard

Sketch examples – storyboard transitions From Carloyn Snyder’s Book Paper Prototyping (2003) Morgan Kaufmann, p11

Sketchbook examples Scenarios stories of envisaged uses Source: Nicolai Marquardt sketchbook, with permission Five envisaged scenarios of a technology in action

Sketchbook examples Collecting materials related to an idea Source: Nicolai Marquardt sketchbook, with permission Information visualization techniques – from magazines

Sketchbook examples portion of a page from Saul Greenberg’s sketchbook crude drawings annotations

Sketch examples – screen snapshot From Carloyn Snyder’s Book Paper Prototyping (2003) Morgan Kaufmann p31

Sketchbook examples – details to prototype Concept: IM contacts as bugs on a leaf McPhail, S. (2002) Buddy Bugs: A Physical User Interface for Windows® Instant Messenger. Western Computer Graphics Symposium (Skigraph’02), MarchD

Sketchbook examples – details to prototype Design sketches McPhail, S. (2002) Buddy Bugs: A Physical User Interface for Windows® Instant Messenger. Western Computer Graphics Symposium (Skigraph’02), MarchD

Sketchbook examples – details to prototype Physical icons clay, glass also a sketch! McPhail, S. (2002) Buddy Bugs: A Physical User Interface for Windows® Instant Messenger. Western Computer Graphics Symposium (Skigraph’02), MarchD

Sketchbook examples – details to prototype Prototype Papier mache also a sketch! see video [.wmv][.wmv] McPhail, S. (2002) Buddy Bugs: A Physical User Interface for Windows® Instant Messenger. Western Computer Graphics Symposium (Skigraph’02), MarchD

You now know Sketchbooks are: a designer’s most fundamental tool convenient (pages, size, fold over), durable archive, aesthetic Sketchbooks are for: brainstorming, exploring, refining varying, archiving, reflecting, communicating and choosing ideas recording good ideas you see elsewhere Sketchbook instruments are: pencil optional eraser, sharpener, glue, tape, scissors, camera, and other media Sketchbooks can be filled with: Your sketches (many different kinds) and found objects Sketchbooks are used regularly sketch anywhere, anytime

Permissions You are free: to Share — to copy, distribute and transmit the work to Remix — to adapt the work Under the following conditions: Attribution — You must attribute the work in the manner specified by the author (but not in any way that suggests that they endorse you or your use of the work) by citing: “from presentations accompanying the book ‘Sketching User Experiences, the Workbook’, by S. Greenberg, S. Carpendale, N. Marquardt and B. Buxton” Noncommercial — You may not use this work for commercial purposes, except to assist one’s own teaching and training within commercial organizations. Share Alike — If you alter, transform, or build upon this work, you may distribute the resulting work only under the same or similar license to this one. With the understanding that: Not all material have transferable rights — materials from other sources which are included here are cited Waiver — Any of the above conditions can be waived if you get permission from the copyright holder. Public Domain — Where the work or any of its elements is in the public domain under applicable law, that status is in no way affected by the license. Other Rights — In no way are any of the following rights affected by the license: Your fair dealing or fair use rights, or other applicable copyright exceptions and limitations; The author's moral rights; Rights other persons may have either in the work itself or in how the work is used, such as publicity or privacy rights. Notice — For any reuse or distribution, you must make clear to others the license terms of this work. The best way to do this is with a link to this web page.