Mobile Information Architecture

andybywire 4,388 views 51 slides Sep 23, 2012
Slide 1
Slide 1 of 51
Slide 1
1
Slide 2
2
Slide 3
3
Slide 4
4
Slide 5
5
Slide 6
6
Slide 7
7
Slide 8
8
Slide 9
9
Slide 10
10
Slide 11
11
Slide 12
12
Slide 13
13
Slide 14
14
Slide 15
15
Slide 16
16
Slide 17
17
Slide 18
18
Slide 19
19
Slide 20
20
Slide 21
21
Slide 22
22
Slide 23
23
Slide 24
24
Slide 25
25
Slide 26
26
Slide 27
27
Slide 28
28
Slide 29
29
Slide 30
30
Slide 31
31
Slide 32
32
Slide 33
33
Slide 34
34
Slide 35
35
Slide 36
36
Slide 37
37
Slide 38
38
Slide 39
39
Slide 40
40
Slide 41
41
Slide 42
42
Slide 43
43
Slide 44
44
Slide 45
45
Slide 46
46
Slide 47
47
Slide 48
48
Slide 49
49
Slide 50
50
Slide 51
51

About This Presentation

A talk I gave on Mobile IA at the University of Washington iSchool's Information Architecture Summer Institute. Presented in Seattle, June 2012.

[Originally uploaded to Slideshare June 21, 2012]


Slide Content

EVERYTHING YOU ALREADY KNOW
IS STILL RIGHT. SORT OF.
MOBILE
INFORMATION
ARCHITECTURE
Presented by ANDY FITZGERALD

ABOUT ANDY
User Experience Designer
Deloitte Digital | Übermind
Information Architect
Simpson Center for the Humanities
Doctor of Language & Literature
University of Washington
@andybywire
In the Twittersphere

ABOUT DELOITTE DIGITAL
Mobile Strategy
Concepts & Prototypes
Consumer mobile & mCommerce
Enterprise mobiles
B2B mobile
Public sector mobile
Mobile readiness
Focus on Mobile & Emerging Technologies

Why does mobile matter?

4.8 billion people worldwide own mobile phones

4.8 billion people worldwide own mobile phones
(4.2 billion people worldwide own toothbrushes).

4.8 billion people worldwide own mobile phones
(4.2 billion people worldwide own toothbrushes).
There are 1.2 billion mobile web users worldwide.

4.8 billion people worldwide own mobile phones
(4.2 billion people worldwide own toothbrushes).
There are 1.2 billion mobile web users worldwide.
The number of mobile-connected devices will
exceed the world’s population in 2012.

4.8 billion people worldwide own mobile phones
(4.2 billion people worldwide own toothbrushes).
There are 1.2 billion mobile web users worldwide.
The number of mobile-connected devices will
exceed the world’s population in 2012.
Mobile internet use is expected to surpass desktop
by 2014.
Digital'Disrup,on,'Deloi&e'Digital
h&p://www.deloi&edigital.com/featured/digital7disrup9on72x.png

Is design for mobile really so
different from web design?

.YES.
&
NO

.YES.
&
NO

DONALD NORMAN
Knowledge in the World
Interpretation substitutes for learning
High ease of use on first encounter
Efficiency slowed by the need of interpretation
Knowledge in the Head
Requires learning
Low ease of use on first encounter
Highly efficient
The Design of Everyday Things (1988)

THE WAY WE USE THE WEB RELIES HEAVILY ON
“KNOWLEDGE IN THE HEAD.”
WE HAVE INTERNALIZED THIS KNOWLEDGE
REALLY WELL.

THE WAY WE USE THE WEB RELIES HEAVILY ON
“KNOWLEDGE IN THE HEAD.”
WE HAVE INTERNALIZED THIS KNOWLEDGE
REALLY WELL.

WE’RE ALSO GOOD AT INTERNALIZING THE
“HEAD KNOWLEDGE” WE USE IN MOBILE.
INSTEAD OF ONE KNOWLEDGE PATTERN,
HOWEVER, THERE ARE DOZENS.

WE’RE ALSO GOOD AT INTERNALIZING THE
“HEAD KNOWLEDGE” WE USE IN MOBILE.
INSTEAD OF ONE KNOWLEDGE PATTERN,
HOWEVER, THERE ARE DOZENS.

AND THEN THERE’S NATIVE.

DESIGN GUIDES ARE OPTIONAL, RIGHT?
SOMETIMES YOU WANT YOUR APP TO
LOOK THE SAME ACROSS DEVICES.

EPICURIOUS
iPhone

EPICURIOUS
iPhone

EPICURIOUS
Android

EPICURIOUS
Android

PORTING PITFALLS
Ugly user interface
Poor use of “Knowledge in the Head”
Shortchanges device capabilities
Require “hacks” that lead to poor performance and
unreliability
Create poor forward compatibility of design work
Generate aggravating user experiences
(& resulting negative feedback and brand damage)

So how does one
design for mobile?

INFORMATION ARCHITECTURE HAPPENS
BY DESIGN OR BY DEFAULT.
WE HAVE INTERNALIZED THIS KNOWLEDGE
REALLY WELL.

DESIGNING FOR MOBILE
Put content first
Separate taxonomy and navigation
Learn patterns

CONTENT FIRST
Leverage metadata
design for dynamically generated pages that respond to
presentation and context
Adapted'from'Adap,ng'Ourselves'to'Adap,ve'Content,'
Karen'McGrane'@'IAS12
Future-proof content
write for the “chunk”
create content for re-use from the start

“THE MORE STRUCTURE YOU PUT INTO
CONTENT THE FREER IT WILL
BECOME.”
– Rachel Lovinger
@rlovinger
CONTENT FIRST

“A TAXONOMY IS BOTH [...] A
HIERARCHICAL CLASSIFICATION
SYSTEM [AND] ANY MEANS OF
ORGANIZING CONCEPTS OF
KNOWLEDGE.”
–Heather Hedden,
The Accidental Taxonomist
TAXONOMY & NAVIGATION

TAXONOMY & NAVIGATION
Design taxonomies, categories, and classification
schemes to make the organization of content
intelligible to users.
Design navigation and interaction to make using that
content context appropriate.

TAXONOMY & NAVIGATION
The tools we use for web bring with them assumptions
that can be hard to shake

Cleanly capture the organization and structure of your
content to keep it free from context-specific constraints
TAXONOMY & NAVIGATION

Design navigation to fit a device-specific context
TAXONOMY & NAVIGATION

LEARN PATTERNS

EVERNOTE

EVERNOTE

DELIBERATE DESIGN
Facilitates architectural parity across multiple
contexts
Leverages device specific “knowledge in the head”
Leverages device and context specific capabilities
Is future friendly
Fits naturally into device ecosystems

Doesn’t this make for
more work?

EXPERIENCE HAPPENS WHEN
CONTENT AND INTERACTION MEET
IN THE MIND OF THE USER

DESIGN TASKS
Content Analysis
Competitive Analysis
User Research
Traffic Analysis
Personas
Use Cases
Taxonomy &
Metadata

DESIGN TASKS
Content Analysis
Competitive Analysis
User Research
Traffic Analysis
Personas
Use Cases
Taxonomy &
Metadata
Navigation
Labeling
Wireframing
Interaction Design
Usability Testing
Visual Design
Implementation
Oversight

DESIGN TASKS
Content Analysis
Competitive Analysis
User Research
Traffic Analysis
Personas
Use Cases
Taxonomy &
Metadata
Navigation
Labeling
Wireframing
Interaction Design
Usability Testing
Visual Design
Implementation
Oversight
Content Out Context In

KEEPING CONTENT &
CONTEXT DISTINCT
Create clarity of purpose upon which to make and
support sound user experience decisions
Guard against falling into default patterns
Build a future-friendly and re-useable foundation

Recap

IA FOR MOBILE
Mobile is growing fast and gaining momentum
You can leverage “knowledge in the head” to keep
pace with mobile’s rate of expansion
Mobile friendly design:
puts content first
designs for taxonomy & navigation deliberately
uses patterns to bridge device differences
Deliberate decisions allow you to better defend
design choices and to create future-friendly
foundations

Q&A

THANK YOU!
Presented by ANDY FITZGERALD