Post on 20-Jan-2016
information design for the new web
ellyssa kroski
computers in libraries 2007
MSN
circa
February 29, 2000
About
circa
February 29, 2000
Google - Today
Kodak – May 25, 2004
Flickr - Today
The New Web
• User experience is changing– Changes in the way people consume
information– Changes in user expectations– Changes in technology
= Changes in information design
Information Design for the New Web
Simple
Social
Alternative Navigation
simplicity
•Simplicity of Web applications•Simplicity of design and style
“The fact that some choice is good doesn’t necessarily mean that more choice is better…there is a cost to
having an overload of choice.”
-The Paradox of Choice
Simplicity of Web Applications
• Necessary features only
• Less is more philosophy
• Low learning curve
Simplicity of Web Applications
• No software to install
• No manual needed
• No registration
= DIY service model
Healia Health Search
del.icio.us Bookmarking
43 Things Life Goals
Simplicity of Design
• Design style responds to changes in application functionality
• Clean and simple design
Centered Design
Centered Design
Rounded Edges
Rounded Edges
San Serif & Lower Case Fonts
Large Fonts
Large Fonts
Simple Persistant Navigation
Simple Persistant Navigation
Bold Logos
Strong Colors
Strong Colors
Complementary Colors
Complementary Colors
Subtle 3D
Subtle 3D
Reflective Surfaces
Reflective Surfaces
Simple Icons
Simple Icons
Whitespace
Whitespace
Starbursts
Advances in User Interface
• AJAX– An evolution in Web interface design which
allows information to be processed without reloading the page.
– Large Tabs– Drag-and-Drop– Autocomplete
AJAX – Large Tabs
AJAX – Drag & Drop
AJAX - Autocomplete
Advances in UI - Maps
Advances in UI - WYSIWYG
Advances in UI - Previews
Social
•Socialization of Media and Applications•Social for Social’s Sake
Socialization of Media and Applications
• Photos
• Videos
• Books
• News/Text
• Collaborative Applications– Basecamp– Google Docs & Spreadsheets
• Expectation of Interaction with Information
• Required Baseline of Social Functionality
Socialization Requirements & Expectations
Commenting
Rating & Reviewing
Send to a Friend
Share
Subscribe
Save
Websites can no longer be islandsUsers want bridges elsewhere
What are others saying?
Sharing Discoveries
Creating New
Social for Social’s Sake
• Social Networking Websites– Primary purpose is a sense of community and
connection with others.– User profile is the primary component of a
social networking application and the navigation revolves around it.
User Profiles
Friends Lists
Comments
Communication
Subscribe
Groups
Tools for Personal Expression
Alternate Navigation
Alternate Navigation
• New Ways to Navigate Web Content
• Visual Representations of What’s Important
“We don’t read pages, we scan them” – Don’t Make Me Think: A Common Sense Approach to Web Usability by Steve Krug
By User
The Tag Cloud
The Top
The Top
The Zeitgeist
Related Information
Heat Maps
Relationship Maps
Time Tools
Digg Labs
Maps
Widgets
Mashups
Ellyssa’s Principles of Information Design for the New Web
• Make it Simple– Include only necessary functionality– Clean efficient design
• Make it Social– Meet users expectations– Enable connections
• Offer Alternate Navigation– Reflect Zeitgeist– Offer visualizations
Closing Thoughts
• Evolve– The Perpetual Beta– Ethnographic development
• Be Nimble– Respond to changes/advances– Be willing to abandon bad ideas
• Be Open– Design Badges & Widgets– Issue an API
InfoTangle
Information Design for the New Web
http://infotangle.blogsome.com