146
Designing Structure Information Architecture

Designing structure ia

  • View
    1.142

  • Download
    0

Embed Size (px)

DESCRIPTION

 

Citation preview

Page 1: Designing structure ia

Designing Structure

Information Architecture

Page 2: Designing structure ia
Page 3: Designing structure ia

A SHORT HISTORY OF ARCHITECTURE

Page 4: Designing structure ia

Cave

Page 5: Designing structure ia
Page 6: Designing structure ia

Hut

Page 7: Designing structure ia
Page 8: Designing structure ia

Stone Age City

Page 9: Designing structure ia
Page 10: Designing structure ia

VITRUVIUS

firmitas, utilitas, venustas : : durability, convenience, beauty 

Page 11: Designing structure ia

Durability

“Durability will be assured when foundations are carried down to the solid ground and materials wisely and liberally selected” Vitruvius

Page 12: Designing structure ia

The hotel had several design features that made up for its foundation:The reflecting pool (visible in the picture above) also provided a source of water for fire-fighting, saving the building from the post-earthquake firestorm;[1]

Cantilevered floors and balconies provided extra support for the floors;A copper roof, which cannot fall on people below the way a tile roof can;Seismic separation joints, located about every 20 m along the building;Tapered walls, thicker on lower floors, increasing their strength;Suspended piping and wiring, instead of being encased in concrete, as well as smooth curves, making them more resistant to fracture.[2]

Page 13: Designing structure ia

Technical Earthquakes

I’m searching for “my architect, not

“movies, directors, actors”

Page 14: Designing structure ia

Social Earthquakes

If people post jobs in discussion areas, any user can

move them to job board

If people use connection invites to spam/market, they

can be reported.

Page 15: Designing structure ia

Convenience

“When the arrangement of the apartments is faultless and presents no hindrance to use, and when each class of building is assigned to its suitable and appropriate exposure” Vitruvius

Sound familiar? We’re talking

usability!

Page 16: Designing structure ia

Rackspace headquarters in in a former mall. The building is so usable for moving people around, it's easily repurposed. Robert Venturi calls this a “decorated shed”

Page 17: Designing structure ia

Malls online epitomize convenience, and are typically extremely usable. Anthropologie is elegant and functional.This simple model could be repurposed for any side dealing with objects and metadata

Page 18: Designing structure ia

Bilbao did not leak. I was so

proud.

The MIT project, they were interviewing me for MIT and they sent their facilities people to Bilbao. I met them in Bilbao. They came for three days.W: This is the computer building.G: They were there for three days and it rained every day. And they kept walking around. I noticed they were looking under things and looking for things, and they wanted to know where the buckets were hidden, people putting buckets out. I was clean. There wasn't a bloody leak in the place. It was just fantastic. But you've got to -- yeah, well, up until then, every building leaked.W: Frank had a sort of -- sort of had a fame -- his -- his fame was built on that in L.A. for a while. You know, Frank, you've all heard the Frank Lloyd Wright story when the guy -- the woman called and said, "Mr. Wright, my -- I'm sitting in the couch and the water's pouring in on my head," and he said, "Madame, move your chair."G: So, some years later I was doing a little house on the beach for Norton Simon, and his secretary was kind of a hell-on-wheels type lady -- called me and said, Mr. Simon's sitting at his desk, and the water's coming in on his head, and I told him the Frank Lloyd Wright story.W: Didn't get a laugh.G: No. Not now either. http://www.ted.com/talks/frank_gehry_asks_then_what.html

Page 19: Designing structure ia

I call it the "Then What?" Okay, you solved all the problems, you did all the stuff, you made nice, you loved your clients, you loved the materials, you loved the city, you're a good guy, you're a good person... and then what? What do you bring to it?

See his great TED talk http://www.ted.com/talks/frank_gehry_asks_then_what.html

Page 20: Designing structure ia

“Early in life I had to choose between honest arrogance and hypocritical humility. I chose honest arrogance and have seen no occasion to change.” Frank Lloyd Wright

Page 21: Designing structure ia

Beauty (delight)

“when the appearance of the work is pleasing and in good taste, and when its members are in due proportion according to correct principles of symmetry.” Vitrvius

Page 22: Designing structure ia

“Less is more.” ~ Mies

Page 23: Designing structure ia

SEAGRAM BUILDING (Philip Johnson did interiors, 1957)

This logical and elegant 38-story skyscraper (525' H) has alternating horizontal bands of bronze plating and bronze-tinted glass and decorative bronze I-beams which emphasize its verticality. Placed to the rear of its site and set back from Park Avenue, it incorporates a large plaza in the front as part of the design--thus avoiding the need for set-backs. It uses granite pillars at the base and has a two-story glass-enclosed lobby.

Seagram Building

New York City

1957

Is this Beautiful?

Page 24: Designing structure ia

“Less is a bore.” ~ Venturi

Page 25: Designing structure ia

Is this Beautiful?

Page 26: Designing structure ia

Do we dictate what is beautiful by constraining

user choice?

Page 27: Designing structure ia

Or support passionate use that may not meet our

aesthetic standards?

Page 28: Designing structure ia

Beautiful

ConvenientDurable

Page 29: Designing structure ia

29

Information Architecture

Architecture Retrieval

Page 30: Designing structure ia

Information Architects

• What is IA?• IAI definition

1. The art and science of organizing and labeling web sites, intranets, online communities and software to support usability and findability.

2. The structural design of shared information environments.

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

Page 31: Designing structure ia

Findability

Page 32: Designing structure ia

In the physical world

• Things that have fixed locations– We find with

maps and signs-- wayfinding

• Things that don’t– We find with

organization and wayfinding

Page 33: Designing structure ia

In the digital world

• Nothing is fixed• Wayfinding and organization is the two

keys to findability• Role of IA is to shape the digital space to

enable findability.

Page 34: Designing structure ia

Make things findable

• Organization– Build on Metadata– Browse systems– Search systems

• Wayfinding– Labels– Visual cues

Page 35: Designing structure ia

Make things appear

• Serendipity systems– See also– Related– Popularity relationships– Also built on metadata

Page 36: Designing structure ia

The structural design of an information space to facilitate task completion and intuitive access to content.

Definition

Information Architecture for the World-Wide Web Louis Rosenfeld & Peter Morville

Organizing info so

people can find stuff>

Page 37: Designing structure ia

PLAY WITH YOUR BALLSSort into groups. Name groups

Page 38: Designing structure ia

MAKE A HOMEPAGE FOR YOUR BALL SITE

Page 39: Designing structure ia

4 KINDS OF INFORMATION SEEKING

Page 40: Designing structure ia

KNOWN ITEM

http://boxesandarrows.com/four-modes-of-seeking-information-and-how-to-design-for-them/

Page 41: Designing structure ia

What works

• Search• A-Z index• Navigation

http://boxesandarrows.com/four-modes-of-seeking-information-and-how-to-design-for-them/

Page 42: Designing structure ia

EXPLORATORY

http://boxesandarrows.com/four-modes-of-seeking-information-and-how-to-design-for-them/

Page 43: Designing structure ia

What can help

• Navigation• Related Search• Search (with autocomplete, related terms)

http://boxesandarrows.com/four-modes-of-seeking-information-and-how-to-design-for-them/

Page 44: Designing structure ia

DON’T KNOW WHAT YOU NEED TO KNOW

http://boxesandarrows.com/four-modes-of-seeking-information-and-how-to-design-for-them/

Page 45: Designing structure ia

What can help

• Related information• Recommendations• Push technologies

http://boxesandarrows.com/four-modes-of-seeking-information-and-how-to-design-for-them/

Page 46: Designing structure ia

REFINDING

http://boxesandarrows.com/four-modes-of-seeking-information-and-how-to-design-for-them/

Page 47: Designing structure ia

What can help

• Favorites• Personalization• Visited link color

http://boxesandarrows.com/four-modes-of-seeking-information-and-how-to-design-for-them/

Page 48: Designing structure ia

Redesign

TASKS• Find a baseball • Find a gift for a upcoming party for a seven

year old• Make users aware some balls are on sale• Find again a good choice for that party

Page 49: Designing structure ia

Classification has Consequences

• A physician who doesn’t see a new cure• A poor student who can’t find financial aid• A store where a product isn’t found

Page 50: Designing structure ia

IA has Solutions

– Tagging with metadata– Organizing with CV’s– Creating navigation

systems – Optimizing search

Information Architecture manages information to make it findable

Page 51: Designing structure ia

And IA can build brands.

Page 52: Designing structure ia

Branding in 10 seconds

brand promises

brand experiences

create

fullfilled by

Brand managers

Brian Collins’ Model of Brand

Page 53: Designing structure ia

Brand and the User Experience

Hugh Dubberly’s Model of Brand

Creating a good customer experience is the essence of good branding

Page 54: Designing structure ia

IA Realizes Brand

Page 55: Designing structure ia
Page 56: Designing structure ia

Benabar n’est pas jazz?

Page 57: Designing structure ia

57

What is this?

Page 58: Designing structure ia

58

What is this?

Page 59: Designing structure ia

59

What is this?

Page 60: Designing structure ia

60

What is this?

Page 61: Designing structure ia

61

What are these?

Page 62: Designing structure ia

62

They are all birds(ornithologist)

Page 63: Designing structure ia

63

The Cassowary is not a bird!

(the Karam)

Page 64: Designing structure ia

64

From “Why the Cassowary is not a bird”, R. Bulmer, Man, Vol. 2, Issue 1, (Mar. 1967)

Page 65: Designing structure ia

65

From “Why the Cassowary is not a bird”, R. Bulmer, Man, Vol. 2, Issue 1, (Mar. 1967)

Page 66: Designing structure ia

66

Who Cares?

• Ornithologists• The Karam • Information Architects

Page 67: Designing structure ia

67

Dewey Decimal System

• 200-299 – Religion Categories

• 40+ categories related to Christianity

• 1 for Judaism• 1 for Islam (&

related)

Page 68: Designing structure ia

68

Who Cares?

• Religious Scholars• Librarians• Information Architects• Jews and Muslims

Page 69: Designing structure ia

69

• Classification reflects social and cultural organization

• Information Architect must understand this context

Context is King

Page 70: Designing structure ia

70

Get to know your audience…

1. Who are they?

Football Fan

Page 71: Designing structure ia

71

Get to know your audience…

1. Who are they?

Football Fan?

Page 72: Designing structure ia

72

Get to know your audience…

1. Who are they?

2. What do they care about?

Are the Patriots going to make the playoffs?

Show me photos!

What happened in the last game?

Page 73: Designing structure ia

73

Get to know your audience…

1. Who are they?

2. What do they care about?

3. How do they think of the information and content?

Conference, division…

Schedules, standings…

Page 74: Designing structure ia

74

Get to know your audience…

1. Observe others

2. Study Competitors and similar sites

3. Review your search logs

4. Do a card sort

Page 75: Designing structure ia

75

Now what?

• Organize your information so it makes sense to your audience

• Structure your information to help users find it

• …using metadata

Page 76: Designing structure ia
Page 77: Designing structure ia

METADATA

Page 78: Designing structure ia
Page 79: Designing structure ia

Pictures of you

Page 80: Designing structure ia
Page 81: Designing structure ia

81

Metadata: what is it?

“metadata is data about data"

Page 82: Designing structure ia

82

Metadata: what is it?

“Metadata tags are used to describe documents, pages, images, software, video and audio files, and other content objects for the purposes of improved navigation and retrieval”

‘Information Architecture for the World Wide Web’, 2nd ed., (2002) Rosenfeld, L. & Morville, P.

Page 83: Designing structure ia

Descriptive

• Ham• Cheese• Honey• Olivia’s

Page 84: Designing structure ia

Intrinsic

What does the camera know? What does the system know?

Page 85: Designing structure ia

Administrative

Page 86: Designing structure ia

86

Not all Metadata is equal

• What are users interested in?• What do you want users to be able to find?• What metadata makes management

easy?

• Tag content for findability• Tag content for management

Page 87: Designing structure ia

87

Exercise

• BALL• Write as many descriptive words (or short

phrases) on your post-it• One word (or phrase) per post-it

• Don’t share– yet! Hold on!

Page 88: Designing structure ia
Page 89: Designing structure ia

89

Next

Content Architecture Part II

Page 90: Designing structure ia
Page 91: Designing structure ia

91

Controlled vocabularies

Master of your domains

Page 92: Designing structure ia

92

Cardinal Richelieu

Grandfather of controlled vocabularies

Page 93: Designing structure ia

93

The French Academy

• Founded in 1635• Multiple dialects• Goal: purify the French language• Goal: unify the nation (ensure that the

State and all citizens speak the same language)

Page 94: Designing structure ia

94

The French Academy today

…but…

Page 95: Designing structure ia

95

So what?

• How will you ensure they continue to do so?

• So what are your goals?

• How will you ensure that your users and your system speak the same language?

Page 96: Designing structure ia

96

I’ve got music

I want music.

When humans and computers interact

Page 97: Designing structure ia

97

Hip HopRap.Rock.Dance.

Humans are good at figuring things out

Page 98: Designing structure ia

98

Raggamuffin ?

Most of the time

Page 99: Designing structure ia

99

Acidreggae

?

No matches found

But computers are literal

Page 100: Designing structure ia

100

AcidReggae?

?

Let’s give them “Reggae” and “Trance”

IA

And need help

Page 101: Designing structure ia

101

Thus Controlled vocabularies (CV)Amy Warner defines a controlled vocabulary (CV)

as “organized lists of words and phrases, or notation systems, that are used to initially tag content, and then to find it through navigation or search.”

Of course, the IA can’t always be there…

Page 102: Designing structure ia

102

I define them as

Documented relationships of words and concepts to assist people finding stuff.

Same dif.

Controlled Vocabularies

Page 103: Designing structure ia

103

• Levels of control

Simple Complex

SynonymRings

AuthorityFiles

ThesauriClassificationSchemes

Equivalence Hierarchical Associative

(Vocabularies)

(Relationships)

Controlled Vocabulary Types

Page 104: Designing structure ia

104

• Relationships

A=B AB

A BEquivalenceChristmas=Xmas

HierarchalWinter Holidays > Christmas

Associative Christmas Tree | Santa Claus

Controlled vocabularies

Page 105: Designing structure ia

105

• Simplest type• Helps with search, indexing• Simplifies maintenance

Synonym rings

Page 106: Designing structure ia

106

• Acronyms: BBC, British Broadcasting Company; MPG, miles per gallon

• Variant spellings: cancelled, canceled; honor, honour

• Scientific terms versus popular use terms: acetylsalicylic acid, aspirin; lilioceris, lily beetle– From Synonym Rings and Authority Files

by Karl Fast, Fred Leise and Mike Steckel

Synonym rings include

Page 107: Designing structure ia

107

• Sometimes on intranets, CV’s are skipped

• You think you can force people to use proper terms

• But people are lazy

I’m tired of typing “Controlled Vocabulary--- CV is shorter.

Why Bother?

Page 108: Designing structure ia

108

• On the internet you want to be found

• Plus users use short queries– Average queries are 2.5

words– 30% of searches are one word queries

• On large scale sites, there is enough data to do this programmatically, but on small sites, not.

I want a cannon camera.

Why Bother?

Page 109: Designing structure ia

109

It may be the Canon PowerShot S30

Bizrate built a business off mispellings

Page 110: Designing structure ia

110

Cannon S30

Powershot S30

S30

Canon S30

But what do people call it?

Page 111: Designing structure ia

111

A page for each synonym

Page 112: Designing structure ia

112

And they can be number one

Page 113: Designing structure ia

113

• Types of relationships• Sibling:

Gap.com directories» Men» Women» Maternity» Body» Boys» Girls» Baby boy» Baby girl

Classification schemes

Page 114: Designing structure ia

114

Parent / Child

(amazon.com)

Classification schemes

Page 115: Designing structure ia

LATCH

Page 116: Designing structure ia

116

Classification Schemes

Other RelationshipsAlphabetical (administrative metadata)

Authors, A-Z > ( M ) > Moore, Alan

Chronological (administrative metadata)

New for You > New Releases > Books

Topic (descriptive metadata)

Comics > Graphic Novels > Horror

Amazon uses all of these, and more….

Page 117: Designing structure ia

117

• Cadillac of Controlled Vocabularies• Includes associative relationships

Preferred term

Variants Siblings Parent Associated

Christmas X-mas, Nöel

Hanukah, Kwanzaa

Winter holidays

Santa Claus

Thesauri

Page 118: Designing structure ia

118

Associations

Page 119: Designing structure ia

119

• Amazon uses buying patterns to determine associations

Associations

Page 120: Designing structure ia

120

Associations

Page 121: Designing structure ia

121

Content Inventory

• Link ID• ROT• Document type• Topics/

Keywords• Location

• Maintainer• Expiration• Access• Author• Existing/planned

Identify all content and attributes

Page 122: Designing structure ia
Page 123: Designing structure ia

124

Term harvesting

• Look Inward– Your site– Current keywords

• Look outward– Magazines– Competitors– Discussion lists

• Log harvesting– Search engines– Overture

• Ask people– Interviews– Card sorts– Free Listing

Page 124: Designing structure ia

125

Sorting Terms

A Card Sort for Architects

• Multiple Groupings– Equivalent UF cheese=fromage– Broader terms BT cheese | dairy– Narrower terms NT cheese | cheddar– Related term RT cheese | crackers

Page 125: Designing structure ia

126

Sleeping Bags       BT Camping        NT Down Sleeping Bags       NT Synthetic Sleeping Bags       NT Family Sleeping Bags       NT Cold Weather Sleeping Bags               NT 2-Season Sleeping Bags              NT 3-Season Sleeping Bags       NT Back Packing Sleeping Bags               NT Expedition Class Sleeping Bags              NT Ultralight Sleeping Bags              RT Backpacks               RT Ultralight Backpacking       RT Sleeping Bag Liners       RT Sleeping Pads       RT Stuff Sacks       RT Pillows

From Creating a Controlled Vocabularyby Karl Fast, Fred Leise and Mike Steckelhttp://www.boxesandarrows.com/archives/creating_a_controlled_vocabulary.php

Page 126: Designing structure ia

127

Sorting conflicts

• Cheese goes in dairy or in sandwich materials?

• A cheese basket?• String cheese?

Choices fit strategy

Page 127: Designing structure ia

128

Associations

• What is related• What is required?• What else is interesting?

Relevancy is king

Page 128: Designing structure ia

129

Possible Relationships

• Process/agent (camp fires/matches)

• Action/product of action (baking/cakes) • Agent/counteragent

(allergies/antihistamine) • Raw material/product (wool/sweater).

Page 129: Designing structure ia

130

Implement

• Implementation dependant on situation and tools.

• May be slow painful data entry– know this and prepare.

Page 130: Designing structure ia

131

Test

• Test with users – did you get it right?

– Browse Testing– Search Testing– Monitor quantitative

– Refine, refine, refine

Page 131: Designing structure ia

132

Maintain

• Who maintains it?• What the rules for new terms?• Document your decisions.

Page 132: Designing structure ia

133

Is that all?

NO!

Life beyond enumerative classification….

Page 133: Designing structure ia

134

Faceted Classification

was developed, prior to the existence of computers, by S. R. Ranganathan, a Hindu mathematician working as a librarian.

Page 134: Designing structure ia

135

Ranganathan’s 5 Facets

• who: personality• what: matter• how: energy• where: space• when: time

Page 135: Designing structure ia

136

Essential Qualities of a Facet

• Mutually exclusive; represents a characteristic of division not found in any other facet

• Cannot be further sub-divided• Relationships between facets are non-

hierarchical (though within facets…)

Page 136: Designing structure ia
Page 137: Designing structure ia

138

The broad categories into which the subject area is divided. A facet consists “... of a group of terms that represents one, and only one, characteristic of division of a subject field....no two facets may contain terms that could represent the same concepts.” —Louise Spiteri

Facets

Page 138: Designing structure ia

139

Ordinary stuff?

Epicurious uses facets to help users find recipes

Page 139: Designing structure ia

140

Yahoo! Personals

• Faceted classification by Yahoo! Personas

• Content by the users

Page 140: Designing structure ia

141

What’s the difference?

Electronics

Camera

Digital

Film

PDAs

Televisions

Camera facets

Pixels

Zoom

Price

Page 141: Designing structure ia

142

Music

Enumerative

• Modern– Rock

• Alternative– Seattle– Atlanta

Faceted

• Mood• Tempo• Artist• Use

Page 142: Designing structure ia

143

FACETS, ANYONE?Create ball facets

Page 143: Designing structure ia

144

Making Facets

1. Consider the universe of documents to be indexed.

2. Consider user finding strategies.

3. Analyze each document to identify the facets.

4. Group isolates (simple-concept subjects) into the facets.

5. Apply the notational system.

(I skipped some steps, to avoid wonking out….)

Page 144: Designing structure ia

Is this all there is?

Page 145: Designing structure ia
Page 146: Designing structure ia

Homework

• Content inventory: what’s in your site?• Organizational Scheme

– Hierarchal?– Faceted?– Combination?

• Portfolio Piece: Site map (a la Dan Brown’s Communicating design Chapter 5)