Our Thinking

Sketching To Make Great User Experiences

Posted by Peter Mah on Oct 29, 2012 11:32:59 AM

Wireframe sketchA Google search for design definition will bring up: “A plan or drawing produced to show the look and function or workings of a building, garment, or other object before it is built or made.” This process can be observed in other creative design activities such as storyboarding for a film, creating an outline for a written article, and sketching outlines for a painting on canvas. For our work as user experience designers (UXD), we can look at sketching as one of several ways to describe how something will function before the process of development starts.

Sketching is a powerful tool and thought process for user experience designers, project members and stakeholders on a development project because it facilitates multiple solutions quickly, helps us understand what we are building by allowing us to physically engage in the design process, and gives us the right amount of fidelity, while being very cheap to do.

Sketching Is a Powerful Design Tool

Its free form nature allows us to make mistakes in our design more quickly than using a wireframing or diagramming application on your computer. Instead of figuring out what tool to use to create a UI component or task flow, you can quickly just pick up a pen and draw a rough outline of it on paper or the whiteboard. Its rough sketch format allows for the open conversations to happen within a project.

Also, it doesn't have the appearance of being a final design, so project members and stakeholders will feel more free to provide input or make changes. Sketching is so easy even children understand how to do it. Its power lies in its simplistic nature and low barrier to use. And because one does not need to be a talented artist to draw simple shapes and lines, everyone is able to participate in the collaborative sketching process.

Sketching is a Thought Process

In first year Art College, I was required to keep a daily sketchbook. At the time, I didn't understand how important sketching could be for design. I did some halfhearted sketching, but without much success. My viewpoint of what sketching is used for was wrong, as I was trying to make every drawing a work of art. If I couldn't make it perfect, I didn't have any interest in drawing it. What I didn't understand was that the process of sketching daily and putting down on paper what I was seeing was the main goal. It was about learning to train my mind to make a connection with what I was drawing. For user experience design, some people might suggest just opening up an application such as Microsoft Visio, but it adds an extra UI layer between you and the diagram. The value of sketching out user experience designs, whether it's a wireframe, interaction, or task flow, is that it allows us to think through these things directly onto paper or whiteboard.

Sketching Provides Multiple Solutions Quickly

Simple shapes and lines are all that’s needed to sketch designs
Simple shapes and lines are all that’s needed to sketch designs

Sketching is a quick and easy way to generate ideas and solve design problems as a user experience designer. If you were working on a new user account screen, think about how in a few seconds you could draw a few simple boxes on the whiteboard and be immediately able to start that conversation about the design requirements and different interactions that will need to take place. And because it so fast, we can easily go through different options, iteratively and at minimal cost in time and effort.

Leonardo da Vinci generated ideas and observations over thousands of pages of sketches. His journals of drawings documented the world around him. The variety of drawings he made covered human anatomy, architecture, portraits, inventions – even a helicopter and a tank.

In the early stages of a project, a user experience designer will need to generate multiple solution ideas quickly. Instead of spending extra time in a desktop application to do the work, a designer can quickly go through several designs quickly and discard them just as fast if they don't work.

Sketching Helps us Understand

Sketching makes it easy to collaborate on design
Sketching makes it easy to collaborate on design

The act of sketching helps us to understand what we're designing and the problems we're trying to solve. The physical act of picking up the pen and moving it around the blank canvas of paper or whiteboard, in collaboration with other team members, helps improve our understanding. Being able to look at different design solutions visually on paper or a whiteboard makes it easier to ask the right questions and understand exactly how things will work.

When you look at a list of written requirements, it can be a challenge to understand them because they are still abstract concepts until you can visually translate how they will work. Eventually, you'll see user experience design deliverables such as task flow diagrams, wireframes, user interactions, etc. However, a first step is to sketch them out visually and see if our understanding matches what is being described in the requirements for the project.

Low Fidelity vs. High Fidelity for Sketching

The fidelity of your understanding for a solution should match your design tool. Sketching is a low fidelity type tool and process which is useful for designers (and any other project member) to draw out concepts visually in order to check them against what is being described in the project requirements.

Early on in a project, your understanding of business requirements and its users will be low, so using sketching as a tool and process to bring about design explorations and options will be more effective in user experience design. As you and your project team's understanding increases, switching to a higher fidelity tool such as a wireframing application or diagramming tool makes sense because the ideas and concepts are clearer and more concrete for everyone. When you come up against new problems, it makes sense to switch back to low fidelity and start sketching again, even though you may be in the advanced stages of detailed wireframes with annotations.

The Cost of Sketching is Cheap

The tools for sketching are just pen and paper (or whiteboard) and are relatively cheap when compared to the time and effort required to use a desktop application such as Microsoft Visio. It does not replace these types of applications in your toolkit, but adds to them. Its cost is low because you can generate many ideas in a very short amount of time and discard designs as fast as you can draw them. Within an hour you can sketch out several ideas, concepts, and interactions to describe initial high level requirements on a project. This all helps everyone on the project team to further their understanding of what is being built and why.

Summary

Sketching is an important and powerful tool and process for user experience designers and team members on projects using various development processes. It's so easy to use that it allows everyone to participate in the design process, which helps us to build the right solution for the business and its users. Because it is so simple, we might underestimate the value it can provide in the design process. The more powerful desktop applications we use in our design process don't necessarily translate to the most value all the time. Sketching is not about making pretty pictures; it’s about helping us all describe – iteratively and visually – what will be built and how.

Topics: Design, Usability

Our Thinking - The Online Blog is a source for insights, resources, best practices, and other useful content from our multi-disciplinary team of Onliners.

Subscribe to Blog Updates

Recent Posts