Sketching is a great tool that you, too, can incorporate into your proverbial tool-belt for the web. Today, let's start with the basics of why sketching rocks, not only for web, UX, and strategy work but for working through many types of projects. In a future article, we'll dive further into the nitty-gritty: how to sketch, tools to use, and tips to sketch remotely.
It's Easy, Accessible, and Cheap to Sketch = ROI
From tools to time, it doesn’t take much to sketch out valuable visuals.
If you only take one point away from this article, it's this: sketching is an excellent tool because it's very fast, very light, and as a result, cheap. It's an artifact on the opposite end of the spectrum from labor-intensive polished digital comps, which often serve a very important, different purpose, but aren't the best tool when you need something more timely.
Anyone can sketch. Though people who identify as less" creative" folks may worry about their ability or feel hesitance toward sketching, the learning curve is actually quite low. We aren't creating fine art. Of course, this practice is especially relevant for designers; we have also found sketching beneficial when doing content strategy, managing projects and products, and understanding workflows.
Sketching doesn't require fancy, expensive tools. Of course, some folks have their pen and their whiteboard marker brand, and it's great that they found what works best for them, but don't let a lack of top-of-the-line equipment stop you. We've solved problems for clients using hotel room pens and printer paper.
Sketching Encourages Exploration and Iteration
It’s an easy way to generate a lot of ideas until you find THE idea.
Sketching is a great way to iterate on ideas. We love how easy it is to spin up a completely new version of something, without worrying about getting the header design in place up top, for example. You can draw on top of them. You can stack, tear, and reorder them to "Frankenstein" a modified version. You can make changes as a group. When we collaborate, our design team encourages "design swaps," where we hand sketches or other work over to a fellow designer to run with.
Depending on where you find yourself in a project, it can be tricky as a designer to get into significant changes, especially if they require moving around perfectly-assembled comp files with lots of variations. It can be hard to throw out a file you've put a lot of love into. In this way, it's better for sketches to be quick and ugly, because you can generate more lower-fidelity ideas faster, and then "kill your darlings" without all the heartbreak. Put another way; messiness is fine as long as your core idea is clear.
When working through design challenges, it's better to find issues as soon as you can, ultimately improving the finished product. Some clients are hesitant to give much feedback once we get into later design stages. Meanwhile, sketching allows you to get (many) ideas in front of your stakeholders quickly and find a path you all feel comfortable investing in. Designers: imagine a world without "I'll know it when I see it!" Project stakeholders: imagine a world without the "big reveal!"
Sketches Facilitate Quick Communication
The marker doodle is mightier than the long PDF.
Sketches, or any visual representations, are generally faster to parse and comprehend than long-form documentation. While it may be tempting to write a 70-page brief, a deliverable's value is ultimately determined by how much use a client gets out of it. Summaries of a few bullet points or quick diagrams are more likely to transfer knowledge than walls of text.
As a result, sketches can be both faster to create and faster to review, requiring less cognitive load and mental energy overall. Visuals are especially valuable over language in a multi-lingual team, or one without an established vocabulary, to bypass verbiage. They are also great across time, sharing ideas asynchronously, or simply reminding yourself of a previous conversation.
One excellent example of this is a three-day workshop that took place in a San Francisco conference room. On the first day, we covered the whiteboards in notes from discussions about goals, constraints, research insights, and all kinds of conversations. On the second day, we referenced these visuals like a cheat sheet, for example, checking personas while we card-sorted branding and tone aspirations. We did the same while we sketched wireframes, and so on, filling the empty wall spaces with each activity. On the third day, we stood in the middle of our squiggly chaos, sharing feelings of accomplishment and confidence in making intentional design decisions.
Sketching is Collaborative (even if only one of you has a marker)
Relying on verbal conversation alone can obscure disagreement.
Last but certainly not least is the ability of sketch-noting to highlight differences in understanding. This is huge, especially during discovery or scope definition while planning; sometimes, everyone thinks they agree, but in reality, people are picturing something different in their heads. For example, as one design meeting began to wrap, we boxed out a chunky wireframe in marker, then asked the group to review the sketch of this "agreed-upon-layout." The quick feedback was enough to show us that we weren't all on the same page quite yet.
Sketching is a powerful collaborative exercise when you can empower everyone on the team; stakeholders, developers, et al., to draw out their ideas, too. Everyone's perspective is vital during blue-sky thinking, to create something with that perfect balance of wonderful and technically feasible. However, the reality is that you often have to match your activities to the comfort level of the group. Sometimes you can solve this, and cover more ground, by splitting up into groups to sketch, each with at least one participant that's confident with a Sharpie. Other times, it's okay to be the only one sketching. You can still empower the team by visualizing their intentions and facilitating progress by being the marker for the group.
Sketching Fits Into Many Project Phases
Sketching is also versatile. We've found this process especially helpful during initial engagements, when we're getting to know a team and their problems, but have been pleasantly surprised to find value much further along. To protect us all from a long rant about design processes atop a soapbox, let's look instead at a shortlist of recent situations where our team found sketches beneficial:
- Taking notes (for yourself or others)
- On-site client workshops (facilitating group conversations)
- Goal setting and project planning
- Getting a sense of scope
- Generating ideas (brainstorming and sketch sessions)
- Presenting ideas quickly for feedback (especially if you're choosing from multiple options, or want to show flexibility or variation examples)
- Summarizing important decisions (reducing assumptions and sharing asynchronously)
- Content modeling (illustrating or validating data presentation)
- Wireframing or other layout examples
- UX flows (such as personas, scenarios, interactions, or animations)
- Visualizing quickly with a variety of maps and graphs (sitemaps, Venn diagrams, mind-mapping, user journies, etc.)
- Communicating designs and functionality to development (grooming, ticketing, and flagging risks)
Okay, maybe that wasn't particularly short, but it's not exhaustive either.
Obligatory Disclaimers
If you do start sketching more, keep in mind that sketching won't suffice for All The Things, so make sure you have support for such a lean artifact. For example, we've found it best to compliment sketched wireframes with a pattern library or other digital documentation for style, to inform design decisions absent from hand-made artifacts.
In other words, express your intentions to gauge the comfort levels of your production teams and clients before diving in. It's so important to plan together and set expectations so that no one is scratching their head during a handoff. Ask what everybody needs, or doodle an example and then ask.
Live Long and Doodle
This process is not just for sketching wireframes. We've leveraged this to create user flows, journey maps, data and governance workflows, content relationships, product maps, and more. Get creative about where you might apply this practice to your work or something else in your life. We'd love to see examples if any brave souls want to share!
An ugly thumbnail sketch is often all that’s needed.
I'll start. I completed this 14-second sketch on the back of a sheet of stamps while watching a YouTube tutorial. It's ugly, my drawing teacher would lose it over my ellipses, but that's fine. Because this drawing was not what I was delivering, instead, it allowed me to quickly and clearly execute the actual deliverable. In this case, it was a Halloween costume I made, for a dog, as the accidental coffee cup from Game of Thrones. Don't worry; it was very cute.