An Event Apart - With Great Power Comes Great Responsibility

28 Dec 2011

This is part of a series of posts summarizing my notes from the extraordinary conference An Event Apart, held December 12-14, 2011 at The Palace Hotel in San Francisco.

With Great Power Comes Great Responsibility @elliotjaystocks Designer, Author Description

Recent developments in web technologies like HTML5 and CSS3 have allowed us to build a richer web, full of advanced visual treatments like web fonts, animations, transformations, and drop-shadows. But have we got carried away with our new toys? Just because we can use a drop-shadow doesn’t mean we have to. In this new and often controversial talk, Elliot looks at solid design principles that will turn a good website into a great website, examines the scenarios where it’s better to stay away from unnecessary visual effects, and attempts to find the sweet spot in between the two extremes. “With great power comes great responsibility,” said Uncle Ben, and Spidey hadn’t even used border-radius!

Notes Introduction

Don't always focus on the latest tech, tools and trends. While useful, they don't automatically make good design.

*So much good stuff out there...* Nike Better World Webkit clock Nizo for iPhone *... and so much bad stuff, too* Destroy the Web 2.0 look

• Designers jumped on the trend for image gradients, gloss, rounded corners, etc. to make things look "real"
• Attention to detail is much more important than visual trends

Distraction of the "Real"

• Grunge textures, post-it notes, coffee stains, wooden backgrounds, ect.
• Wrong 3d effects - impossible shadows, gradients, texture, backgrounds
• Styling effects hiding bad basic design - grid, typography, composition

*Dan Norman's Affordances and Design*

What the designer cares about is whether the user perceives that some action is possible (or in the case of perceived non-affordances, not possible).

In product design...there can be both real and perceived affordances, and the two need not be the same. In graphical, screen-based interfaces, all that the designer has available is control over perceived affordances.

• Real and perceived affordances communicate interaction.
• Ex. If you are designing to look 3d, get it right. Otherwise people expect behaviors that don't exist in your design.
• Consider the context when deciding to make something look like a real-world object. (neg ex. Address Book on Lion)

Typography is (Almost) Everything

• 8 Faces - You only need a small number of fonts to do a lot.
• Learning from Print Design
• Try print work to inspire design principles on the web
• Working from the type outwards, allows you to focus on content first. Tim Brown: More perfect Typography Typograph: Scale & Rhythm Typecastapp
• Typography details make a much bigger impact on design than visual effects.

If 2010 was the webfont's incunabula, then it looks as though 2011 will mark its coming of age. -John Boardley

• Type has made strides recently, but there is still work to be done to make them look great everywhere.

It's a Journey Get inspired

• Go outside, read books, look outside the web
• Don't limit yourself to web galleries of other people's work
• The latest tech wont make you a better designer, outside inspiration will.

Constant journey of learning

• Trying
• Failing
• Trying Again

Use new power responsibly

• New tools are amazing, use them wisely

With Great Power Comes Great Responsibility. Act Accordingly.