mobile information architecture

EVERYTHING YOU ALREADY KNOWIS STILL RIGHT. SORT OF.

MOBILE INFORMATION

ARCHITECTURE

Presented by ANDY FITZGERALD

ABOUT ANDY

User Experience DesignerDeloitte Digital | Übermind

Information ArchitectSimpson Center for the Humanities

Doctor of Language & LiteratureUniversity of Washington

@andybywireIn 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  Digitalh&p://www.deloi&edigital.com/featured/digital-­‐disrup9on-­‐2x.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.

EPICURIOUSiPhone

EPICURIOUSiPhone

EPICURIOUSAndroid

EPICURIOUSAndroid

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 onedesign 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 & NAVIGATIONThe 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