You are previewing Sketching User Experiences: The Workbook.
O'Reilly logo
Sketching User Experiences: The Workbook

Book Description

Sketching Working Experience: The Workbook provides information about the step-by-step process of the different sketching techniques. It offers methods called design thinking, as a way to think as a user, and sketching, a way to think as a designer. User-experience designers are designers who sketch based on their actions, interactions, and experiences.
The book discusses the differences between the normal ways to sketch and sketching used by user-experience designers. It also describes some motivation on why a person should sketch and introduces the sketchbook. The book reviews the different sketching methods and the modules that contain a particular sketching method. It also explains how the sketching methods are used.
Readers who are interested in learning, understanding, practicing, and teaching experience design, information design, interface design, and information architecture will find this book relevant.

  • Features standalone modules detailing methods and exercises for practitioners who want to learn and develop their sketching skills
  • Extremely practical, with illustrated examples detailing all steps on how to do a method
  • Excellent for individual learning, for classrooms, and for a team that wants to develop a culture of design practice
  • Perfect complement to Buxton’s Sketching User Experience or any UX text
  • Author-maintained companion website at

Table of Contents

  1. Cover image
  2. Title page
  3. Table of Contents
  4. Copyright
  5. Preface: How We Got Together to Write this Book
  6. Acknowledgments
  7. Section 1: Getting into the Mood
    1. Chapter 1: Introduction
    2. Chapter 2: Introduction: Sketching the User Experience
      1. What This Book is About
      2. Companion Book
      3. Why Sketch?
      4. Structure of This Book
    3. Chapter 3: Why Should I Sketch?: A Synopsis of Buxton’s Sketching User Experiences: Getting the Design Right and the Right Design
      1. Sketching is About Design
      2. Getting the Design Right
      3. Getting the Right Design
      4. Elaboration and Reduction
      5. The Design Funnel
      6. The Product View
      7. You Now Know
    4. Chapter 4: The Sketchbook: Your Basic Resource for Recording, Developing, Showing and Archiving Ideas
      1. Why a Sketchbook?
      2. Uses of a Sketchbook
      3. Best Practices
      4. Properties of Good Sketchbooks
      5. Drawing Materials
      6. You Now Know
    5. Chapter 5: 10 Plus 10: Descending the Design Funnel: Developing 10 Different Ideas and Refinements of Selected Ideas
      1. The 10 Plus 10 Method
      2. Design Challenge 1: Connecting Two Smart Phones
      3. Design Challenge 2
      4. Design Challenge 3
      5. You Now Know
  8. Section 2: Sampling the Real World
    1. Chapter 6: Introduction
    2. Chapter 7: Scribble Sketching: Rapidly Sketching Out Ideas – Anywhere, Anytime – to Capture the Essence of that Idea
      1. Capturing Ideas in Existing Systems
      2. Scribble Sketching in the Dark, While Doing Other Things
      3. Practicing Scribble Sketching
      4. You Now Know
    3. Chapter 8: Sampling with Cameras: Capturing Trigger Moments
      1. Sampling Objects That Irritate You and Others
      2. Sampling Compelling Designs
      3. Sampling Things That Inspire You
      4. You Now Know
    4. Chapter 9: Collecting Images & Clippings: Becoming a Semi-Organized Hunter/Gatherer
      1. Developing Your Collection
      2. Examples of Collections
      3. You Now Know
    5. Chapter 10: Toyboxes and Physical Collections: Collecting Physical Stuff
      1. Part One: Collecting Objects as Idea Triggers
      2. Collecting Objects to Build With
      3. Part Two: Storing Objects
      4. Part Three: Curating Your Objects
      5. Case Study: The Buxton Collection
      6. You Now Know
    6. Chapter 11: Sharing Found Objects: Seeing Each Other’s Collections to Encourage Conversation
      1. Sometimes things are private
      2. Managing Sharing/Privacy Issues Around Sketching and Collecting
      3. You Now Know
  9. Section 3: The Single Image
    1. Chapter 12: Introduction
    2. Chapter 13: Warm Up to Sketching: A Sketching Exercise You Can Always Learn From
      1. An Exercise in Line Quality
      2. You Now Know
    3. Chapter 14: Sketching What You See: An Exercise on Drawing Accurately
      1. An Excercise in Drawing What You See
      2. Part 1: Drawing From Your Imagination
      3. Part 2: Copy a Drawing of a Person
      4. Part 3: Drawing What You Actually See
      5. Comparing the Results
      6. You Try
      7. You Now Know
    4. Chapter 15: Sketching Vocabulary: Drawing Objects, People, and Their Activities
      1. People Who Sketch on Computers
      2. Learning How to Sketch
      3. Comic Storytelling
      4. You Now Know
    5. Chapter 16: The Vanilla Sketch: Basic Elements Of A Sketch: Drawing, Annotations, Arrows and Notes
      1. The Drawing
      2. You Now Know
    6. Chapter 17: The Collaborative Sketch: Sketching to Brainstorm, Express Ideas and Mediate Interaction
      1. The Interactive Fridge
      2. Actions and Functions of Collaborative Sketching
      3. Gestures: Sketching with Others
      4. You Now Know
    7. Chapter 18: Slideware for Drawing: Exploiting Commonly Available Digital Presentation Tools for Sketch Drawing
      1. Sketching in Slideware
      2. Digital vs Paper-Based Sketching
      3. Digital Collaboration
      4. You Now Know
    8. Chapter 19: Sketching with Office Supplies: Using Commonly Available Office Supplies to Create Editable Sketches
      1. The Versatile Sticky Note
      2. Interacting with Office Supplies Over Time
      3. Using Office Supplies with Others
      4. You Now Know
    9. Chapter 20: Templates: Pre-Draw the Constant, Non-Changeable Parts of Your Sketch as a Template that You Can Use and Reuse
      1. Appropriating Photos
      2. More on Layers
      3. Back to Paper
      4. Another Example: a Web Page Template
      5. You Now Know
    10. Chapter 21: Photo Traces: Create Collections of Sketch Outlines that Form the Basis of Composed Sketches
      1. Creating a Photo Trace
      2. Using the Photo Traces
      3. You Now Know
    11. Chapter 22: Hybrid Sketches: Combining Sketches With Photos
      1. You Now Know
    12. Chapter 23: Sketching with Foam Core: Sketching in a Physical Medium
      1. Method 1: Sketching a Novel Interface for a Digital Watch
      2. Method 2: Using Photos to Prototype Existing Devices
      3. You Now Know
  10. Section 4: Snapshots in Time: The Visual Narrative
    1. Chapter 24: Introduction
    2. Chapter 25: Sequential Storyboards: Visually Illustrating an Interaction Sequence Over Time
      1. The Sequential Storyboard
      2. You Now Know
    3. Chapter 26: The State Transition Diagram: A Way to Visually Illustrate Interaction States, Transitions and Decision Paths Over Time
      1. A Storyboard as States and Transitions
      2. Transition Diagram with Branches
      3. You Now Know
    4. Chapter 27: The Branching Storyboard: Visually Illustrating Interaction Decisions Over Time
      1. The Cell Phone Example
      2. The Interactive Shopping System Example
      3. You Now Know
    5. Chapter 28: The Narrative Storyboard: Telling a Story About Use and Context Over Time
      1. A Vocabulary of Camera Shots and Film Making
      2. Method 1: Sketching Storyboards
      3. Method 2: Photo-Based Storyboards
      4. You Now Know
  11. Section 5: Animating the User Experience
    1. Chapter 29: Introduction
    2. Chapter 30: The Animated Sequence: Animating a Single Interaction Sequence of Registered Images
      1. The Slide Show
      2. The Registration Problem
      3. The Solution: Registering Images
      4. You Now Know
    3. Chapter 31: Motion Paths: Smoothly Animating Movement Emphasizes the Feeling of Interaction
      1. Explore Your Animation Tools
      2. Other Animation Tools
      3. You Now Know
    4. Chapter 32: Branching Animations: Animating Different Interaction Paths in a Branching Sequence
      1. Selecting Alternative Interaction Paths Through Hyperlinks
      2. You Now Know
    5. Chapter 33: Keyframes and Tweening: Creating More Complex Animations
      1. Some Definitions
      2. Example: Adobe Flash
      3. You Try
      4. You Now Know
    6. Chapter 34: Linear Video: Using a Movie to Illustrate an Interaction Sequence With Paper
      1. Recording The Movie
      2. Variations: Paper and Transparency
      3. You Now Know
  12. Section 6: Involving Others
    1. Chapter 35: Introduction
    2. Chapter 36: Uncovering the Initial Mental Model: Discovering How People Initially Interpret Your Sketched Interface From its Visuals
      1. Case Study: Usability of a Fax Machine
      2. Uncovering the Mental Model
      3. You Now Know
    3. Chapter 37: Wizard of Oz: A Human ‘Wizard’ Controls How Your Sketch Responds to a Person’s Interactions
      1. Example 1: The Listening Typewriter
      2. Example 2: Robotic Interruption
      3. Example 3: The Fax Machine
      4. You Now Know
    4. Chapter 38: Think Aloud: Discovering What People are Thinking as they Use Your Sketched Interface
      1. Steps of Think Aloud
      2. You Now Know
    5. Chapter 39: Sketch Boards: Arrange Your Sketches On Poster Boards to Share them With Others
      1. Preparation Method 1: Foam Core Poster Sheets
      2. Preparation Method 2: Sticky Notes and Whiteboards
      3. Share Your Sketches with Others
      4. You Now Know
    6. Chapter 40: The Review: Presenting Your Ideas and Getting Others to Critique Them
      1. The Elevator Pitch
      2. The Desktop Review
      3. The Meeting
      4. The Formal Review (or the Crit)
      5. You Now Know
  13. Index