Information Architecture

Organizing content

1. Information Architecture

2. CSS | Dreamweaver

3. Using Morae – usability testing software

Today’s objectives

Marcus AmorosoJoseph BadaczewskiAaron WangAshleigh NegriChristine CastilloJulie CiaramellaAndrew CunninghamCharles DietzAmanda Henderson

Melia HerrmannKaitlyn JohnstonMegan KnightPatrick MulhollandNathan PhillipsMarjorie RishelRowland RudolfCaroline VotasLingjuan WangTamer Barham

Tuesday, October 20 Thursday, October 22

Highmark Usability lab tourOct. 20 & 22 | 4:20 – 5:45 PM

Must have ID.

Driver - KaitlynDriver - Andrew

SOURCE: http://www.usability.gov/methods/process.html

www.usability.gov

Information Architecture

An introduction

Background

Web users spent 27 seconds on each Web page. On average users spent 1 minute 49 seconds

visiting a Web site before they moved on. Users revisited sites infrequently. A site has only a 12% probability for being revisited

- once you’ve lost your user, you’ve lost him/her.

Source: Nielsen & Loranger, 2006

Content area

Top of page

Left-handColumn

Right-handColumn

Footer

Where users clicked on Web pages to navigate elsewhere. (p. 35)Users spend most of the time looking at content.

Source: Nielsen & Loranger, 2006

Usability issues

Almost ¾ of usability issues people encounter relate to basic user goals: finding, reading, and understanding information.

Issues that stopped users in their tracks: Search Find-ability (IA, category names, navigation, links) Page Design (Readability, layout, graphics, scrolling) Information (content, product info, corporate info, prices) Task support (workflow, privacy, forms, comparison, inflexible) Fancy design

Source: Nielsen & Loranger, 2006

Search

Findability

Page design

Information

Task support

Fancy design

Other

Issues that stopped users in their tracks

Source: Nielsen & Loranger, 2006

Information foraging theory

Cost/benefit assessment of achieving a goal where cost is the amount of resources consumed when performing a chosen activity and the benefit is what is gained from engaging in that activity.

Source: http://www.interaction-design.org/encyclopedia/information_foraging_theory.html

Information foraging theory

Users make tradeoffs based on:

1. The gain they expect from a specific information nugget (e.g., Web page).

2. The likely cost to discover and consume that information.

What gain can I expect by clicking MORE or Click for Details

Information foraging theory

Developed by Stuart Card, Peter Pirolli

Analogy of animals looking for food to analyze how humans collect information online.

Humans basically lazy – conserve energy - might be survival-related (don’t exert yourself unless you have to).

People want max. benefit for min. effort.

Source: Nielsen & Loranger, 2006

Peter Pirolli, (2007). Information Foraging Theory: Adaptive Interaction with Information (Oxford University Press)

Information foraging theory

Information patches: The temporal and spatial nature in which information is clustered.

Information scents: Determination of information value based on navigation cues and metadata.

Information diet: Decision to pursue one information source over another.

Source: http://www.interaction-design.org/encyclopedia/information_foraging_theory.html

Information foraging theory

Information Scent. User’s perception of the value, cost, or

access path of information sources obtained from the proximal cues, such as links.

Source: http://www.infovis.net/printMag.php?num=153&lang=2

http://www.interaction-design.org/encyclopedia/information_foraging_theory.html

Information foraging theory Information scent: users estimate their hunt’s likely

success.

Users assess whether their path exhibits cues related to the desired outcome.

Informavores keep clicking as long as they sense they’re “getting warmer”

Scent must keep getting stronger or they will give up. Progress must be rapid to be worth the effort required to reach their goal.

Ways to enhance information scent:1. Links and category descriptions explicitly

describe what users will find at the destination.

2. Users need to clearly identify the trail to the information and see that other trails are not right path to find information.

3. Don’t use made-up words or slogans as navigation options. Plain language also works best for search engine visibility.

Ways to enhance information scent:4. Remind users that they

are still on the path to the food as they drill down the site.

5. Provide feedback about their location and how it relates to their tasks.

Information Architecture

IAers design spaces for human beings to live work and play in.

IAers look at business needs, user habits/behaviors, technology attributes, and then create a blueprint for how to organize information/website to meet users informational needs.

http://articles.sitepoint.com/article/architecture-defined

Information Architecture

Information Architects can borrow from an architecture discipline called wayfinding.

Wayfinding employed in disorienting places such as malls, airports, and subways - helps people get from one point to another.

Goals of wayfinding to let people know: Where they are Where the things they’re looking for are located How to get to those things they seek

http://www.youtube.com/watch?v=W0VYRev7_bQ

Questions users ask and designers need to answer.

1. Am I in the right place? (Where am I?)

2. Do they have what I’m looking for?

3. Do they have anything better?

Can I buy speakers here?

1. Am I in the right place?

What we do: Show the range of your offerings. Show what your Website has to offer.

Your organizational scheme needs to: orient people (this is a Website about X) tell users where to go - these are the pages

you can explore.

1. Am I in the right place?

Clues to indicate location. Logos remind people whose site they are on Headers Breadcrumbs Navigation bar that shows where you are Color-coded sections

Where They Are

2. Do they have what I’m looking for? Where are they hiding it? Wayfinding – hints and clues used to figure out where

we are and where we’re going. Four key elements of wayfinding:

Familiar organization system. Use an organization structure that is familiar to the user. E.g., online grocery store is organized as bakery, dairy, produce, meats, etc.

Use obvious labels. A label is a signpost to help people find something. Do not use catchy terms. (e.g., Stop sign)

Navigation that looks like navigation Let people know where they are on the site and where they

came from. Let them know how to get back.

Chill Dude!

Imagine if…• Familiar organization system?• Use obvious labels?• Use Conventions?

Do they have what I’m looking for? Where are they hiding it?

Ask yourself: “What do the bulk of the visitors coming to

my site want?” “What do I want them to be able to find

easily?” Keep these items in front of users as they

travel the site.

Do they have what I’m looking for? Where are they hiding it?

Global navigation

Do they have what I’m looking for? Where are they hiding it?

Global navigation

Do they have what I’m looking for? Where are they hiding it?

Global navigation

Do they have what I’m looking for? Where are they hiding it?

Global navigation

3. Do they have anything better?

See also - provide users a shortcut to related items.

See also is more useful if it links to a range of related items.

Do they have anything better?