Originally published: Nov 11, 2009
"It's not about the quality of the sketching," Leah Buley told her workshop's attendees, "but the variety and exploration of the idea that matters."
Leah was well into her Good Design Faster workshop when I snuck in the back and sat down. She had the full room of attendees rapt with attention, anxious to embark on the sketching exercise she was describing.
"The first sketches you make will be things we use and know. That's just human nature. We have to move beyond that, though, to explore new ideas."
Leah gave everyone sheets of what she calls "six-ups", a page with six 3x5 grids, each one roughly the proportions of an iPhone display. The assignment was to take 15 minutes and sketch as many different ideas for a mythical mobile phone application as possible.
I was catching Leah's seminar at this year's annual User Interface Conference in Boston, where she demonstrated her techniques for helping teams explore different design options. Far too often, she reminded us, a team will take the first design that comes to their mind and push it into development, without exploring the full range of available options.
Exploring options early on prepares a team for overcoming any hitches that happen down the road. Having tried out different design solutions, then talking through the pros and cons of each, the team will learn how to respond to different situations. As they move through the refinement and development process, they can draw upon their early thinking to resolve complications that crop up.
Leah's technique for exploring is simple: use simple tools to uncover different design solutions. One tool she calls Word Play, where she uses a list of design terms, such as "drag and drop", "accordian", and "pulldowns" as inspiration for different design approaches. "What if," Leah asks, "we were to try this same design with drag and drop capabilities? What would that look like?"
Another tool she calls Conceptual Frameworks. "When you are stuck, think about the opposites," Leah suggests. For example, where would your existing idea fit on a spectrum of two opposing extremes, say, being automatic to being manual? Once you decide where your current thinking is, what would a design look like if you moved to the other side of the spectrum?
With these tools, designers can quickly explore a range of ideas. Often, an innovative concept will emerge only after the designer has a breakthrough, pushing past the first obvious solutions.
Next, I wandered into another UI14 seminar, Information Architecture Essentials, just as Donna Spencer was sharing her IA Patterns -- common emergent structures that she's identified to solve a variety of design problems.
Donna showed how each type of pattern solved a different problem. A simple hierarchy, for example, which is a site comprised of a linked set of static pages, are great for small sites. However, a database site, allows the designers to build multiple access paths to the site's information through different attributes. Donna shared several common patterns, describing the uses and behaviors of each.
She told us how the information architect's job is to take these different patterns and explore the available options for their site's design. Much like the tools Leah was demonstrating, Donna's patterns can serve as inspiration during the design process.
For example, a designer could draw on both the simple hierarchy and the database patterns to create a site that provides a local theatre's event calendar. The history of the theatre and driving directions can exist in the hierarchy portion, while the various events are displayed from the database. Site visitors can select events by date, category, or pricing.
One striking aspect of Donna's patterns was the variety of implementations for each. The examples she showed for each pattern were varied in style and approach. It was clear that, while there were only a set number of structural alternatives, the final implementations wouldn't fall into a boring, cookie-cutter approach.
The patterns become a jumping-off point for the designers to craft a solution that will meet the needs of the users while still presenting a distinctive experience.
Next, I popped into Dan Rubin's Visual Design Essentials for Non-Designers, where he was explaining the fundamentals of a good visual design system. "When you have a system that works," Dan told the class, "you save a ton of time because you've already made many of the important decisions."
Dan walked us through a variety of the decisions that a visual designer needs to consider: padding & margins, size, emphasis, color, and typography, to name a few. He showed how the CNN site was using a consistent system of 6, 12, and 18 pixel padding and margins to lay out their pages, all based around a 12 pixel text height. Because they'd decided on these fundamentals, it was easy to make new pages using the same measurements.
Dan told us that most teams got themselves into trouble when they hadn't established their visual design system up front. Without the system, they spent more time on each page, only to end up with inconsistent results across the site.
Take the choice of color, for example. For many teams, color becomes a point of contention between the designer and the client, because the choice is hard to explain and seems subjective.
Dan's solution is to let the computer do the work. At the start of the project, he asks his clients to produce pictures that represent the style they want to project with the design. When they hand over their images, often gleaned from ads or online photo libraries, he uploads them into a color editor, such as Adobe's Kuler, to produce a set of recommended color palettes. Dan says his clients usually are very happy with the results and the colors look great.
The process of design starts with exploration, but ends with refinement. The best designers carefully move from one to the other, making sure they spend enough time exploring before locking themselves into a design approach.
However, once within that approach, they create a systematic method to their decision-making, so that each subsequent decision becomes easier. This helps significantly with integrating new contributors into the design process. By showing them the system and its underpinnings, the designer makes it easy to add new content and functionality to the original concept.
At the UI14 conference, I was surprised to hear how close Leah Buley, Donna Spencer, and Dan Rubin shared this same philosophy of design. It shows that our practice is maturing into something that produces great results in a predictable fashion. And that's a good thing.
At the User Interface 16 Conference, November 7-9, 2011, Brandon Schauer has a sketching component in his full-day workshops and how it relates to creating great designs. Find out more about Brandon's workshop, Good Design Faster and the other conference workshops at UICONF.com.
Do you have your own tricks for exploring design alternatives? If so, drop us a note in the comment section of the UIE Brain Sparks blog. We'd love to hear from you.
Read related articles: