philthy

Don’t Make Me Click
Aza Raskin - aza@mozilla.com

to the user, the interface is the product

the best interface is no interface (NFI = no fucking interface)

what’s better than a shovel? a hole

90% of the feature requests for Word are for features that already exist - the difference is a usable feature

google calculates, track packages, searches discography, track flights and a lot more all from one interface element - so much functionality packed into a minimal interface

mouseover/tooltip requires interaction from the user - instead of just being able to see it and use it, we’re forcing them to interact

what we need are ZIAs - zen internet/interface applications: “act without doing”

when interaction goes up, information density comes down because the user has to click to get information. less content, less users

paging is held over from databases - give me x number of results sort of call; we want to avoid showing the user the database model!

don’t force users to ask for more content, just give it to them

dynamically loading more content to the bottom of the page as the user scrolls — scrolling down already has this semantic of going back in time or going down for more results (this is an example of removing interaction)

when interaction goes down, content and users go up

what else can scroll simplify?’
bret victor - scroll tabs (http://worrydream.com)

www.flashearth.com - more usable than google earth because there is no concept of levels

www.songza.com

google calendar event add form looks like a database model - www.30boxes.com is a better implementation of the add event form

“your personality is nothing but a thin veneer over your underlying implementation”;

every time you force a user to make a choice they don’t care about, then you have failed as a designer!

Designing Information
Ahn Dang
Nirali Patel

information visualization
1 visual representation of data
interactive
amplifies cognition

visualization highlights patterns and relationships in the data

patterns and relationships pull together a common knowledge to help you understand what the information is we’re looking at

assign data types, for example from conference attendees:
quantitative: #of attendees
nominal: gender, city, state, country
ordinal: city, state, country (can be multiple data types)

map data types to visual features
position saturation
length hue …

mackinlay’s visual features (look up chart)

by assigning hue saturation to a data type, you can visually display data saturation

adding interactivity - information seeking mantra
- overview first: high level overview/representation
- zoom and filter - allows you to zoom into a particular aspect
details on demand - get more info that might not have been pertinent at the high level

map on visual variable of length (cool way to talk about it)

www.gapminder.org

get your data and understand your data types, map it to these visual variables

the appropriate display type is a whole other discussion, this is about understanding your data

infosthetics (blog)
many eyes - IBM data visualization tool

email anh.dang@avenuea-razorfish.com for a copy of the presentation (and that mackinley diagram)
animation is another visual feature (motion) — gapminder uses motion and that is a good example

Dramatic Features
Chris Conley

designing drama into the interface

catching people’s imagination

an exciting, emotional, or unexpected series of events or set of circumstances

we know these four components of product design:
function - does it work
usability - can people use it
aesthetics - is it nice to look at
drama - is it meaningful <– focusing on this

pixar - pure resonance with people, they work on a film straight from start to finish (no powerpoints or email flurries or requirements lists) and build a billion dollar business every time they make a film

software production should be more like film production!

the analytical/verbal has taken over the creative/tangible through things like market research - the two should be pretty equal

interaction is choreographed

iphone state change — wiggling of icons (state, not mode) - this wiggling creates personality, delight, and an emotion about the experience

wiggling, flicking (interesting interactions!)

the state and transition is embodied in the experience

dimensions of drama:
context and staging
character(s) (apple’s wiggling icons become “they”)
goal or purpose
action/reaction/behavior - common form of dramatic storeytelling
emotion (all of them)
what happens in the real world

your elements are characters
(similar principles in game design)

recognize the value of criticism, taking that criticism and using it to go back and make your work better - we’ve lost this in our companies, people are too invested in defending their ideas

take people’s ideas, listen to them all and don’t commit to do or not do any of them, take all those ideas back to your drawing board to make the work better