UX Lesson 5: Information Architecture

Post on 21-Aug-2015

23 views 2 download

transcript

MIRUM AGENCY 2014

by Joan Lumanauw | May, 2015

Session 5:

INFORMATION ARCHITECTURE

INFORMATION ARCHITECTURE?Commonly known as IA, it is the art and science of developing structures and organization to present data & information

What is

MIRUM AGENCY 2014

UX

Usability

IA

The difference between

User Experience

Usability

Information Architecture

MIRUM AGENCY 2014

UX

Usability

IA

The difference between

How did I live without this before?

Usability

Information Architecture

MIRUM AGENCY 2014

UX

Usability

IA

The difference between

This product is easy to use

Information Architecture

User Experience

MIRUM AGENCY 2014

UX

Usability

IA

The difference between

Everything’s right where I’d expect it to be

User Experience

Usability

MIRUM AGENCY 2014

If UX is the terrain

MIRUM AGENCY 2014

Then IA is the map

Navigation & Labeling

Right

Left

Information Storage & Retrieval

Content Organisation

3 Focus of IA

http://www.slideshare.net/jrs76/what-is-information-architecture-and-how-can-it-help-my-website?related=1

MIRUM AGENCY 2014

THIS IS YOUR WEBSITE

MIRUM AGENCY 2014

Navigation & Labeling

MIRUM AGENCY 2014

Navigation & Labeling

Living Room Kitchen

Dining RoomBathroom

Playroom

1st floor

MIRUM AGENCY 2014

Navigation & Labeling

Parent’s Bedroom

Bathroom

Grandma’s Bedroom

2nd floor

Kid Bedroom #1

Kid Bedroom #2

MIRUM AGENCY 2014

Why did we put the living room in the middle?Questions

Why is the kitchen near the dining room?

Why did we put the family bedrooms upstairs?

Why is the playroom downstairs?

MIRUM AGENCY 2014

But wait, grandma has a bad back, she can’t go up and down the stairs all day along…

What are we to do?

MIRUM AGENCY 2014

Navigation & Labeling

Living Room Kitchen

Dining RoomBathroom

1st floor

Grandma’s Room

MIRUM AGENCY 2014

Content Organisation

Living Room Kitchen

Dining RoomBathroom

Grandma’s Room

Everything (now/future) has a place

• Sofa • TV • Coffee Table

• Shower • Sink • Toilet

• Bed • Recliner • Table

• Dining Table • Chairs • Napkins

• Stove • Oven • Cooking Utensils • Spice Rack

MIRUM AGENCY 2014

Information Storage & Retrieval

Kitchen

Dining Room• Dining Table • Chairs • Napkins

• Stove • Oven • Cooking Utensils • Spice Rack

Where does eating utensils go?

MIRUM AGENCY 2014

How do we implement it?Now that we understand the basic concept of IA

MIRUM AGENCY 2014

IA Output: Sitemap

MIRUM AGENCY 2014

IA Output: Sitemap

Navigation

Right

Left

Findability

Why do we need IA?

SEO

So users can find your website

So users can find the information they’re

looking for

So users know where they are

http://www.slideshare.net/jrs76/what-is-information-architecture-and-how-can-it-help-my-website?related=1

MIRUM AGENCY 2014

Information ScentFindability

Is an analogy that compares how humans seek information with animals seeking food.

• Refers to the extent to which users can predict what’s ahead (in a link or in an article)

• Information scents includes titles and links that helps visitors find what they are looking for

• Users will feel duped if they don’t get sufficient payoff from going down a path

http://www.slideshare.net/jrs76/what-is-information-architecture-and-how-can-it-help-my-website?related=1

MIRUM AGENCY 2014

It helps visitors know that your site is fertile hunting grounds for the things they are looking for.

YOU’RE GETTING CLOSERInformation scent says to the user

Scientology

About The Church

Book of Scientology

Scientology Beliefs

Church History

Church Hierarchy

Book of Temptations

Book of Prophets

Beliefs on Marriage

Beliefs on Paradise

http://www.slideshare.net/jrs76/what-is-information-architecture-and-how-can-it-help-my-website?related=1

MIRUM AGENCY 2014

• Search engines index (scan) your site hierarchically • Pages higher in the hierarchy are given more weight • SEO also make note of silos of info and relationships • Well architected site makes information more findable

Scientology

About The Church

Book of Scientology

Scientology Beliefs

Church History

Church Hierarchy

Book of Temptations

Book of Prophets

Beliefs on Marriage

Beliefs on Paradise

Most Weight

Least Weight

IA impacts heavily on search engine’s view of your site

http://www.slideshare.net/jrs76/what-is-information-architecture-and-how-can-it-help-my-website?related=1

MIRUM AGENCY 2014

• Help users know what’s available and find what they are looking for. • Tell users where they are within the site • Tell users how to use the site by quickly communicating features • Give users a reference point

Sitemaps and Menus that reflect IA leads to greater findability

Use breadcrumbs let users know where they are

Clear large title/heading

Active view on the menu item

VISUAL CUES

http://www.slideshare.net/jrs76/what-is-information-architecture-and-how-can-it-help-my-website?related=1

MIRUM AGENCY 2014

ANY QUESTIONS?

MIRUM AGENCY 2014

In pairs, use the Lifebuoy FGD Report and design a sitemap for the mobile app.

Exercise 4.1

INFORMATION ARCHITECTURE