Lecture 26 Information Architecture SIMS 202 Information Organization

Lecture 26: Information Architecture SIMS 202: Information Organization and Retrieval Prof. Ray Larson & Prof. Marc Davis UC Berkeley SIMS Tuesday and Thursday 10: 30 am - 12: 00 pm Fall 2002 http: //www. sims. berkeley. edu/academics/courses/is 202/f 02/ IS 202 – FALL 2002. 12. 03 - SLIDE 1

Announcements • Extra Credit due date extended until December 13 IS 202 – FALL 2002. 12. 03 - SLIDE 2

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 Study Credit for some of the slides in this lecture goes to Warren Sack and Abbe Don IS 202 – FALL 2002. 12. 03 - SLIDE 3

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 Study Credit for some of the slides in this lecture goes to Warren Sack and Abbe Don IS 202 – FALL 2002. 12. 03 - SLIDE 4

Task = Information Access The standard interaction model for information access 1) 2) 3) 4) 5) 6) 7) 8) Start with an information need Select a system and collections to search on Formulate a query Send the query to the system Receive the results Scan, evaluate, and interpret the results Stop, or Reformulate the query and go to Step 4 IS 202 – FALL 2002. 12. 03 - SLIDE 5

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? IS 202 – FALL 2002. 12. 03 - SLIDE 6

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 IS 202 – FALL 2002. 12. 03 - SLIDE 7

List of Sources • Have to guess based on the name • Requires prior exposure/experience IS 202 – FALL 2002. 12. 03 - SLIDE 8

Old Lexis-Nexis Interface IS 202 – FALL 2002. 12. 03 - SLIDE 9

Overviews • Supervised (manual) category overviews – Yahoo! – Hi. Browse – Me. SHBrowse • Unsupervised (automated) groupings – Clustering – Kohonen feature maps IS 202 – FALL 2002. 12. 03 - SLIDE 10

Yahoo! Interface IS 202 – FALL 2002. 12. 03 - SLIDE 11

Mesh. Browse (Korn & Shneiderman 95) IS 202 – FALL 2002. 12. 03 - SLIDE 12

Hi. Browse (Pollitt 97) IS 202 – FALL 2002. 12. 03 - SLIDE 13

Scatter/Gather Interface IS 202 – FALL 2002. 12. 03 - SLIDE 14

Kohonen Feature Maps on Text IS 202 – FALL 2002. 12. 03 - SLIDE 15

HCI for IR: Query Specification • Question 2: How will a user specify a query? IS 202 – FALL 2002. 12. 03 - SLIDE 16

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? IS 202 – FALL 2002. 12. 03 - SLIDE 17

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? IS 202 – FALL 2002. 12. 03 - SLIDE 18

Form-Based Query Specification IS 202 – FALL 2002. 12. 03 - SLIDE 19

Form-Based Query Specification IS 202 – FALL 2002. 12. 03 - SLIDE 20

HCI for IR: Viewing Results • Question 3: How will a user scan, evaluate, and interpret the results? IS 202 – FALL 2002. 12. 03 - SLIDE 21

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 IS 202 – FALL 2002. 12. 03 - SLIDE 22

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 IS 202 – FALL 2002. 12. 03 - SLIDE 23

Tile. Bars Example IS 202 – FALL 2002. 12. 03 - SLIDE 24

VIBE (Olson et al. 93, Korfhage 93) IS 202 – FALL 2002. 12. 03 - SLIDE 25

Info. Crystal (Spoerri 94) IS 202 – FALL 2002. 12. 03 - SLIDE 26

Problems with Info. Crystal • 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 IS 202 – FALL 2002. 12. 03 - SLIDE 27

Cha-Cha (Chen & Hearst 98) • Shows “Table. Of-Contents”like view, like Super. Book • Focus+Context using hyperlinks to create the TOC • Integrates Web Site structure navigation with search IS 202 – FALL 2002. 12. 03 - SLIDE 28

HCI for IR: Query Reformulation • Question 4: How can a user reformulate a query? IS 202 – FALL 2002. 12. 03 - SLIDE 29

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 IS 202 – FALL 2002. 12. 03 - SLIDE 30

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 • 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 IS 202 – FALL 2002. 12. 03 - SLIDE 31

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 Study Credit for some of the slides in this lecture goes to Warren Sack and Abbe Don IS 202 – FALL 2002. 12. 03 - SLIDE 32

Approach to User Interface Design points of view politics of information Information Architecture Interaction Design scenarios Media Design Storytelling (narrative structures) IS 202 – FALL 2002 From Abbe Don, 202 Lecture 2001 2002. 12. 03 - SLIDE 33

Information Architcture • What is information architecture? – Definition – Practitioners – Examples – Brainstorming exercise – Elements IS 202 – FALL 2002. 12. 03 - SLIDE 34

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 21 st 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 IS 202 – FALL 2002. 12. 03 - SLIDE 35

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 IS 202 – FALL 2002. 12. 03 - SLIDE 36

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… IS 202 – FALL 2002. 12. 03 - SLIDE 37

Examples of Information Architecture • • Wurman’s Access Guides Spiekermann’s subway maps Macaulay’s books Carbone Smolan’s museum signage Newspapers Phone books websites IS 202 – FALL 2002. 12. 03 - SLIDE 38

Access Guides • Guide books for cities • Information organized by location, colored coded by category – Where am I now? – What’s near by? IS 202 – FALL 2002. 12. 03 - SLIDE 39

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? IS 202 – FALL 2002. 12. 03 - SLIDE 40

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 Study Credit for some of the slides in this lecture goes to Warren Sack and Abbe Don IS 202 – FALL 2002. 12. 03 - SLIDE 41

Elements of information architecture • • • Organization systems Labeling systems Navigation systems Search and indexing systems Metaphor systems Audience analyses IS 202 – FALL 2002. 12. 03 - SLIDE 42

Elements of Information Architecture * * * * Organization system Search System * Navigation System IS 202 – FALL 2002 * *= major labels 2002. 12. 03 - SLIDE 43

Organization Systems • Ways to Organize Information (according to Wurman) LATCH – – – Location Alphabetical Time Category Hierarchy/Continuum (small to large, dark to light) IS 202 – FALL 2002. 12. 03 - SLIDE 44

Organization Systems • Ways to Organize Information – – – Topics Tasks Processes Metaphors Narratives Audiences IS 202 – FALL 2002. 12. 03 - SLIDE 45

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) IS 202 – FALL 2002. 12. 03 - SLIDE 46

Types of Labels • • Labels as indexing and search terms Link labels Labels as headings Labels within navigation systems (e. g. , pull down menus) • Icons IS 202 – FALL 2002. 12. 03 - SLIDE 47

Sources of Labels • • Other web sites Controlled vocabularies/thesauri From content From experts and users IS 202 – FALL 2002. 12. 03 - SLIDE 48

Navigation Systems • Types – Hierarchical – Global – Local – Other? • Information access methods including social navigation, berrypicking, etc. IS 202 – FALL 2002. 12. 03 - SLIDE 49

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. IS 202 – FALL 2002. 12. 03 - SLIDE 50

Environment of Navigation • Browser as environment – Back button – Forward button – History – Bookmarks – Link colors – Alternative browsers (e. g. , Active. Worlds, VMRL, Shredder, Web Stalker, etc. ) IS 202 – FALL 2002. 12. 03 - SLIDE 51

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) IS 202 – FALL 2002. 12. 03 - SLIDE 52

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) IS 202 – FALL 2002. 12. 03 - SLIDE 53

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) IS 202 – FALL 2002. 12. 03 - SLIDE 54

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) IS 202 – FALL 2002. 12. 03 - SLIDE 55

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. IS 202 – FALL 2002. 12. 03 - SLIDE 56

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) IS 202 – FALL 2002. 12. 03 - SLIDE 57

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 Study Credit for some of the slides in this lecture goes to Warren Sack and Abbe Don IS 202 – FALL 2002. 12. 03 - SLIDE 58

The Process of Information Architecture • Rosenfeld and Morville, Information Architecture, chapters 8 and 9 • Abbe Don’s lecture from IS 202, 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 (IS 213) IS 202 – FALL 2002. 12. 03 - SLIDE 59

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 IS 202 – FALL 2002. 12. 03 - SLIDE 60

Case Study • Don and Co. example from Abbe Don (Abbe Don Interactive, Co) from IS 202 Lecture, Fall 2001 IS 202 – FALL 2002. 12. 03 - SLIDE 61

Edward Don & Company IS 202 – FALL 2002. 12. 03 - SLIDE 62

Edward Don & Company • • 80 year-old, privately held family business 6 distribution centers $400 million in sales 20, 000 stock items 1000 s of factory direct items 100 s of vendors 100 s of Customers with 1000 s of locations – – National franchises Hotels and Cruise Ships Institutions Sole proprietors IS 202 – FALL 2002. 12. 03 - SLIDE 63

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 IS 202 – FALL 2002. 12. 03 - SLIDE 64

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 IS 202 – FALL 2002. 12. 03 - SLIDE 65

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 IS 202 – FALL 2002. 12. 03 - SLIDE 66

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 IS 202 – FALL 2002. 12. 03 - SLIDE 67

System Components Purchasing Warehouse Inventory AS 400 Invoices Payments Sales Force Automation DAM IS 202 – FALL 2002 App Server templates Web ecommerce Quark Express Extensions Print 2002. 12. 03 - SLIDE 68

Taxonomy (catalog at www. don. com) • KITCHEN – COOKWARE • Stock Pots – – heavy weight standard weight stainless steel lids • Sauce Pots – heavy weight – standard weight – lids IS 202 – FALL 2002. 12. 03 - SLIDE 69

Manage the Business vs Communicate With Customers • AS 400 optimized for managing the day to day operations of the business – category/class/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) IS 202 – FALL 2002. 12. 03 - SLIDE 70

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 IS 202 – FALL 2002. 12. 03 - SLIDE 71

The Big False Assumptions • The AS 400 classification system was accurate and consistent • The AS 400 classification system contained all the business logic necessary to run the business, including generating marketing communications materials • EY built web architecture and databased on AS 400 system • Image, Inc. assumed AS 400 classification as basis of DAM database design IS 202 – FALL 2002. 12. 03 - SLIDE 72

The Bearer of Bad News • Class/subclass was ok • Things below that were a mess • A lot of “human translation” was done between the AS 400 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 IS 202 – FALL 2002. 12. 03 - SLIDE 73

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) • AS 400 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. ” IS 202 – FALL 2002. 12. 03 - SLIDE 74

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 IS 202 – FALL 2002. 12. 03 - SLIDE 75

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 IS 202 – FALL 2002. 12. 03 - SLIDE 76

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 IS 202 – FALL 2002. 12. 03 - SLIDE 77

Web Challenges • Setting up order guide with customerdefined categories • Setting up order guide with customerdefined 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. IS 202 – FALL 2002. 12. 03 - SLIDE 78

Next Time • Review for Final – Bring questions IS 202 – FALL 2002. 12. 03 - SLIDE 79