IAT-235: 03 Architecting it

IAT-235: 03 Architecting it — A slide deck

Architecting it

Information architecture (IA)

Stanza and Foursquare mobile app screenshots
From your reading this week what does IA describe?

Humans and IA

Where our challenge lies

Being able to empathize with how other humans might think and interpret information is key in our ability to build effective information structures.

LATCH

Location, Alphabet, Time, Category, Hierarchy

Location:
Asia
China
Japan
North America
Canada
United States

Alphabet:
Canada
China
France
Italy
Japan
Spain
United States

Category:
Any thoughts?

Steps to Generating an IA

  1. Generate a list of all of the items that need a structure

Generate a List

Council meetings, Salaries, Citizen involvement, City hall, Elections, Parks board meetings, The mayor, Vancouver Parks and Recreation Board, City councillors, City of Vancouver government, City council, Park Board commissioners, public consultation.

Steps to Generating an IA

  1. Generate a list of all of the items that need a structure
  2. Organize those items into a meaningful structure

IA Patterns

IA patterns give you an easy place to start with organizing information. It is important to know what kind of information you will be dealing with.

Types of patterns:

  • Hierarchy
  • Database
  • Hypertext
  • Linear

Hierarchy Pattern

Types of hierarchies:

  • Broad: Lots of top level items
  • Deep: Lots of depth, little at top
  • Strict: Items occur in one place only
  • Poly: Items can be in more than one place

Organize Meaningfully (in a Broad Hierarchy)

Council meetings, Salaries, Citizen involvement, City hall, Elections, Parks board meetings, The mayor, Vancouver Parks and Recreation Board, City councillors, City of Vancouver government, City council, Park Board commissioners, public consultation.

You have...

Organize Meaningfully (in a Deep Hierarchy)

Council meetings, Salaries, Citizen involvement, City hall, Elections, Parks board meetings, The mayor, Vancouver Parks and Recreation Board, City councillors, City of Vancouver government, City council, Park Board commissioners, public consultation.

You have...

Database Pattern

This pattern focuses much more on places where content will be consistent. This allows us to create a planned structure that people may access and understand the content with.

Organize Meaningfully (in a Database)

Council meetings, Salaries, Citizen involvement, City hall, Elections, Parks board meetings, The mayor, Vancouver Parks and Recreation Board, City councillors, City of Vancouver government, City council, Park Board commissioners, public consultation.

You have...

Metadata

Information about information

The markup that we use in HTML — such as <p> for paragraphs — is a form of metadata, helping define what the information is for a computer. It helps us use the computer to build relationships.

In this category we have two other IA patterns:

  • Linear: One thing follows another
  • Hypertext: Emergent structure

Organize Meaningfully (in Linear structure)

Council meetings, Salaries, Citizen involvement, City hall, Elections, Parks board meetings, The mayor, Vancouver Parks and Recreation Board, City councillors, City of Vancouver government, City council, Park Board commissioners, public consultation.

You have...

Timeline illustrating the evolution of Lego
What kind of organization of information is this?
A mindmap of different London coffee shop names
What kind of organization of information is this? (By David McCandless)
A flowchart illustrating how to read flowcharts
What kind of organization of information is this?
VanSort Recycling Game

What might be associated with preparing to vote?

Organize

Let's organize them into meaningful structures.

Submit Your IA

Please snap a photo of your IA (if possible) and submit to ah1.ca/ia

Break-time

You may:

  • Finish readings
  • Revisit a reading
  • Do one of the readings
  • Read into this hint

Steps to Generating an IA

  1. Generate a list of all of the items that need a structure
  2. Organize those items into a meaningful structure
  3. Reorganize and relabel categories to create a coherent structure

Combining Structures

Working with just one pattern may not be enough; there are often cases where linking two patterns may be beneficial.

Labelling Content

When you are working with your data, you are creating new titling and categories. As a result, remember the considerations of good labelling:

  • Use appropriate names
  • Use the audience's terms
  • Be consistent
  • Be clear

Steps to Generating an IA

  1. Generate a list of all of the items that need a structure
  2. Organize those items into a meaningful structure
  3. Reorganize and relabel categories to create a coherent structure

Reorganize

Working with others, reorganize and categorize your structures.

P01: Information Design

Sitemaps

Sitemaps are just one potential use for IAs.

Should help us understand:

  • Describing the hierarchy
  • Showing connections + interconnectivity
  • Scale of the site
  • Potential flow through the site

Cartographic Challenges

Potential challenges with sitemaps

Be careful, as since the web is a generally fluid space, sitemaps trap something that changes frequently into a fixed form.

Sitemap "Must Haves"

The bear necessities

The basics

  • Pages (titles)
  • Links between them
  • Consistent visual language
  • Clearly indicated hierarchy
Example of a web sitemap

Elaborating

Advancing your maps

Expanding on the basics:

  • Include further details on pages
  • Group similar pages
  • Show further connections/relationships

Contextualizing the Map

Taking the map into the work-plan

Ways to make it a planning tool:

  • Annotate pages
  • Prioritize groupings
  • Identify user needs
Example of a web sitemap
An sitemap using multiple layers of information (from Communicating Design by D. Brown)

Questions?

This week's labs will be MEGA-LAB.

We will all convene in Room 3300 for this week. Please make sure to have all your deliverables printed in time for lab.

Wireframing example
Selections from Communicating Design (Brown)

Next week's lecture will be on the wonders of wireframing.

Contacting Andrew

Where to find him

  • Tuesdays and Thursdays 9-9:50am, on the mezzanine
  • Otherwise email me at andrew.h@sfu.ca
1/1