2002.12.03 - SLIDE 1IS 202 – FALL 2002

Lecture 26: Information Architecture

Prof. Ray Larson & Prof. Marc Davis

UC Berkeley SIMS

Tuesday and Thursday 10:30 am - 12:00 pm

Fall 2002http://www.sims.berkeley.edu/academics/courses/is202/f02/

SIMS 202:

Information Organization

and Retrieval

2002.12.03 - SLIDE 2IS 202 – FALL 2002

Announcements

• Extra Credit due date extended until December 13

2002.12.03 - SLIDE 3IS 202 – FALL 2002

Lecture Overview

• Review– Interfaces for Information Retrieval– Web Search for Intranets (Guest)

• Information Architecture– What is information architecture?– Elements of information architecture

• Organization systems• Labeling systems• Navigation systems• Search and indexing systems• Metaphor systems• Audience analyses

– Case StudyCredit for some of the slides in this lecture goes to Warren Sack and Abbe Don

2002.12.03 - SLIDE 4IS 202 – FALL 2002

Lecture Overview

• Review– Interfaces for Information Retrieval– Web Search for Intranets (Guest)

• Information Architecture– What is information architecture?– Elements of information architecture

• Organization systems• Labeling systems• Navigation systems• Search and indexing systems• Metaphor systems• Audience analyses

– Case StudyCredit for some of the slides in this lecture goes to Warren Sack and Abbe Don

2002.12.03 - SLIDE 5IS 202 – FALL 2002

Task = Information Access

The standard interaction model for information access

1) Start with an information need2) Select a system and collections to search on3) Formulate a query4) Send the query to the system5) Receive the results6) Scan, evaluate, and interpret the results7) Stop, or8) Reformulate the query and go to Step 4

2002.12.03 - SLIDE 6IS 202 – FALL 2002

HCI Questions for IR

• Where does a user start? – Faced with a large set of collections, how can

a user choose one to begin with?

• How will a user formulate a query?

• How will a user scan, evaluate, and interpret the results?

• How can a user reformulate a query?

2002.12.03 - SLIDE 7IS 202 – FALL 2002

Starting Points for Search

• Faced with a prompt or an empty entry form … how to start?– Lists of sources– Overviews

• Clusters• Category Hierarchies/Subject Codes• Co-citation links

– Examples, Wizards, and Guided Tours– Automatic source selection

2002.12.03 - SLIDE 8IS 202 – FALL 2002

List of Sources

• Have to guess based on the name

• Requires prior exposure/experience

2002.12.03 - SLIDE 9IS 202 – FALL 2002

Old Lexis-Nexis Interface

2002.12.03 - SLIDE 10IS 202 – FALL 2002

Overviews

• Supervised (manual) category overviews– Yahoo!– HiBrowse– MeSHBrowse

• Unsupervised (automated) groupings – Clustering– Kohonen feature maps

2002.12.03 - SLIDE 11IS 202 – FALL 2002

Yahoo! Interface

2002.12.03 - SLIDE 12IS 202 – FALL 2002

MeshBrowse (Korn & Shneiderman 95)

2002.12.03 - SLIDE 13IS 202 – FALL 2002

HiBrowse (Pollitt 97)

2002.12.03 - SLIDE 14IS 202 – FALL 2002

Scatter/Gather Interface

2002.12.03 - SLIDE 15IS 202 – FALL 2002

Kohonen Feature Maps on Text

2002.12.03 - SLIDE 16IS 202 – FALL 2002

HCI for IR: Query Specification

• Question 2: How will a user specify a query?

2002.12.03 - SLIDE 17IS 202 – FALL 2002

Query Specification

• Interaction styles (Shneiderman 97)– Command language– Form fill– Menu selection– Direct manipulation– Natural language

• What about gesture, eye-tracking, or implicit inputs like reading habits?

2002.12.03 - SLIDE 18IS 202 – FALL 2002

Command-Based Query Specification

• COMMAND ATTRIBUTE value CONNECTOR …– FIND PA shneiderman AND TW interface

• What are the ATTRIBUTE names?

• What are the COMMAND names?

• What are allowable values?

2002.12.03 - SLIDE 19IS 202 – FALL 2002

Form-Based Query Specification

2002.12.03 - SLIDE 20IS 202 – FALL 2002

Form-Based Query Specification

2002.12.03 - SLIDE 21IS 202 – FALL 2002

HCI for IR: Viewing Results

• Question 3: How will a user scan, evaluate, and interpret the results?

2002.12.03 - SLIDE 22IS 202 – FALL 2002

Display of Retrieval Results

• Goal: – Minimize time/effort for deciding which

documents to examine in detail

• Idea:– Show the roles of the query terms in the

retrieved documents, making use of document structure

2002.12.03 - SLIDE 23IS 202 – FALL 2002

Putting Results in Context

• Interfaces should – Give hints about the roles terms play in the

collection– Give hints about what will happen if various

terms are combined– Show explicitly why documents are retrieved

in response to the query– Summarize compactly the subset of interest

2002.12.03 - SLIDE 24IS 202 – FALL 2002

TileBars Example

2002.12.03 - SLIDE 25IS 202 – FALL 2002

VIBE (Olson et al. 93, Korfhage 93)

2002.12.03 - SLIDE 26IS 202 – FALL 2002

InfoCrystal (Spoerri 94)

2002.12.03 - SLIDE 27IS 202 – FALL 2002

Problems with InfoCrystal

• Can’t see proximity or frequency of terms within documents

• Quantities not represented graphically

• More than 4 terms hard to handle

• No help in selecting terms to begin with

2002.12.03 - SLIDE 28IS 202 – FALL 2002

Cha-Cha (Chen & Hearst 98)

• Shows “Table-Of-Contents”-like view, like SuperBook

• Focus+Context using hyperlinks to create the TOC

• Integrates Web Site structure navigation with search

2002.12.03 - SLIDE 29IS 202 – FALL 2002

HCI for IR: Query Reformulation

• Question 4: How can a user reformulate a query?

2002.12.03 - SLIDE 30IS 202 – FALL 2002

Query Reformulation

• Thesaurus expansion– Suggest terms similar to query terms

• Relevance feedback– Suggest terms (and documents) similar to

retrieved documents that have been judged to be relevant

– “More like this” interaction

2002.12.03 - SLIDE 31IS 202 – FALL 2002

Summary: HCI for IR

• Focus on the task, not the tool• Be aware of

– User abilities and differences– Prior work and innovations– Design guidelines and rules-of-thumb

• Iterate, iterate, iterate

• It is very difficult to design good UIs• It is very difficult to evaluate search UIs• Better interfaces in future should produce better

IR experiences

2002.12.03 - SLIDE 32IS 202 – FALL 2002

Lecture Overview

• Review– Interfaces for Information Retrieval– Web Search for Intranets (Guest)

• Information Architecture– What is information architecture?– Elements of information architecture

• Organization systems• Labeling systems• Navigation systems• Search and indexing systems• Metaphor systems• Audience analyses

– Case StudyCredit for some of the slides in this lecture goes to Warren Sack and Abbe Don

2002.12.03 - SLIDE 33IS 202 – FALL 2002

Storytelling(narrative structures)

Information Architecture

Approach to User Interface Design

Interaction Design

MediaDesign

points of view

politics of information

scenarios

From Abbe Don, 202 Lecture 2001

2002.12.03 - SLIDE 34IS 202 – FALL 2002

Information Architcture

• What is information architecture?– Definition– Practitioners– Examples– Brainstorming exercise– Elements

2002.12.03 - SLIDE 35IS 202 – FALL 2002

What is information architecture?

• Information Architect: n. 1) the individual who organizes the patterns inherent in data, making the complex clear. 2) a person who creates the structure or map of information which allows others to find their personal paths to knowledge. 3) the emerging 21st century professional occupation addressing the needs of the age focused upon clarity, human understanding and the science of the organization of information.– Richard Saul Wurman, Information Architects, 1996

2002.12.03 - SLIDE 36IS 202 – FALL 2002

Who is an information architect?

• Avi Rappaport

• Abbe Don

• Peter Merholz

• Jesse James Garrett

• Lou Rosenfeldt

• Peter Morville

• ASIS&T SIGIA members

• Many, many others

2002.12.03 - SLIDE 37IS 202 – FALL 2002

Who is not (necessarily) an information architect?

• Marketing team

• Graphic designers

• Editors

• Technical staff

• Project management

• I.e., the rest of the team that an information architect works with…

2002.12.03 - SLIDE 38IS 202 – FALL 2002

Examples of Information Architecture

• Wurman’s Access Guides

• Spiekermann’s subway maps

• Macaulay’s books

• Carbone Smolan’s museum signage

• Newspapers

• Phone books

• websites

2002.12.03 - SLIDE 39IS 202 – FALL 2002

Access Guides

• Guide books for cities

• Information organized by location, colored coded by category– Where am I now?– What’s near by?

2002.12.03 - SLIDE 40IS 202 – FALL 2002

Brainstorming Exercise

• Louis Rosenfeld and Peter Morville, Information Architecture for the World Wide Web, 1998.– What do you hate about the Web?– What do you like about the Web?

2002.12.03 - SLIDE 41IS 202 – FALL 2002

Lecture Overview

• Review– Interfaces for Information Retrieval– Web Search for Intranets (Guest)

• Information Architecture– What is information architecture?– Elements of information architecture

• Organization systems• Labeling systems• Navigation systems• Search and indexing systems• Metaphor systems• Audience analyses

– Case StudyCredit for some of the slides in this lecture goes to Warren Sack and Abbe Don

2002.12.03 - SLIDE 42IS 202 – FALL 2002

Elements of information architecture

• Organization systems

• Labeling systems

• Navigation systems

• Search and indexing systems

• Metaphor systems

• Audience analyses

2002.12.03 - SLIDE 43IS 202 – FALL 2002

Elements of Information Architecture

*

*

*= major labels

Organization system

*

*

**

***

**

**

*

**

Search System

Navigation System

2002.12.03 - SLIDE 44IS 202 – FALL 2002

Organization Systems

• Ways to Organize Information (according to Wurman) LATCH– Location– Alphabetical– Time– Category– Hierarchy/Continuum (small to large, dark to

light)

2002.12.03 - SLIDE 45IS 202 – FALL 2002

Organization Systems

• Ways to Organize Information– Topics– Tasks– Processes– Metaphors– Narratives– Audiences

2002.12.03 - SLIDE 46IS 202 – FALL 2002

Labeling Systems

• This passage quotes “a certain encyclopedia” in which it is written that “animals are divided into: (a) belonging to the emperor, (b) embalmed, (c) tame, (d) suckling pigs, (e) sirens, (f) fabulous, (g) stray dogs, (h) included in the present classification, (I) frenzied, (j) innumerable, (k) drawn with a very fine camelhair brush, (l) et certera, (m) having just broken the water pitcher, (n) that from a long way off look like flies.”– (Foucault citing Borges, The Order of Things, 1970)

2002.12.03 - SLIDE 47IS 202 – FALL 2002

Types of Labels

• Labels as indexing and search terms

• Link labels

• Labels as headings

• Labels within navigation systems (e.g., pull down menus)

• Icons

2002.12.03 - SLIDE 48IS 202 – FALL 2002

Sources of Labels

• Other web sites

• Controlled vocabularies/thesauri

• From content

• From experts and users

2002.12.03 - SLIDE 49IS 202 – FALL 2002

Navigation Systems

• Types– Hierarchical– Global– Local– Other?

• Information access methods including social navigation, berrypicking, etc.

2002.12.03 - SLIDE 50IS 202 – FALL 2002

Elements of Navigation Systems

• Graphical and textual navigation bars

• Frames

• Pop-up menus

• Tables of content

• Site maps

• Guided tours

• The sky’s the limit with java, javascript, etc.

2002.12.03 - SLIDE 51IS 202 – FALL 2002

Environment of Navigation

• Browser as environment– Back button– Forward button– History– Bookmarks– Link colors– Alternative browsers (e.g., ActiveWorlds,

VMRL, Shredder, Web Stalker, etc.)

2002.12.03 - SLIDE 52IS 202 – FALL 2002

Search and Indexing Systems

• Search– database versus text search– Good search engines can handle multiple notations– People are interested in searching db fields for

ecommerce– Synonyms

• mostly per domain• Inktomi includes American to British synonyms

– Interfaces• Basic search everywhere• Simple search page• Advanced search page with all options• Put “search” on the button• Integrate search with browsing

(from Avi Rappoport’s lecture of 27 Sept 2001)

2002.12.03 - SLIDE 53IS 202 – FALL 2002

Search and Indexing Systems

• Indexing problems– Avoiding indexing navigation text– Detect duplicate pages– Completeness

• Index everything• Hide the archive a little

– Freshness

(from Avi Rappoport’s lecture of 27 Sept 2001)

2002.12.03 - SLIDE 54IS 202 – FALL 2002

Search and Indexing Systems

• Analysis– Usability testing is generally not done, but

should be!– Informal testing is ok– Analyze search logs

• Store basic search data: query, number of results, date/time, IP address, or session ID

• Free market research! – Top searches– No matches– New topics and trends

(from Avi Rappoport’s lecture of 27 Sept 2001)

2002.12.03 - SLIDE 55IS 202 – FALL 2002

Metaphor Systems

• Organizational metaphors (e.g., website organized according to corporate structure)

• Functional metaphors (e.g., website organized like a libraries, with volumes, shelves, catalogs, etc.)

• Visual metaphors (e.g., website organized like a machine or a city)

2002.12.03 - SLIDE 56IS 202 – FALL 2002

Metaphor Systems

• Recall Lakoff and Johnson’s metaphors of embodiment and their use in cognitive mapping of websites (e.g., Maglio et al., 1999).

• E.g, how does one move in, up, down, etc. in navigating a website.

2002.12.03 - SLIDE 57IS 202 – FALL 2002

Audience

• Who is the website for?• How does one describe this audience?

– Scenarios– Personae (see Alan Cooper, About Face: The

Essentials of User Interface Design)• Goals and Tasks

• Enthnography (see Illinois Institute of Technology, Design Department)

• Usability studies (see Nielsen and Norman Group)

2002.12.03 - SLIDE 58IS 202 – FALL 2002

Lecture Overview

• Review– Interfaces for Information Retrieval– Web Search for Intranets (Guest)

• Information Architecture– What is information architecture?– Elements of information architecture

• Organization systems• Labeling systems• Navigation systems• Search and indexing systems• Metaphor systems• Audience analyses

– Case StudyCredit for some of the slides in this lecture goes to Warren Sack and Abbe Don

2002.12.03 - SLIDE 59IS 202 – FALL 2002

The Process of Information Architecture

• Rosenfeld and Morville, Information Architecture, chapters 8 and 9

• Abbe Don’s lecture from IS202, Fall 2001 (the part describing website design for Don Inc.)

• Newman and Landay (see IS 202 Lectures from 2000)

• See also, Marti’s User Interface Design and Development course syllabus (IS213)

2002.12.03 - SLIDE 60IS 202 – FALL 2002

Rosenfeld and Morville

• Brainstorming with whiteboards and flip charts• Metaphor exploration• Scenarios• High-level architecture• Architectural page mockups• Design sketches• Web-based prototypes• Detailed architectural blueprints• Content mapping• Web page inventory• Point-of-production architecture• Architectural style guides• Learning from users

2002.12.03 - SLIDE 61IS 202 – FALL 2002

Case Study

• Don and Co. example from Abbe Don (Abbe Don Interactive, Co) from IS 202 Lecture, Fall 2001

2002.12.03 - SLIDE 62IS 202 – FALL 2002

Edward Don & Company

2002.12.03 - SLIDE 63IS 202 – FALL 2002

Edward Don & Company

• 80 year-old, privately held family business• 6 distribution centers• $400 million in sales• 20,000 stock items• 1000s of factory direct items• 100s of vendors• 100s of Customers with 1000s of locations

– National franchises – Hotels and Cruise Ships– Institutions– Sole proprietors

2002.12.03 - SLIDE 64IS 202 – FALL 2002

Project Phases

• Initial Discovery– Interviewed key stakeholders in company– Observed day-to-day production in marketing group– Interviewed marketing group service vendors

• Best Practices Research– Interviewed other distribution businesses

• Grainger• Reliable• Staples/Quill

– Interviewed food service equipment & supplies vendors

– Interviewed key vendors in Digital Asset Management and dynamic web and print publishing systems

2002.12.03 - SLIDE 65IS 202 – FALL 2002

Project Phases

• Red Flags– Web/e-commerce was being handled by internal IT

departments– Print was handled by internal marketing/advertising– Vendors specialized or were optimized for web or

print but not well integrated for both

• White Paper and vision statement for dynamic publishing system for print and web acknowledging that challenges ahead were both technical and organizational

• Detailed Requirements for Print and Web Generated

2002.12.03 - SLIDE 66IS 202 – FALL 2002

Project Phases

• Consensus Building Internally

• Internal Web Team Formed

• Internal DAM Project Team Formed

• Parallel Development– RFP Written– Vendors Evaluated– Budgets and Schedules Established– Vendors Selected

2002.12.03 - SLIDE 67IS 202 – FALL 2002

Project Phases

• Project Kickoffs– Web Rapid Solutions Workshop with Ernst & Young

February, 2000– DAM proceeded at a much slower pace, focused

initially on training and work flow beginning March, 2000

• Weekly Status Meetings Held• Monthly Executive Team Meetings Held• Projects Quickly Diverged

– Web site had a hard deadline of May, 2000 for the National Restaurant Association show

– Web site team optimized for quick development– DAM team addressed systemic issues that had been

ignored for years– Yet, digital images were required for the web

2002.12.03 - SLIDE 68IS 202 – FALL 2002

System Components

AS400

Purchasing

WarehouseInventory

InvoicesPayments

Sales ForceAutomation

Web ecommerce

App ServertemplatesDAM

Print

QuarkExpress

Extensions

2002.12.03 - SLIDE 69IS 202 – FALL 2002

Taxonomy (catalog at www.don.com)

• KITCHEN– COOKWARE

• Stock Pots– heavy weight – standard weight – stainless steel – lids

• Sauce Pots– heavy weight – standard weight – lids

2002.12.03 - SLIDE 70IS 202 – FALL 2002

Manage the Business vs Communicate With Customers

• AS400 optimized for managing the day to day operations of the business– category/class/subclass/sub-subclass taxonomy– Merchandisers were responsible for an entire

category• 13 categories, 10 merchandisers• Each category managed in its own way• No consistency• Tabletop is an “uber” category composed of the dinnerware,

flatware, glassware categories

• DAM needed to be designed to support 3 primary print vehicles– Resource Catalog (merchandising/ordering)– Monthly Catalog (merchandising)– Custom Order Guides (ordering)

2002.12.03 - SLIDE 71IS 202 – FALL 2002

Merchandising versus Ordering

• Merchandising– Show products in context and in use: high production

value color photography– Show like products together with food styling,

ambiance, etc.– Table Top: shows flatware, chinaware, glassware,

linens– Descriptive copy + product attributes– Unpriced

• Ordering– Single items: often with custom names in custom

categories especially for national franchises– Black and white line drawing may be more appropriate– “Just the facts” = “Just the attributes” – Pricing

2002.12.03 - SLIDE 72IS 202 – FALL 2002

The Big False Assumptions

• The AS400 classification system was accurate and consistent

• The AS400 classification system contained all the business logic necessary to run the business, including generating marketing communications materials

• EY built web architecture and database based on AS400 system

• Image, Inc. assumed AS400 classification as basis of DAM database design

2002.12.03 - SLIDE 73IS 202 – FALL 2002

The Bearer of Bad News

• Class/subclass was ok• Things below that were a mess• A lot of “human translation” was done between

the AS400 and the marketing communications print materials to get them into “customer ready” form

• The internal owner of the classification system dug in his heels

• The two outside vendors blamed each other, denied responsibility and were reluctant to fix the problem

2002.12.03 - SLIDE 74IS 202 – FALL 2002

Resolving the Issues

• Could barely talk about the problem because everyone had a different vocabulary and understanding of the issues

• Created detailed HTML page mockups (live demo)• AS400 taxonomy changed to

category/subcategory/class/subclass• Entire taxonomy was reviewed and edited• Marketing Communications “presentation” model

which was previously thought to correspond to “class” was not in synch.

• Business Rules project initiated to synchronize “managing the business” and “communicate with customers.”

2002.12.03 - SLIDE 75IS 202 – FALL 2002

DAM Challenges

• Each item has more than one representation affiliated with it– Primary photo– Alternate views/angles– Line drawing– Group shot of the brand or pattern– Merchandising shot of the pattern in use, depicted

with other items, possibly in the same category and possibly not

• Each category, subcategory, and class requires different attributes

2002.12.03 - SLIDE 76IS 202 – FALL 2002

Web Challenges

• Classes of users have different needs, different levels of access

• Customer Users– Corporate– Regional Managers– Unit Manager– Multiple users within a unit--general– Multiple users within a unit based on categories– Administrators

• Internal Users– Administrators– Sales Team– Customer Service

2002.12.03 - SLIDE 77IS 202 – FALL 2002

Web Challenges

• Overall web information architecture, navigation and interaction design– Use Cases revealed many flaws in the EY database

design– User does x; system responds y– Provides detailed interaction model– Indicates how many screens/pages required– Indicates what needs to be on each page

• Specific taxonomy issues as they relate to product classification

• Synchronize the search feature

2002.12.03 - SLIDE 78IS 202 – FALL 2002

Web Challenges

• Setting up order guide with customer-defined categories

• Setting up order guide with customer-defined product names

• Setting up and maintaining favorites

• Supporting users as they move from “customized” view to “general” view

• Synchronizing ordering, picking, inventory availability notifications, shipping info, etc.

2002.12.03 - SLIDE 79IS 202 – FALL 2002

Next Time

• Review for Final– Bring questions