View
393
Download
1
Category
Preview:
Citation preview
INFORMATION ARCHITECTURE
THE JOURNEY
THE DESTINATION
THE RETURN TRIP
Fran Zablocki • April 23, 2014 mStonerTuesday, September 16, 14
INFORMATION ARCHITECTURE
mStoner
INTRODUCTION
DEFINITION
ELEMENTS
PROCESS
IA PRACTICE ON CAMPUS
Tuesday, September 16, 14
mStoner
INTRODUCTION
DEFINITION
ELEMENTS
PROCESS
IA PRACTICE ON CAMPUS
INFORMATION ARCHITECTURE
Tuesday, September 16, 14
mStoner
INFORMATION ARCHITECTURE
INTRODUCTION
DEFINITION
ELEMENTS
PROCESS
IA PRACTICE ON CAMPUS
Tuesday, September 16, 14
DEFINITION
ELEMENTS
PROCESS
INTRODUCTION
CONTEXT
USER EXPERIENCE
DISCIPLINES
Tuesday, September 16, 14
m
CONTEXT The structured design of shared information environments.
Source: IA for the WWW, Morville & Rosenfeld, 2006
INFORMATION ARCHITECTURE IS:
Tuesday, September 16, 14
m
CONTEXTThe combination of organization, labeling, search, and navigation systems within web sites and intranets.
Source: IA for the WWW, Morville & Rosenfeld, 2006
INFORMATION ARCHITECTURE IS:
Tuesday, September 16, 14
m
CONTEXTThe art and science of shaping information products and experiences to support usability and findability.
Source: IA for the WWW, Morville & Rosenfeld, 2006
INFORMATION ARCHITECTURE IS:
Tuesday, September 16, 14
“The work we do involves high levels of abstraction, ambiguity, and occasionally !absurdity, and to some degree we’re all still making it up as we go along.”
— Peter Morville & Louis Rosenfeld, Information Architecture for the World Wide Web, 2006
Tuesday, September 16, 14
m
Planned Structure
Form & Function
Designated Pathways
But the analogy only gets so far...
INFORMATION VS. PHYSICAL ARCHITECTURE
CONTEXT
Tuesday, September 16, 14
Most buildings aren’t designed to be entered via:
• The window
• The ceiling
• The plumbing
But most websites have to be.
http://farm5.staticflickr.com/4019/4684666416_1750a85773.jpg
Tuesday, September 16, 14
m
The Elements of User Experience
Jesse James Garrett
A Visual Model to Make Sense of a Rapidly Evolving Field
Because IA is a piece of a much bigger puzzle, we need to understand how all the pieces fit together.
USER EXPERIENCE
OUR MODEL
Tuesday, September 16, 14
Source: http://www.jjg.net/elements/pdf/elements_simpleplanes.pdf
Tuesday, September 16, 14
Source: http://www.jjg.net/elements/pdf/elements.pdf
Tuesday, September 16, 14
Source: http://www.jjg.net/elements/pdf/elements.pdf
Tuesday, September 16, 14
m
What do your visitors need to do?
Research
Compare
Apply
Donate
Contact
USER EXPERIENCE
STRATEGY: USER NEEDS
Tuesday, September 16, 14
m
What do your visitors need to know?
Why is your school is a good fit for me?
Who teaches and learns at your school?
How can I apply? When should I apply?
What’s the latest news?
Where are you located?
USER EXPERIENCE
STRATEGY: USER NEEDS
Tuesday, September 16, 14
m
What purpose does this site serve?
To sell your institution to prospective students.
To encourage alumni engagement.
To provide employees with resources.
USER EXPERIENCE
STRATEGY: SITE OBJECTIVES
Tuesday, September 16, 14
m
What business objective does the site meet?
Increase applications.
Increase donations.
Decrease time spent on information requests.
STRATEGY: SITE OBJECTIVES
USER EXPERIENCE
Tuesday, September 16, 14
Tuesday, September 16, 14
Source: http://www.jjg.net/elements/pdf/elements_simpleplanes.pdf
Tuesday, September 16, 14
Source: http://www.jjg.net/elements/pdf/elements.pdf
Tuesday, September 16, 14
m
What features will the site need to include?
Search
Social Media
Video
Forms
Logins
USER EXPERIENCE
SCOPE: FUNCTIONAL SPECIFICATIONS
Tuesday, September 16, 14
m
What content will the site need to include?
Notifications
Events
News
Testimonials
Reference
SCOPE: CONTENT SPECIFICATIONS
USER EXPERIENCE
Tuesday, September 16, 14
Source: http://www.jjg.net/elements/pdf/elements_simpleplanes.pdf
Tuesday, September 16, 14
Source: http://www.jjg.net/elements/pdf/elements.pdf
Tuesday, September 16, 14
m
Information architecture is the structure of content. It is the structure, order, and hierarchy of content labels and categories.
STRUCTURE: INFORMATION ARCHITECTURE
Source: http://www.jjg.net/elements/pdf/elements.pdf
USER EXPERIENCE
Tuesday, September 16, 14
m
Interaction design is the structure of experience. It’s the hover state, slide out effect and behavior of that structure.
STRUCTURE: INTERACTION DESIGN
Source: http://www.jjg.net/elements/pdf/elements.pdf
USER EXPERIENCE
Tuesday, September 16, 14
Tuesday, September 16, 14
Source: http://www.jjg.net/elements/pdf/elements_simpleplanes.pdf
Tuesday, September 16, 14
Source: http://www.jjg.net/elements/pdf/elements.pdf
Tuesday, September 16, 14
m
Decisions:
What font will we use for the navigation?
How much space (kerning) between the navigation items?
How will different navigation elements be placed in relation to one another (alignment)?
SKELETON: INFORMATION DESIGN
USER EXPERIENCE
Tuesday, September 16, 14
m
Decisions:
Carets or Bullets or Arrows to represent child links?
Bold or Underline to represent what page people are on?
SKELETON: NAVIGATION DESIGN
USER EXPERIENCE
Tuesday, September 16, 14
m
Decisions:
Does the navigation expand on hover or click?
Does the navigation slide out sideways, or down?
How many levels are shown at once?
SKELETON: INTERFACE DESIGN
USER EXPERIENCE
Tuesday, September 16, 14
Source: http://www.jjg.net/elements/pdf/elements_simpleplanes.pdf
Tuesday, September 16, 14
Source: http://www.jjg.net/elements/pdf/elements.pdf
Tuesday, September 16, 14
m
Every layer below contributes to visual design.
Each layer is invisible to the visitor - they just see ‘the design’.
Even as site creators, we don’t typically think of each of these components in isolation.
SURFACE: VISUAL DESIGN
USER EXPERIENCE
Tuesday, September 16, 14
mStoner
INTRODUCTION
DEFINITION
INFORMATION ARCHITECTURE ELEMENTS
PROCESS
IA PRACTICE ON CAMPUS
Tuesday, September 16, 14
m
SCHEMES & STRUCTURES
Alphabetical
Chronological
Procedural
EXACT ORGANIZATIONAL SCHEMES
Tuesday, September 16, 14
m
Topical
Tells the visitor what the most important categories of information are.
AMBIGUOUS ORGANIZATIONAL SCHEMES
SCHEMES & STRUCTURES
Tuesday, September 16, 14
m
Audience
Asks the user ‘Who are you?’, ‘How do you identify yourself?’
AMBIGUOUS ORGANIZATIONAL SCHEMES
SCHEMES & STRUCTURES
Tuesday, September 16, 14
m
Task
Designed to allow someone to accomplish something.
Uses action verbs in labels.
AMBIGUOUS ORGANIZATIONAL SCHEMES
SCHEMES & STRUCTURES
Tuesday, September 16, 14
m
Contextual
Supplementary
Convenience
Site Map
BREADTH OF STRUCTURE
SCHEMES & STRUCTURES
Tuesday, September 16, 14
m
Know Your Audience
Be Efficient
Anticipate what the user will expect to see
TAXONOMY TIPS
TAXONOMY & VOCABULARY
Tuesday, September 16, 14
m
Uniform method of describing things
Provides quality and consistency
Consistency means predictability
‘About’ or ‘About Us’?
‘Admission’ or ‘Admissions’
CONTROLLED VOCABULARY
TAXONOMY & VOCABULARY
Tuesday, September 16, 14
mStoner
INFORMATION ARCHITECTURE
INTRODUCTION
DEFINITION
ELEMENTS
PROCESS
IA PRACTICE ON CAMPUS
Tuesday, September 16, 14
m
Easy to read
Easier to modify / maintain
A good for representing the depth of the site.
Organized by numerical, legal structure
IA LISTING
DOCUMENTATION
Tuesday, September 16, 14
m
A way to visually represent the IA.
A good way to represent the breadth of the site.
Good at showing peer relationships such as related pages.
More work to maintain.
IA DIAGRAM / SITEMAP
DOCUMENTATION
Tuesday, September 16, 14
Admissions
Why Attend University of Idaho?
Undergraduate Admissions
Graduate Admissions
Law School Admissions
Contact Us
Visit Us
Transfer Admissions
How to Apply
Dates & Deadlines
Admission Requirements
Cost & Financial Aid
Majors & Minors
Frequently Asked Questions
Visit Us
Information for:> Accepted Students> First Year Students> Transfer Students> International Students> Non-degree Students
Non-degree Admissions
Tuesday, September 16, 14
m
OmniOutliner
Google Docs
UXPin
Any Word Processor or Spreadsheet
TOOLS
Tuesday, September 16, 14
mStoner
INFORMATION ARCHITECTURE
INTRODUCTION
DEFINITION
ELEMENTS
PROCESS
IA PRACTICE ON CAMPUS
Tuesday, September 16, 14
STAFFING
Ideal: Dedicated Information Architect on staff
Reality: Key point person for IA
Goal: All staff associated with the web need to be versed
WHO SHOULD DO IT?
Tuesday, September 16, 14
Demand that IA be taken seriously
Use the tools at your disposal
Read, watch, listen, learn - there is an entire IA community out there
BE A CHAMPION
EVANGELISM
Tuesday, September 16, 14
PROFESSIONAL DEVELOPMENT
Establish IA as a real thing, just like design, development, and content
Use case studies from industry
Insert IA into your training regimen
Build up expertise among staff who work in the UX family (hint: that’s everybody)
IA AT YOUR SCHOOL
Tuesday, September 16, 14
Information Architecture for the World Wide Web (Book):http://amzn.to/3RqL7y
Elements of User Experience (Book) http://amzn.to/18Q4fA4
Jesse James Garretthttp://www.jjg.net
Karen McGranehttp://karenmcgrane.com
RESOURCES
PROFESSIONAL DEVELOPMENT
Tuesday, September 16, 14
Adaptive Path adaptivepath.com/events-training
Smashing Magazinesmashingmagazine.com
A List Apart’s UX sectionalistapart.com/topics/user-experience
mStoner Blogmstoner.com/team/fran-zablocki/
RESOURCES
PROFESSIONAL DEVELOPMENT
Tuesday, September 16, 14
THANK YOU!QUESTIONS?
HELP US
HELP YOU
WITH IA
WWW.MSTONER.COM
FRAN.ZABLOCKI@MSTONER.COM
mStonerTuesday, September 16, 14
Recommended