Informatie architectuur en navigatie ontwerpen

Part 1: Why information architecture?

Examples of BIG, complex, dynamic systems

Examples of BIG, complex, dynamic systems

Examples of BIG, complex, dynamic systems

Part 2:How do people look for information?

Searching, Browsing, Asking

Searching: the too-simple model1. User asks question

2. Black magic

3. User receives answer

Doelen met zoeken: de vismetafoor

• ‘The perfect catch’‘Known item seeking’

• ‘Lobster trapping’‘Exploratory seeking’

• ‘Drift netting’‘Exhaustive seeking’

"I'm travelling to London on business. How much will my company pay for each day of my trip?"

What key words might you associate with this question?

Example of using an intranet

Example of using an intranet

‘Berry-picking’ behavioral model

Example to support ‘berry picking’

Veel afwisselen tussen ‘browse’ en ‘search’

‘Pearl growing’ behavioral model

'more results like these'

The big questions for ia

Not:

• 'Which few, broad, simple categories does the information fit into?' (Top of the hierarchy)

Rather:

• 'How are users most likely to behave as they seek the information?'

• 'Which names and groups of information are they most likely to recognize?'

Often, the main result of your content analysis is...

NEW CATEGORIES WITH NEW LABELLING

Part 3: organization schemes & metadata

Organization schemes

Exact

• alphabetical• chronological• geographical

Ambiguous

• topic (yellow pages)• task (edit)• audience (home and

home office)• metaphor (park,

continent with 'Lake of Forgetfulness', etc.)

Metadata: a controlled vocabulary of terms

Record (entity)

Field (attribute)

Types of semantic relationshipsEquivalent - synonym management, variant and

preferred terms (A = B)

Hierarchical - A is a subset of B

Generic: Formal class and species (Bird, Magpie)

Whole - Part: B is part of A (Big toe, Foot)

Instance: B is an instance or example of A (often proper names) (Sea, Mediterranean)

Associative

A strongly implies B (welcome back to most of humanity's vague, and yet extraordinarily sensitive and precise use of language)

Example: cross-selling. "Going on a trip? Buy this sun hat!"

What do metadata enable?

• Automatic generation of alphabetical indices

• Dynamic presentation of associative links

• Fielded searching

• Advanced filtering and sorting

Typen navigatie en patronen

Bronnen

Designing Interfaces. (2006) Jenifer Tidwell

http://designinginterfaces.com/

Designing Web Navigation. (2007) James Kalbach

http://experiencinginformation.wordpress.com/designing-web-navigation-the-book/

Typen van navigatie (naar Kalbach)

Main/global navigation

Typen van navigatie (naar Kalbach)

Local navigation

Typen van navigatie (naar Kalbach)

Local navigation

Typen van navigatie (naar Kalbach)

Contextual navigation

Typen van navigatie (naar Kalbach)

Contextual navigation

Typen van navigatie (naar Kalbach)

Adaptive navigation

Typen van navigatie (naar Kalbach)

Quick links

Typen van navigatie (naar Kalbach)

Footer navigation

Typen van navigatie (naar Kalbach)

Utility navigation

Typen van navigatie (naar Kalbach)

• Main/global navigation

• Local navigation• Contextual

navigation• Adaptive navigation• Quick links• Footer navigation• Utility navigation

Indeling van navigatiepatronen (naar Tidwell)

• Informatie organiseren (hoofdstuk 2)

• De weg vinden (hoofdstuk 3)

• Pagina’s organiseren (hoofdstuk 4)

Belangrijke navigatiepatronen (naar Tidwell)

Informatie organiseren (Tidwell - hoofdstuk 2)Two-panel selector (blz. 31)

Belangrijke navigatiepatronen (naar Tidwell)

Informatie organiseren (Tidwell - hoofdstuk 2)One-window drilldown (blz. 36)

Belangrijke navigatiepatronen (naar Tidwell)

Informatie organiseren (Tidwell - hoofdstuk 2)Wizard (blz. 42)

Belangrijke navigatiepatronen (naar Tidwell)

Informatie organiseren (Tidwell - hoofdstuk 2)Extras on demand (blz. 45)

Belangrijke navigatiepatronen (naar Tidwell)

De weg vinden (Tidwell, hoofdstuk 3)Global/persistent navigation (blz. 66)

Belangrijke navigatiepatronen (naar Tidwell)

De weg vinden (Tidwell, hoofdstuk 3)Hub and spoke (blz. 68)

Belangrijke navigatiepatronen (naar Tidwell)

De weg vinden (Tidwell, hoofdstuk 3)Pyramid (blz. 71)

Belangrijke navigatiepatronen (naar Tidwell)

De weg vinden (Tidwell, hoofdstuk 3)Sequence map (blz. 76)

Belangrijke navigatiepatronen (naar Tidwell)

De weg vinden (Tidwell, hoofdstuk 3)Breadcumbs (blz. 78)

Belangrijke navigatiepatronen (naar Tidwell)

Pagina’s organiseren (Tidwell, hoofdstuk 4)Titled sections (ook wel ‘deurmatjes’ genoemd, blz.

107)

Belangrijke navigatiepatronen (naar Tidwell)

Pagina’s organiseren (Tidwell, hoofdstuk 4)Card stack (ook wel ‘tabbed navigation’ genoemd, blz.

109)

Belangrijke navigatiepatronen (naar Tidwell)

Pagina’s organiseren (Tidwell, hoofdstuk 4)Closable panels (ook wel ‘harmonica’ genoemd, blz.

111)

Belangrijke navigatiepatronen (naar Tidwell)

Pagina’s organiseren (Tidwell, hoofdstuk 4)Responsive disclosure (blz. 123)

Verder lezen over navigatie- en zoekpatronen

Designing Web Interfaces. (2009) Bill Scott & Theresa Neil

http://designingwebinterfaces.com/

Search Patterns. (geraadpleegd feb. 2009) Peter Morville

http://flickr.com/photos/morville/collections/72157603785835882/

Samengevat

• Verschillende typen navigatie hebben verschillende doelen

• Gebruikers hebben bepaalde verwachtingen bij de verschillende typen navigatie

• Het gebruiken van bekende navigatiepatronen in je interactieontwerp speelt in op de verwachtingen van gebruikers en helpt je een gebruiksvriendelijk ontwerp te maken

Bedankt voor jullie aandacht

http://vakgroep.cmd.hro.nl/iadhttp://rewind.cmi.hro.nl/

j.a.m.kemp@hro.nl