The Secret to Successful Design Sketches

Before any ZURBian dives into traditional wireframes, we sketch. We sketch *a lot.* We sketch so much that we made our own OmniGraffle "sketch sheet" template for faster sketching. The more we sketched, the more we realized we had something really great here, a tactic that has very powerful results if presented right. Here's the real kicker: **the secret to successful design sketches is actually just drawing more of less.** In other words, design sketches only become that powerful with the right presentation with as few lines as possible. Presenting complicated sketches to clients is a confusing time sink that has no real value to you as a designer. **Conveying as many ideas as possible with the least amount of effort is what makes your sketches valuable**, not only to you, but your clients as well. Sketching like this helps break ideas wide open, and keeping them simple means they're more abstract and conceptual. That means you can easily riff on ideas until you're ready to execute on them with hifi wireframes and designs, keeping you agile up to the very last minute. Let's take a look at a few examples of effective design sketching. ####Navigation: Box, dash, dash, dash. Navigation provides structure, and although the purpose of navigation is relatively straight forward, it can be incredibly complex at times. When you're sketching, keep it as minimal as possible and focus on the key usability elements of a successful navigation: simple labels and an active state to show where users are in the site. ####Headings and Text: Nothin' but lines. When sketching copy of any kind, headings or body text, a series of lines is often all that you know. Keeping it as simple as possible once again is the key to understanding what these lines represent, but they also keep you honest when it comes to writing that content. We like to help people discern body text from headings by varying our use of squiggly lines over straight lines. Large squiggly lines or empty long rectangles are for headings because they garner more attention while smaller straight, parallel lines are for body text. ####Process and Workflows: One box at a time. It's often important to convey a short workflow or set of pages in one sitting. For that, the best presentation is in showing them all on one page, separating each step with its own box. Get scrappier at this point and show even less detail around the key flow you're trying to illustrate. ####Make It Thick: Sharpies for the win. Chicken scratch never works when it comes to sketching. Feel free to use a finer point to convey your points as notes on the sketch, but keep things as thick as possible. This helps keep you in the "rough" mindset, ignoring some of the finer details to help focus on the bigger picture. ####Depth and Prominence:
Cool shading. Although we advocate keeping things as simple as possible, **presentation is everything**. A little shading goes a long way towards making a sketch more visually pleasing, as well as feeling more authentic. Depth perception and differentiation between blocks of content can be aided by even the smallest amount of Letraset grayscale markers. It helps mimic the styles and visual presence most elements get in the real world, once design implementation starts. And there you have it—five quick tips for simpler, faster, and more effective design sketching. We use these techniques in our own sketches every day. It's become an invaluable service for our clients, **allowing us to explore a vast magnitude of ideas with low investment and high value**. Next time you're sketching ideas, think about your techniques just a little more to help simplify the message and add more value to your time and effort.