ux lesson 5: information architecture
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