Information design for the new web ellyssa kroski computers in libraries 2007.

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