Ellyssa Kroski, Reference Librarian, Columbia University
She blogs at infotangle
Looked at msn’s website circa 2000 – your eye doesn’t really center on anything
About.com – same type of thing
Google – early example of simple design – now the gold standard of web search
kodak from 2004 – it’s a photo sharing site, but it’s not apparent to the user. It’s not clear where to go if you want to share photos. Contrasted this with flickr – easy to see the photo sharing stuff
New Web
user experience is changing, user expectations, technology change… all resulting in information design
Guided by three principals:
simple
social
alternate navigation
Simplicity:
a more focused approach is better than lots of choices
many web 20 sites are leaving off certain functionalities to make the user experience better (showed Word with all the toolbars displayed, them showed google docs – only has what’s necessary)
necessary features only
les is more philosophy
low learning curves – users can start using these in less than five minutes
no software to install
no manual needed
no registration
It’s a DIY service model
Healia – focused and simple search engine
del.icio.us – social bookmarking – it’s obvious what this is for
43 things, too – it does one thing, and strives to be best at that one thing
design style responds to changes in application functionality – clean and simple design
Today’s websites:
centered design – more practical, more compatible with different screen resolutions
current trend – rounded corners – nothing too sharp or severe – reflects casual tone of new web
sans serif and lowercase fonts – related to rounded corners stuff
large fonts – points out important info
simple persistent navigation – often found running across the top, tends to be separate from page content
Bold logos
strong colors – highlights key concepts, creates distinction
complementary color schemes, not monochromatic
subtle 3d – drop shadows, mirrored surfaces, gradients
simple icons
whitespace – adding it instead of crowding page – this results in a fresh looking websites
starbursts – usually denotes that something is free
advances in user interface design:
AJAX – don’t have to reload the whole webpage
large tabs – easier to toggle between pages
drag and drop – netvibes, flickr, etc
autocomplete – the tags thing in del.icio.us as an example
advances in UI – Maps, WYSIWYG, previews (the nasty pop-up thing like Snap)
Social:
two trends:
1. socialization of media and applications
2. social for social’s sake
Socialization of Media and Applications
videos, photos, books, etc
Google Docs
Expectations:
Commenting: available pretty much everywhere
Rating and reviewing – users now expect this
send to a friend functionality
Share – sharing calendars, for example
subscribe – on the spot
Save
Websites can no longer be islands…
what are others saying? You can show this now
Sharing discoveries – ie., Digg
Creating New – people want to mashup your info
Social for Social’s Sake:
Ning, MySpace, etc
User profile is most important
User profile is a home base or a jumping off point
friends lists – critical functionality. Can be a badge of honor, can be a way to meet people you wouldn’t usually meet
Comments – function in a different way – these are the shout outs and chatter left on user profiles
communication – IM, LiveTalk, internal messaging system
Subscribe to users
groups – formation of subcommunities
Tools for personal expression – journals, blogs, uploading photos or videos, etc.
Alternate Navigation
new ways to navigate web content
visual representations of what’s important
we don’t read pages, we scan them…
Navigate by…
By User
Tag Cloud
The Top – most emailed, most blogged, most popular – interesting ways to slice up data about what’s interesting. Also provide an at-a-glance digest of what’s going on
The Zeitgeist – snapshot of what’s happening in a community – a dashboard of what’s important
related information – ie., related blogs and articles
heat maps – shows what’s hot and what’s not visually
relationship maps – shows visual connections between items
Time tools – relations by when something was uploaded to a website
Maps – Etsy’s geo-locator
widgets – a “what I’m watching” widget
mashups – users creating their own way to navigate information
Ellysa’s Principles of information design for the new web
make them simple
include necessary functionality
clean efficient design
make it social
offer alternate forms of navigation
Can you make it visual?
Evolve (everything is beta)
Be willing to respond to changes
cil2007
librarything
