INFM 700: Session 1 What is Information Architecture? Paul Jacobs The iSchool University of Maryland...

INFM 700: Session 1

What is Information Architecture?

Paul JacobsThe iSchoolUniversity of Maryland

Monday, August 31, 2009

This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 United StatesSee http://creativecommons.org/licenses/by-nc-sa/3.0/us/ for details

http://creativecommons.org/licenses/by-nc-sa/3.0/us/

iSchool

Today’s Topics Overview of course

The architecture analogy

Information architecture: topics and issues

Course administration and logistics

Course overview

The archtecture analogy

IA topics and issues

Courseadministration

iSchool

Information Architecture What is it? (for starters)

Architecture – structural design [of web sites] to support function and form

Information – organized [electronic] content

So our goal is to master the design of web sites for organizations that effectively deliver information to their users

Course overview




iSchool

Good Information Architecture Users find what they need (e.g., information

content)

Users get what they need (e.g., a book, a plane reservation, a stock trade)

Users learn what they need (e.g., how to install a driver, use a piece of software)

Users don’t waste time

Users are happyCourse overview




iSchool

Good Information Architecture Organizations have happy users/customers

Organizations make money/save money

Organizations get their message across

Organizations can keep things going and make changes when necessary

Organizations are happyCourse overview




iSchool

Bad Information Architecture Users can’t get what they want/need, are

confused or frustrated

Users go away or go to a competitor’s site

Organizations waste/lose money or fail to gain revenues/clients/users

Organizations are unhappy

We get firedCourse overview




iSchool

Information Architecture: Tools and Techniques (Examples)

Understanding the user experience (e.g., user studies, card sorting, search log analysis)

Vocabulary and labeling systems

Organization/navigation aids and tools (e.g. navigation bars, menus, site index, hierarchies/hypertext, breadcrumbs)

Search engines

Design tools (e.g., wireframes, blueprints)

Course overview




iSchool

Information Architecture: Business and Process

Information architecture strategy

Business processes

Build vs. buy

Team composition and skills

Course overview




iSchool

Information Architecture: Segue What is it? [from the text]

The structural design of shared information environments

The combination of organization, labeling, search, navigation systems within Web sites and intranets

The art and science of shaping information products and experiences to support usability and findability

An emerging discipline and community of practice focused on bringing principles of design and architecture to the digital landscape

Now let’s consider the architecture analogy…

from M&R, p. 4

Course overview




iSchool

Examples of Architecture…

Image source: Wikipedia

Course overview




iSchool

Why architecture? What does designing buildings have to do with

designing Web sites?

What is architecture really about?

Course overview




iSchool

The Architecture Analogy A building must…

Look good Be usable (for working, living, playing, etc.) Stand up

A web site must… Look good Be usable (e.g., find or get what you need) Stay up (i.e., not crash, last over a period of years)

Course overview




iSchool

Other Parallels… Combination of art vs. engineering


Florence Cathedral, with dome designed by Brunelleschi

Course overview




iSchool

Other Parallels… “Pretty” but unusable:

Countless examples…what else?


Ray and Maria Stata Center, MIT; designed by Frank Gehry

Rhode Island School of Design: http://www.risd.edu/

Course overview




iSchool

Importance of Metaphors Metaphors describe/shape our thoughts

Anger as heat (see Lakoff and Johnson, Metaphors we Live By)

Political “framing” (e.g., “death tax”, “tax relief”, see Lakoff, Don’t Think of an Elephant)

Why are metaphors so pervasive?

Why are metaphors important in information architecture?

Course overview




iSchool

Metaphors on the Web Question: What types of metaphors do we need

on the web?

Interactive metaphors “Pull down”, “pop up”, “open” “Window”, “toolbar” “Shop”, “check out”, “cart”

Navigational metaphors “Browse”, “surf” “Table of contents”, “site index”

Are metaphors consistent? Do we all apply the same metaphors?

Course overview




iSchool

The Architecture Analogy: Summary The analogy is helpful

…in explaining information architecture to friends and family

…in understanding and analyzing IA concepts …in applying IA concepts to web design

Like all analogies, it goes only so far Web sites are not buildings

Consider the role of analogy and metaphor in any user-centered software activity

Course overview




iSchool

Information Architecture: Topics and Issues Key concepts of information architecture

Organizing content (e.g., labeling, hierarchies)

Search systems

Technologies, tools and techniques

Business issues

Course overview




iSchool

Examples of IA

iSchool

IA just for the Web? The Web is a great vehicle for illustrating IA

principles

The Web is evolving: Web 1.0: Web as a hypertext system Web 2.0: Web as a software interface Web 3.0: ??

Think of it simply as a platform: Plain-old websites Large corporate intranets Mail client Productivity applications …

Course overview




iSchool

Why IA is vaguely defined IA is multi-disciplinary

IA is as much an art as it is a science

IA is “messy”

IA lacks an underpinning theory

Course overview




iSchool

Overlapping Disciplines Library and information science

Computer Science Human-Computer Interaction Information Retrieval Databases Software Engineering

Graphics design

Cognitive psychology

“User experience engineering”

…

Course overview




iSchool

What is Clear? The Objective (good web sites)

The Focus (delivering information content)

The Methods

Course overview




iSchool

Course Administration and Logistics General expectations

Requirements

Grading

Other

Course overview




iSchool

What you can expect from me Practical focus

If it’s not useful, we won’t worry about it too much Emphasis on concepts Consideration for how it’s done in the “real world”

Desire that everyone should succeed Set clear and concrete objectives where possible Work together to learn/to achieve goals No “easy way out” Listen and respond to questions/objections, flexibility

Course overview




iSchool

What I expect from you Preparation

Do readings Turn in work on time “Fill in the blanks”

Participation Ask when things are unclear Give examples/tell stories Help with programmatics

Honesty across the boardCourse overview




iSchool

My Teaching Philosophy Emphasis on users

… but with a grounding in technology

Emphasis on synthesis … not rote learning

Emphasis on projects … mirroring real-life case studies

Emphasis on group work … but individual competence must be demonstrated

Course overview




iSchool

Major Course Components Lectures and discussion

In-class exercises

Team presentation

Design projects

Final project

Final examCourse overview




iSchool

Exam questions/notional example (1) All of the following are key elements of

information architecture except:

(a) Organizing information on web sites to meet user requirements

(b) Writing client-side scripts to accept user input

(c) Designing labeling systems that help users find what they need

(d) Understanding search engine features and issues

Course overview




iSchool

Exam questions/notional example (2) Match the concepts on the left with descriptions

on the right:Top-down analysis Organizing information according to

concepts in a “tree” from the general to the specific

Tagging Organizing information by starting with an expectation of what’s important or needed

Taxonomy A network of terminology and/or concepts that captures associations and

relationships among words, phrases, or ideas

Thesaurus Assigning “meta-data” labels to information content to make it easier to organize, understand, or find

Course overview




iSchool

Course Themes Design

Principles of information architecture

Technology Constraints on what is possible How to do it, building on what’s available

Processes Figuring out what to build Actually building it Figuring out if you’ve done it right

Course overview




iSchool

Focus on Group Work Why? You rarely work alone in the real world

Three is the best number

Advice: Coordination takes more effort than you expect Plan first Take advantage of individual strengths Use collaborative technologies: don’t let distance be a

hindrance or excuseCourse overview




iSchool

Course Logistics Third time this course has been offered (my second) – still

making changes, incorporating feedback

Check the course homepage oftenterpconnect.umd.edu/~psjacobs/INFM700_f09.htm

Lecture slides will be on-line Monday morning (at the latest)

Typical class structure 1.5 hour session Short break Logistics/administration One hour session

Email me: I’m available by appointment

Course overview




iSchool

Technology: Assumptions I assume you already know

Basic HTML/CSS and tools (e.g., Dreamweaver, Flash) How to put up a Web site (FTP, etc.) Database fundamentals Basics of client-side (e.g., HTML and Javascript) and

server-side (e.g., PHP) technologies, possibly Java

You’ll pick up new technology skills

For the projects, you will build something

Figure out what’s needed

Design itBuild it

Figure out if it works

Course overview




iSchool

Extra Exercise (for next time) Goal: to develop an intuition for good vs. bad IA

Compare: Amazon vs. Barnes and Noble

Evaluate: How easy was it to find/get what you wanted? What are some major architectural features/differences

of each site? Any strengths/weaknesses?

iSchool

Wrap-up

What is information architecture?

What kinds of things will we learn in the class?

How will we work together?

What are the requirements and expectations?

What should we do for next week?

Any other questions?Course overview




INFM 700: Session 1 What is Information Architecture? Paul Jacobs The iSchool University of Maryland...

Documents

Transcript of INFM 700: Session 1 What is Information Architecture? Paul Jacobs The iSchool University of Maryland...