SpoolCast: Visual Design for the Non-Designer

Jared Spool

October 9th, 2009

Duration: 41m | 22MB
Recorded: October, 2009
Brian Christiansen, UIE Podcast Producer
[ Subscribe to our podcast via Use iTunes to subscribe to UIE's RSS feed. ←This link will launch the iTunes application.]
[ Subscribe with other podcast applications.]
[ Direct Link to MP3 File ]

Play

What can a non-designer do to harness the power of visual design without calling professional help? Quite a lot, says internationally-regarded visual designer Dan Rubin. We called Dan to talk about what design techniques are accessible to mere mortals. He also gave us a preview of his day-long workshop for non-designers at our User Interface 14 Conference, this November.

Call it low hanging fruit, Dan says, but there are a lot of small, seemingly simple things that combine to have a strong, positive effect upon your site’s impact. If you’ve built with web standards, especially using CSS for style, these small changes can be trivial to execute across your site. Start with the spacing between elements. Consistency with the white space and alignment bring an important sense of order to your pages.

“Humans love patterns and order,” Dan tells us. Patterns and rules are tools pro designers use to organize page elements. Arbitrary placement leave sites looking cluttered and out of sorts. Creating rules — for example, the amount of space between certain elements — is something non-pros can do to bring order to a page. Choose a spacing and alignment scheme and stick to it. The earlier you set these rules and patterns, the easier it is to wrangle your page elements. Once rules are in place, you’re left with fewer arbitrary decisions to make. Arbitrary decisions are often the cause of disorder.

Massive gains can be made by addressing typographical issues. Proper typography establishes the hierarchy of information, guiding your visitors through your site content. Create a visual identity for a kind of content, and then use it consistently. Dan says most pro designers limit the number of typefaces (fonts) in a design to one or two; often one serifed face (Georgia is an example), and one sans-serif (Verdana is an example). From there, Dan advocates restraint, by making the smallest effective change to call attention to differences. Don’t combine large text, bold, italics, and color on one element where bold alone would have sufficed.

Color is a challenging topic. Many feel color choices are subjective, but there are considerations to consider. Using a color palette, like kuler.adobe.com, will help you pick colors that naturally work together… but if you already have brand colors, you should try to stick with them as much as practical. Remember, you can use black, white, and the spectrum of grays to accomplish a lot of your design’s heavy lifting. Be sure, when you do interject colors, to remember that they often have cultural, meanings. Dan used the example of red, in many cultures, representing a warning. Be wary of red in a context where it might lead a user to think they’re being warned when they are not. Try to work with these cultural perceptions instead of against them. Be sure to understand audience; those with color blindness and those from different cultures may literally view your colors differently.

Dan wanted everyone to remember that, in design, “We’re solving problems… but not for ourselves.” He also had another bit of advice, “When you design something right, no one will pat you on the back, because now it works like it’s supposed to.” That might be hard to accept initially, but it means you can make small changes without startling people. An adjustment to the line-height of your text might not be noticed by a regular reader, but they’ll find themselves more comfortably reading the content.

Dan has gathered all this advice and much more into his full-day User Interface 14 workshop, Visual Design Essentials for Non-Designers: Effortless Skills for High-quality Designs. It’s so full of enough valuable content, you’ll keep you tweaking your site for months to come.

Are you responsible for the visual design on your site, without pro-design resources? What effective steps have you found to improve your site? Let us know in the comments.

7 Responses to “SpoolCast: Visual Design for the Non-Designer”

  1. Jeff Says:

    I am a non-designer (programmer) who became responsible for a design project. I am 100% convinced that The Non-Designer’s Design Book by Robin Williams helped me produce something I can be proud of.

  2. SpoolCast: Visual Design for the Non-Designer » UIE Brain Sparks | Design Graphics Says:

    [...] See the original post here: SpoolCast: Visual Design for the Non-Designer » UIE Brain Sparks [...]

  3. Dan Rubin Says:

    @Jeff: That’s a great book — also worth a read from Robin: “The Non-Designer’s Type Book” and “The Mac is Not a Typewriter” (old, but still holds a lot of useful information).

  4. Things I Shared Today | Ferg's Blog Says:

    [...] User Research at YouTube – Particpatory Methods SpoolCast: Visual Design for the Non-Designer » UIE Brain Sparks Sketching in Hardware Some interesting projects (Part 2) Awakening Creativity with design thinking [...]

  5. Visual Design for the Non-Designer « Uxability Says:

    [...] I really enjoyed listening to Dan Rubin’s take on how non-designers (or non-artists) can still make a great contribution to the design process. [...]

  6. Weekend Reading #1 Says:

    [...] Visual Design For The Non-Designer [...]

  7. Diseño para no diseñadores | VectorEs Divergente Says:

    [...] un diseñador profesional para el desarrollo de la parte visual. En el podcast de Jared Spool, SpoolCast: Visual Design for the Non-Designer, Dan Rubin da algunos consejos simples para mejorar significativamente el diseño de un sitio web [...]

Add a Comment