Etech - The Future of UI in a Web 2.0 World
Notes from Data vs. Design: The Future of UI in a Web 2.0 World, by Scott Berkun.
Perception: what do I see
Cognition: what does it mean
Desire: what do I want
Mechanism: how do I get it
The above is based on human APIs, not tech APIs... they apply to anything.
Example: Vending machines
- old-school, push button of thing I want
- new school, you see the thing (which is good), but involves lots of cognition. You need to make a mapping between the item and a random alphanumeric code to get the item. This is bad, because memory is expensive.
Fitts' Law (rough guide): it's harder to target things that are further away & smaller in size.
This goes largely unknown, but granular movements are not trivial.
Movable Type (emerging tech of the year, 1455)
- Gutenberg bible page. Gutenberg designed his bible to be read out loud. It has narrow columns, so it's easy to keep your place.
Visual anchors are important. Scott shows two menus: one has centered text, and the other has everything left-justified. It's much harder to read the centered menu because there are no visual anchors.
We read online much slower online than we do on paper. The NY Times helps the eye speed through text. You have to pay attention to this stuff if you're designing a site that's data-driven.
Berkun talks about Delicious, and walks through cleaning up the UI.
- simple trick, any time you have data that is similar and on different lines, you should left-justify it
- make text readable through use of colors
- value of data is relative, so we don't need words, can use colors instead, which doesn't need real estate
Berkun rips Tufte's chart of Napoleon's March to Russia and back. The information resolution is high, but the point isn't always to understand as much as possible, as it is to be simple and deliver only the necessary data.
Quote: "Lists are the cockroach of design."
Lots of map mashups aren't good, because the map isn't key to understanding the data. One exception is HousingMaps.com, which helps the user orient themselves to the city.
Tag CloudsScott then goes off on the O'Reilly Radar sidebar. He asks:
What problem are we trying to solve? Why are these bits here?
Good answers to those questions are that the tag cloud helps people get to things of interest, it makes it easy to group posts, it helps users quickly locate specific topics, and it helps users understand what this site is about.
Answers that are questionable because they help the designer, not the user: it uses 2D space in a creative way, it makes the site look interesting, and it is interesting experimentation (which you shouldn't do with your customers!)
The presentation strays waaaaay off course here, as people start defending the tag cloud. It was too bad, because this was a great presentation.
- skill with human apis are as important as tech
- data should serve desires through design
- cool is always easier than good
- good design conserves attention
- all data needs good ui design