Menu

Beta — We’re reformatting our articles to work with the new site, but this is one hasn’t been done yet; it may contain formatting issues. No need to report this. We’re working on it.

Design – Exploring Options and Making Decisions

by Jared M. Spool
on November 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 3×5 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.

Exploring the Range of Options

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.

Looking for the Patterns

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.

Working Within A System

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.

Exploring to Refining

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.

Share Your Thoughts with Us

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.

About the Author

Jared M. Spool is the founder of User Interface Engineering. He spends his time working with the research teams at the company and helps clients understand how to solve their design problems. You can follow Jared on Twitter at @jmspool.