Sketching is a critical part of the User Experience Design process. Sketching allows us to explore ideas and iterate on concepts quickly and easily before creating detailed mockups. Below is a roundup of many different sketching articles, tools, templates, presentations, videos, books, and examples to help User Experience Designers learn more about sketching and how it benefits UX design.
Articles about Sketching
- Shades of Grey: Thoughts on Sketching: Will Evans describes the role sketching plays in his design process and how sketching can help us explore problem spaces whose borders have not been fully defined.
- Sketch, Sketch, Sketch: Joshua Brewer explains the value of sketching as it relates to rapid ideation and idea exploration in this 52 Weeks of UX article
- Sketchboards: Discover Better + Faster UX Solutions: Brandon Schauer of Adaptive Path explains the technique of sketchboarding and how it can act as a collaborative tool to discuss ideas with clients and other members of the design team.
- Telling your website’s story with sketchboarding: Andrew Maier describes sketchboarding as a way of mapping out interaction flows and shaping the stories that they tell in this UX Booth article.
- Sketching: The Secret Sauce of Design: At the bottom of this Johnny Holland report from the UXLX conference, David Malouf summarizes his workshop that explored what sketching is and how it can be applied in different contexts.
- Wireframe 101: Sketch First, Wireframe Later: Mary Shaw explains the importance of always sketching first before you wireframe.
- The Joy of Sketch : explorations in hand-crafted visuals: Kate Rutter of Adaptive Path explains how sketching can be used for hand drawings, graphic facilitation, mind mapping, sketchnoting, and other applications.
- Pencils Before Pixels: A primer in hand-generated sketching: Mark Baskinger explains how sketches can be powerful and persuasive representations of ideas, events, sequences, systems and objects in his Interactions Magazine article (note: subscription needed to download the full article).
- Sketching in the Digital Age: Olen Ronning discusses the relevance of sketching in the digital age and the benefits sketching has for the entire team.
- The Fine Art of Wireframes: T. Scott Stromberg introduces the sketch as a legitimate IA tool that can increase focus and understanding of creative direction.
- Sketching Design: Yan Schober describes various types of sketches that can be used in the design process and the value that each type provides the designer.
- Bill Buxton: Sketching versus Sketchiness, what’s the difference for UX design?: Joel Eden writes about Bill Buxton’s concept of “sketchiness” and how it relates to creating low fidelity representation of ideas and generating many ideas quickly.
- Sketches and Wireframes and Prototypes! Oh My! Creating Your Own Magical Wizard Experience: Traci Lepore writes about elements of sketching and how it fits into the greater design process in this UX Matters article.
- To Sketch or Not To Sketch? That is the Question: Erik Ford talks about sketching as it relates to the visual design process and how it can make you a more efficient designer.
- The Sketching Process: Learning From a Cartoonist: Kevin Vigneault discusses how UX designers can apply cartoonist techniques to their own design planning process.
- Software Tool Design: Design by Sketching: Stephen Chambers talks about how sketching can be seen as a different approach to solving software design problems.
- Innovate Successful Products: Sketch!: Phil Barrett writes about the practical benefits of sketching including evolving ideas by having a constructive conversation with yourself, and to get input with less politics, cost, and risk.
Sketching Tools
- The (Sketchy) Tools of our Trade: Ann McMeekin displays her sketching tools including Stabilo 88 pens, Sharpies, Copic Ciao markers, and Letraset Tria markers.
- UX Sketching Tools: Dereck Johnson reveals his tools of choice including a Moleskine notebook, Post-It Notes, Sharpries, fine liner pens, and Stabilo Point 88 pens.
- Tools for Sketching User Experiences: Jason Robb shares an in-depth look at sketching tools including why ink is better than graphite, what makes a great marker, what makes a quality notebook, and the value of paper templates.
- MBTI Sketching Paper for Ideation: Henk Wijnholds shares custom MBTI sketching paper for use in ideation sessions.
- Konigi’s Notepads: Michael Angeles offers several different notepads for storyboards and wireframes.
- Sketching: Nathanael Boehm shares his artifacts he creates during the design process and the tools used to create them.
- Sketching Tools: Jackson Fox shares three components of his sketching toolkit including Faber-Castell Pitt artist pens, fine red and black pens, and yellow highlighters.
- Gifts for User Experience Geeks 2009: Nick Finck’s article lists many gifts for UX designers including a great list of paper products, drawing surfaces, and sketching instruments.
Sketching Templates
- A Collection of Printable Sketch Templates and Sketch Books for Wireframing: Ivana Jurčić shares a highly comprehensive list of printable sketch templates for websites and mobile applications, sketch books, and how to make your own sketch templates
- Free Printable Sketching, Wireframing and Note-Taking PDF Templates: Paul Andrew of Smashing Magazine provides an excellent list of ready to print sketching, wireframing, and note-taking templates.
- Idea Sketch Sheets: Sara Summers shares a unique way of accompanying sketches with idea descriptions, intended feelings, possible formats, and requirements.
- Sketchboard Templates: Todd Zaki Warfel provides 8 up and single page templates that can be used for storyboarding.
- Adaptive Path 6-Up Multi Page Template: (PPT) Adaptive Path’s 6 up template for quick iterations or storyboarding.
- Adaptive Path 1-Up Single Page Template: (PPT) Adaptive Path’s 1 up single page template for more detailed sketching.
- iPhone UX Sketch Templates: Erik Loehfelm shares his iPhone sketching templates based off of Adaptive Path’s 6-up template.
- Sketchbooks of a Web Developer: Brad Reiken shares printable browser templates and other sketch templates.
Presentations about Sketching
- Sketchboards: Good Design Faster: (PDF) Brandon Schauer shares his sketchboarding presentation from the CanUX 2008 conference
- See -> Sort -> Sketch: Pen & Paper Tools to get from Research to Design: Kate Rutter’s workshop slides from the 2010 IA Summit.
- Talking About Sketching About Interacting: Christopher Fahey discusses the sketch “resolution spectrum” and how sketches can communicate your thinking.
Videos about Sketching
- Johnny TV Features: Drawing Ideas and Communicating Interaction: Mark Baskinger talks about drawing ideas and shares his thoughts about how interaction designers can use sketching to communicate their designs better.
- Sketching & Paper Prototyping: Todd Zaki Warfel talks about his intensive, iterative ideation sessions with clients followed by why you should sketch and prototype.
- UX London redux video: Frances Eida on sketching: Frances Eida explains who should be sketching, when they should be sketching, and what they should be sketching.
- Bill Buxton: Sketching User Experiences: Bill Buxton talks about the importance and power of sketching user experiences.
- The Right Way To Wireframe: Will Evans, Todd Zaki Warfel, Russ Unger, and Fred Beecher display their wireframing process and how sketching fits into their processes.
- Hanmail Paper Prototype: An example of how sketching can be a powerful tool in creating paper prototypes.
Books about Sketching
- Sketching User Experiences: Getting the Design Right and the Right Design: Bill Buxton covers sketching and early prototyping methods and provides a wide range of case studies that demonstrate the principles and methods.
- The Back of the Napkin (Expanded Edition): Solving Problems and Selling Ideas with Pictures: Dan Roam reveals that everyone is born with a talent for visual thinking, and explains how thinking with pictures can help you discover and develop new ideas.
- Beyond Words: A Guide to Drawing Out Ideas: Milly Sonneman shares techniques to use drawing to enhance your communication skills and communicate ideas.
Sketching Examples
- 18 Great Examples of Sketched UI Wireframes and Mockups: Henry Jones shares many examples of early mockups and sketches to inspire other designers.
- Wireframes Magazine: This blog frequently posts sketching techniques, examples, and case studies to demonstrate how sketching can be used in the wireframing process.
- Flickr Group Pool: User Experience Sketches: A collection of User Experience sketches in a Flickr community.
- User Experience Sketches: Ahmed Riaz provides a collection of sketches across many different contexts.
- The Paper Version of the Web: Sean Flannagan shares Examples of early sketches from many well known websites and applications.
If you have any other sketching resources to share, please share them in the comments!
Because sketches are faster, require less overhead, and by their nature are perceived to be less ‘done,’ they are better suited to the task-artifact cycle of design exploration. They should be considered an effective modeling process for designers to be able to conceive and predict the consequences of certain design arguments during the design ideation phase and subsequently leading to better design. – Will Evans
No related posts found.
Catriona Cornett
