SlideShare ist ein Scribd-Unternehmen logo
1 von 51
Downloaden Sie, um offline zu lesen
MOBILE
 INFORMATION
ARCHITECTURE
EVERYTHING YOU ALREADY KNOW
        IS STILL RIGHT. SORT OF.




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
Focus on Mobile & Emerging Technologies

  Mobile Strategy
  Concepts & Prototypes
  Consumer mobile & mCommerce
  Enterprise mobiles
  B2B mobile
  Public sector mobile
  Mobile readiness
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/digital-­‐disrup9on-­‐2x.png
Is design for mobile really so
different from web design?
.YES.
  &
 NO
.YES.
  &
 NO
DONALD NORMAN
The Design of Everyday Things (1988)

   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 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

 Future-proof content
   write for the “chunk”
   create content for re-use from the start

 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
CONTENT FIRST



  “THE MORE STRUCTURE YOU PUT INTO
  CONTENT THE FREER IT WILL
  BECOME.”

                        – Rachel Lovinger
                              @rlovinger
TAXONOMY & NAVIGATION


  “A TAXONOMY IS BOTH [...] A
  HIERARCHICAL CLASSIFICATION
  SYSTEM [AND] ANY MEANS OF
  ORGANIZING CONCEPTS OF
  KNOWLEDGE.”

                          –Heather Hedden,
                  The Accidental Taxonomist
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
TAXONOMY & NAVIGATION
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
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       Navigation
 Competitive Analysis   Labeling
 User Research          Wireframing
 Traffic Analysis         Interaction Design
 Personas               Usability Testing
 Use Cases              Visual Design
 Taxonomy &             Implementation
 Metadata               Oversight
DESIGN TASKS
Content Out              Context In
  Content Analysis         Navigation
  Competitive Analysis     Labeling
  User Research            Wireframing
  Traffic Analysis           Interaction Design
  Personas                 Usability Testing
  Use Cases                Visual Design
  Taxonomy &               Implementation
  Metadata                 Oversight
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

Weitere ähnliche Inhalte

Was ist angesagt?

User interface design: definitions, processes and principles
User interface design: definitions, processes and principlesUser interface design: definitions, processes and principles
User interface design: definitions, processes and principlesDavid Little
 
User interface and user experience ui ux design basics
User interface  and user experience ui ux design basicsUser interface  and user experience ui ux design basics
User interface and user experience ui ux design basicsRavi Bhadauria
 
Understanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun BabajideUnderstanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun BabajideBabajide Aroyewun
 
What’s the difference between a UX and UI designer? (Part two)
What’s the difference between a UX and UI designer? (Part two)What’s the difference between a UX and UI designer? (Part two)
What’s the difference between a UX and UI designer? (Part two)iFactory Digital
 
Human computer interaction
Human  computer interactionHuman  computer interaction
Human computer interactionAyusha Patnaik
 
User Interface Design Basic
User Interface Design BasicUser Interface Design Basic
User Interface Design BasicHeru WIjayanto
 
Mobile Information Architecture
Mobile Information ArchitectureMobile Information Architecture
Mobile Information ArchitectureLifna C.S
 
Human Computer Interaction (HCI)
Human Computer Interaction (HCI)Human Computer Interaction (HCI)
Human Computer Interaction (HCI)Lahiru Danushka
 
User Interface Design - Module 1 Introduction
User Interface Design - Module 1 IntroductionUser Interface Design - Module 1 Introduction
User Interface Design - Module 1 IntroductionbrindaN
 
Future of user interface design
Future of user interface designFuture of user interface design
Future of user interface designRanjeet Tayi
 
Accessible Design Presentation
Accessible Design PresentationAccessible Design Presentation
Accessible Design PresentationTopher Kanyuga
 
UI-UX Practical Talking - Mohamed Shehata
UI-UX Practical Talking - Mohamed ShehataUI-UX Practical Talking - Mohamed Shehata
UI-UX Practical Talking - Mohamed ShehataMohamed Shehata
 

Was ist angesagt? (20)

User interface design: definitions, processes and principles
User interface design: definitions, processes and principlesUser interface design: definitions, processes and principles
User interface design: definitions, processes and principles
 
User interface and user experience ui ux design basics
User interface  and user experience ui ux design basicsUser interface  and user experience ui ux design basics
User interface and user experience ui ux design basics
 
Hci activity#2
Hci activity#2Hci activity#2
Hci activity#2
 
software architecture
software architecturesoftware architecture
software architecture
 
UI/UX Design
UI/UX DesignUI/UX Design
UI/UX Design
 
Understanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun BabajideUnderstanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun Babajide
 
What’s the difference between a UX and UI designer? (Part two)
What’s the difference between a UX and UI designer? (Part two)What’s the difference between a UX and UI designer? (Part two)
What’s the difference between a UX and UI designer? (Part two)
 
Ui vs UX design
Ui vs UX designUi vs UX design
Ui vs UX design
 
Human computer interaction
Human  computer interactionHuman  computer interaction
Human computer interaction
 
User Interface Design Basic
User Interface Design BasicUser Interface Design Basic
User Interface Design Basic
 
Mobile Information Architecture
Mobile Information ArchitectureMobile Information Architecture
Mobile Information Architecture
 
UX/UI Design 101
UX/UI Design 101UX/UI Design 101
UX/UI Design 101
 
UX Usability Heuristics
UX Usability HeuristicsUX Usability Heuristics
UX Usability Heuristics
 
UI / UX Design Presentation
UI / UX Design PresentationUI / UX Design Presentation
UI / UX Design Presentation
 
Human Computer Interaction (HCI)
Human Computer Interaction (HCI)Human Computer Interaction (HCI)
Human Computer Interaction (HCI)
 
Heuristic evaluation
Heuristic evaluationHeuristic evaluation
Heuristic evaluation
 
User Interface Design - Module 1 Introduction
User Interface Design - Module 1 IntroductionUser Interface Design - Module 1 Introduction
User Interface Design - Module 1 Introduction
 
Future of user interface design
Future of user interface designFuture of user interface design
Future of user interface design
 
Accessible Design Presentation
Accessible Design PresentationAccessible Design Presentation
Accessible Design Presentation
 
UI-UX Practical Talking - Mohamed Shehata
UI-UX Practical Talking - Mohamed ShehataUI-UX Practical Talking - Mohamed Shehata
UI-UX Practical Talking - Mohamed Shehata
 

Andere mochten auch

Mobile Information Architecture and Interaction Design
Mobile Information Architecture and Interaction DesignMobile Information Architecture and Interaction Design
Mobile Information Architecture and Interaction DesignNick Finck
 
Information Architecture & UI Design
Information Architecture & UI DesignInformation Architecture & UI Design
Information Architecture & UI DesignIvano Malavolta
 
Mobile Application Development: Hybrid, Native and Mobile Web Apps
Mobile Application Development: Hybrid, Native and Mobile Web AppsMobile Application Development: Hybrid, Native and Mobile Web Apps
Mobile Application Development: Hybrid, Native and Mobile Web AppsPaul Sons
 
Different types of mobile apps
Different types of mobile appsDifferent types of mobile apps
Different types of mobile appsEric Melchor
 
Mobile Ecosystem
Mobile EcosystemMobile Ecosystem
Mobile EcosystemPragati Rai
 
Wireframing for Mobile App Developers
Wireframing for Mobile App DevelopersWireframing for Mobile App Developers
Wireframing for Mobile App DevelopersVeiko Raime
 
Mobile Thirst 2: Interaction Design in a mobile context
Mobile Thirst 2: Interaction Design in a mobile contextMobile Thirst 2: Interaction Design in a mobile context
Mobile Thirst 2: Interaction Design in a mobile contextMobiento
 
Google Analytic for Mobile Applications
Google Analytic for Mobile ApplicationsGoogle Analytic for Mobile Applications
Google Analytic for Mobile ApplicationsRajith Rajan
 
Giving a great user experience in a mobile app
Giving a great user experience in a mobile appGiving a great user experience in a mobile app
Giving a great user experience in a mobile appmattanderson496
 
Evaluating Mobile Usability Guidelines: Mobile Usability Guidelines
Evaluating Mobile Usability Guidelines: Mobile Usability GuidelinesEvaluating Mobile Usability Guidelines: Mobile Usability Guidelines
Evaluating Mobile Usability Guidelines: Mobile Usability GuidelinesElementive
 
Mobile Usability Testing
Mobile Usability TestingMobile Usability Testing
Mobile Usability TestingGeneXus
 
Usabilidad en Dispositivos Móviles (UNSIS 2014)
Usabilidad en Dispositivos Móviles (UNSIS 2014)Usabilidad en Dispositivos Móviles (UNSIS 2014)
Usabilidad en Dispositivos Móviles (UNSIS 2014)Mario A Moreno Rocha
 
Mobile App Analytics
Mobile App AnalyticsMobile App Analytics
Mobile App Analyticspragativbora
 
Presentacion Taller Usabilidad / UX
Presentacion Taller Usabilidad / UX Presentacion Taller Usabilidad / UX
Presentacion Taller Usabilidad / UX Mario A Moreno Rocha
 
Mobile architecture overview
Mobile architecture overviewMobile architecture overview
Mobile architecture overviewDavid Scruggs
 
Web analytics como herramienta de Diseño
Web analytics como herramienta de DiseñoWeb analytics como herramienta de Diseño
Web analytics como herramienta de DiseñoSol Mesz
 
Personal Branding 101: A Checklist To Help You Shine [GDC 2016]
Personal Branding 101: A Checklist To Help You Shine [GDC 2016]Personal Branding 101: A Checklist To Help You Shine [GDC 2016]
Personal Branding 101: A Checklist To Help You Shine [GDC 2016]Sheri Rubin
 
Going Mobile - A Pragmatic Look At Mobile Design
Going Mobile - A Pragmatic Look At Mobile DesignGoing Mobile - A Pragmatic Look At Mobile Design
Going Mobile - A Pragmatic Look At Mobile DesignBryan Rieger
 
[2016/2017] Modern development paradigms
[2016/2017] Modern development paradigms [2016/2017] Modern development paradigms
[2016/2017] Modern development paradigms Ivano Malavolta
 

Andere mochten auch (20)

Mobile Information Architecture and Interaction Design
Mobile Information Architecture and Interaction DesignMobile Information Architecture and Interaction Design
Mobile Information Architecture and Interaction Design
 
The Mobile Ecosystem
The Mobile EcosystemThe Mobile Ecosystem
The Mobile Ecosystem
 
Information Architecture & UI Design
Information Architecture & UI DesignInformation Architecture & UI Design
Information Architecture & UI Design
 
Mobile Application Development: Hybrid, Native and Mobile Web Apps
Mobile Application Development: Hybrid, Native and Mobile Web AppsMobile Application Development: Hybrid, Native and Mobile Web Apps
Mobile Application Development: Hybrid, Native and Mobile Web Apps
 
Different types of mobile apps
Different types of mobile appsDifferent types of mobile apps
Different types of mobile apps
 
Mobile Ecosystem
Mobile EcosystemMobile Ecosystem
Mobile Ecosystem
 
Wireframing for Mobile App Developers
Wireframing for Mobile App DevelopersWireframing for Mobile App Developers
Wireframing for Mobile App Developers
 
Mobile Thirst 2: Interaction Design in a mobile context
Mobile Thirst 2: Interaction Design in a mobile contextMobile Thirst 2: Interaction Design in a mobile context
Mobile Thirst 2: Interaction Design in a mobile context
 
Google Analytic for Mobile Applications
Google Analytic for Mobile ApplicationsGoogle Analytic for Mobile Applications
Google Analytic for Mobile Applications
 
Giving a great user experience in a mobile app
Giving a great user experience in a mobile appGiving a great user experience in a mobile app
Giving a great user experience in a mobile app
 
Evaluating Mobile Usability Guidelines: Mobile Usability Guidelines
Evaluating Mobile Usability Guidelines: Mobile Usability GuidelinesEvaluating Mobile Usability Guidelines: Mobile Usability Guidelines
Evaluating Mobile Usability Guidelines: Mobile Usability Guidelines
 
Mobile Usability Testing
Mobile Usability TestingMobile Usability Testing
Mobile Usability Testing
 
Usabilidad en Dispositivos Móviles (UNSIS 2014)
Usabilidad en Dispositivos Móviles (UNSIS 2014)Usabilidad en Dispositivos Móviles (UNSIS 2014)
Usabilidad en Dispositivos Móviles (UNSIS 2014)
 
Mobile App Analytics
Mobile App AnalyticsMobile App Analytics
Mobile App Analytics
 
Presentacion Taller Usabilidad / UX
Presentacion Taller Usabilidad / UX Presentacion Taller Usabilidad / UX
Presentacion Taller Usabilidad / UX
 
Mobile architecture overview
Mobile architecture overviewMobile architecture overview
Mobile architecture overview
 
Web analytics como herramienta de Diseño
Web analytics como herramienta de DiseñoWeb analytics como herramienta de Diseño
Web analytics como herramienta de Diseño
 
Personal Branding 101: A Checklist To Help You Shine [GDC 2016]
Personal Branding 101: A Checklist To Help You Shine [GDC 2016]Personal Branding 101: A Checklist To Help You Shine [GDC 2016]
Personal Branding 101: A Checklist To Help You Shine [GDC 2016]
 
Going Mobile - A Pragmatic Look At Mobile Design
Going Mobile - A Pragmatic Look At Mobile DesignGoing Mobile - A Pragmatic Look At Mobile Design
Going Mobile - A Pragmatic Look At Mobile Design
 
[2016/2017] Modern development paradigms
[2016/2017] Modern development paradigms [2016/2017] Modern development paradigms
[2016/2017] Modern development paradigms
 

Ähnlich wie Mobile Information Architecture

6 Rules to Designing Amazing Mobile Apps (@media 2011)
6 Rules to Designing Amazing Mobile Apps (@media 2011)6 Rules to Designing Amazing Mobile Apps (@media 2011)
6 Rules to Designing Amazing Mobile Apps (@media 2011)Brian Fling
 
#1NWebinar: Digital on the Runway
#1NWebinar: Digital on the Runway#1NWebinar: Digital on the Runway
#1NWebinar: Digital on the RunwayOne North
 
Enabled 100413062333-phpapp02
Enabled 100413062333-phpapp02Enabled 100413062333-phpapp02
Enabled 100413062333-phpapp02Moorthy Haribabu
 
Functional Design Lab
Functional Design LabFunctional Design Lab
Functional Design LabiFactory
 
Roadmap to Mobile Learning Webinar
Roadmap to Mobile Learning WebinarRoadmap to Mobile Learning Webinar
Roadmap to Mobile Learning WebinarMicroAssist, Inc
 
UX Design by Havas' 18 with UCLA
UX Design by Havas' 18 with UCLAUX Design by Havas' 18 with UCLA
UX Design by Havas' 18 with UCLA18Hubs
 
Content strategy for mobile by letruongan.com
Content strategy for mobile by letruongan.comContent strategy for mobile by letruongan.com
Content strategy for mobile by letruongan.comAn Le Truong
 
Is collaboration the future of business IT? - Patrick Bolger, Hornbill
Is collaboration the future of business IT? - Patrick Bolger, HornbillIs collaboration the future of business IT? - Patrick Bolger, Hornbill
Is collaboration the future of business IT? - Patrick Bolger, HornbillSITS - The ITSM Show
 
Understanding Information Architecture
Understanding Information ArchitectureUnderstanding Information Architecture
Understanding Information ArchitectureTejinder Singh
 
Tincan - Mobile Elephant
Tincan - Mobile ElephantTincan - Mobile Elephant
Tincan - Mobile ElephantBen Holliday
 
Information Architecture: Get Your Blue Prints in Order
Information Architecture: Get Your Blue Prints in OrderInformation Architecture: Get Your Blue Prints in Order
Information Architecture: Get Your Blue Prints in OrderBusinessOnline
 
Top Three Modern Product Trends
Top Three Modern Product TrendsTop Three Modern Product Trends
Top Three Modern Product TrendsJeremy Johnson
 
The Future Friendly Campus
The Future Friendly CampusThe Future Friendly Campus
The Future Friendly CampusDave Olsen
 
Website Usability | Day 1
Website Usability | Day 1Website Usability | Day 1
Website Usability | Day 1studiokandm
 
Conversational Interfaces. Andrew Larking and Ronald Ashri at Museum Tech 2017.
Conversational Interfaces. Andrew Larking and Ronald Ashri at Museum Tech 2017.Conversational Interfaces. Andrew Larking and Ronald Ashri at Museum Tech 2017.
Conversational Interfaces. Andrew Larking and Ronald Ashri at Museum Tech 2017.Deeson
 
Wipro web3.0 seminar-brochure
Wipro web3.0 seminar-brochureWipro web3.0 seminar-brochure
Wipro web3.0 seminar-brochureNagaraju Pappu
 

Ähnlich wie Mobile Information Architecture (20)

6 Rules to Designing Amazing Mobile Apps (@media 2011)
6 Rules to Designing Amazing Mobile Apps (@media 2011)6 Rules to Designing Amazing Mobile Apps (@media 2011)
6 Rules to Designing Amazing Mobile Apps (@media 2011)
 
#1NWebinar: Digital on the Runway
#1NWebinar: Digital on the Runway#1NWebinar: Digital on the Runway
#1NWebinar: Digital on the Runway
 
Enabled
EnabledEnabled
Enabled
 
Enabled 100413062333-phpapp02
Enabled 100413062333-phpapp02Enabled 100413062333-phpapp02
Enabled 100413062333-phpapp02
 
Functional Design Lab
Functional Design LabFunctional Design Lab
Functional Design Lab
 
Roadmap to Mobile Learning Webinar
Roadmap to Mobile Learning WebinarRoadmap to Mobile Learning Webinar
Roadmap to Mobile Learning Webinar
 
User Experience
User ExperienceUser Experience
User Experience
 
UX Design by Havas' 18 with UCLA
UX Design by Havas' 18 with UCLAUX Design by Havas' 18 with UCLA
UX Design by Havas' 18 with UCLA
 
Content strategy for mobile by letruongan.com
Content strategy for mobile by letruongan.comContent strategy for mobile by letruongan.com
Content strategy for mobile by letruongan.com
 
Is collaboration the future of business IT? - Patrick Bolger, Hornbill
Is collaboration the future of business IT? - Patrick Bolger, HornbillIs collaboration the future of business IT? - Patrick Bolger, Hornbill
Is collaboration the future of business IT? - Patrick Bolger, Hornbill
 
Understanding Information Architecture
Understanding Information ArchitectureUnderstanding Information Architecture
Understanding Information Architecture
 
Intro To Ia
Intro To IaIntro To Ia
Intro To Ia
 
Tincan - Mobile Elephant
Tincan - Mobile ElephantTincan - Mobile Elephant
Tincan - Mobile Elephant
 
Information Architecture: Get Your Blue Prints in Order
Information Architecture: Get Your Blue Prints in OrderInformation Architecture: Get Your Blue Prints in Order
Information Architecture: Get Your Blue Prints in Order
 
Top Three Modern Product Trends
Top Three Modern Product TrendsTop Three Modern Product Trends
Top Three Modern Product Trends
 
The Future Friendly Campus
The Future Friendly CampusThe Future Friendly Campus
The Future Friendly Campus
 
What is IA?
What is IA?What is IA?
What is IA?
 
Website Usability | Day 1
Website Usability | Day 1Website Usability | Day 1
Website Usability | Day 1
 
Conversational Interfaces. Andrew Larking and Ronald Ashri at Museum Tech 2017.
Conversational Interfaces. Andrew Larking and Ronald Ashri at Museum Tech 2017.Conversational Interfaces. Andrew Larking and Ronald Ashri at Museum Tech 2017.
Conversational Interfaces. Andrew Larking and Ronald Ashri at Museum Tech 2017.
 
Wipro web3.0 seminar-brochure
Wipro web3.0 seminar-brochureWipro web3.0 seminar-brochure
Wipro web3.0 seminar-brochure
 

Mehr von Andy Fitzgerald

Prototyping Information Architecture
Prototyping Information ArchitecturePrototyping Information Architecture
Prototyping Information ArchitectureAndy Fitzgerald
 
Language Arts for the Lizard Brain: Vocabulary Design for the Predictably Ir...
 Language Arts for the Lizard Brain: Vocabulary Design for the Predictably Ir... Language Arts for the Lizard Brain: Vocabulary Design for the Predictably Ir...
Language Arts for the Lizard Brain: Vocabulary Design for the Predictably Ir...Andy Fitzgerald
 
Content First Prototyping
Content First PrototypingContent First Prototyping
Content First PrototypingAndy Fitzgerald
 
Designing for the Human Scale
Designing for the Human ScaleDesigning for the Human Scale
Designing for the Human ScaleAndy Fitzgerald
 
Desiring Ecologies: Meaning-Making in the Network Wilderness
Desiring Ecologies: Meaning-Making in the Network WildernessDesiring Ecologies: Meaning-Making in the Network Wilderness
Desiring Ecologies: Meaning-Making in the Network WildernessAndy Fitzgerald
 
Information Design: Coherent Concepts for Connected Ecologies
Information Design: Coherent Concepts for Connected EcologiesInformation Design: Coherent Concepts for Connected Ecologies
Information Design: Coherent Concepts for Connected EcologiesAndy Fitzgerald
 
Responsive Information Architectures
Responsive Information ArchitecturesResponsive Information Architectures
Responsive Information ArchitecturesAndy Fitzgerald
 
Information Architecture & Content Strategy
Information Architecture & Content StrategyInformation Architecture & Content Strategy
Information Architecture & Content StrategyAndy Fitzgerald
 
Designing for Tablets & Smart TVs
Designing for Tablets & Smart TVs Designing for Tablets & Smart TVs
Designing for Tablets & Smart TVs Andy Fitzgerald
 
When Bears Attack: How a Clean Mobile Interface Could Save Your Life
When Bears Attack: How a Clean Mobile Interface Could Save Your LifeWhen Bears Attack: How a Clean Mobile Interface Could Save Your Life
When Bears Attack: How a Clean Mobile Interface Could Save Your LifeAndy Fitzgerald
 
Information Architecture Summit 2012 Recap
Information Architecture Summit 2012 RecapInformation Architecture Summit 2012 Recap
Information Architecture Summit 2012 RecapAndy Fitzgerald
 

Mehr von Andy Fitzgerald (13)

Prototyping Information Architecture
Prototyping Information ArchitecturePrototyping Information Architecture
Prototyping Information Architecture
 
Language Arts for the Lizard Brain: Vocabulary Design for the Predictably Ir...
 Language Arts for the Lizard Brain: Vocabulary Design for the Predictably Ir... Language Arts for the Lizard Brain: Vocabulary Design for the Predictably Ir...
Language Arts for the Lizard Brain: Vocabulary Design for the Predictably Ir...
 
Content First Prototyping
Content First PrototypingContent First Prototyping
Content First Prototyping
 
Designing for the Human Scale
Designing for the Human ScaleDesigning for the Human Scale
Designing for the Human Scale
 
Desiring Ecologies: Meaning-Making in the Network Wilderness
Desiring Ecologies: Meaning-Making in the Network WildernessDesiring Ecologies: Meaning-Making in the Network Wilderness
Desiring Ecologies: Meaning-Making in the Network Wilderness
 
Information Design: Coherent Concepts for Connected Ecologies
Information Design: Coherent Concepts for Connected EcologiesInformation Design: Coherent Concepts for Connected Ecologies
Information Design: Coherent Concepts for Connected Ecologies
 
Responsive Information Architectures
Responsive Information ArchitecturesResponsive Information Architectures
Responsive Information Architectures
 
Taxonomy for App Makers
Taxonomy for App MakersTaxonomy for App Makers
Taxonomy for App Makers
 
Information Architecture & Content Strategy
Information Architecture & Content StrategyInformation Architecture & Content Strategy
Information Architecture & Content Strategy
 
Designing for Tablets & Smart TVs
Designing for Tablets & Smart TVs Designing for Tablets & Smart TVs
Designing for Tablets & Smart TVs
 
When Bears Attack: How a Clean Mobile Interface Could Save Your Life
When Bears Attack: How a Clean Mobile Interface Could Save Your LifeWhen Bears Attack: How a Clean Mobile Interface Could Save Your Life
When Bears Attack: How a Clean Mobile Interface Could Save Your Life
 
Android UX & Design
Android UX & DesignAndroid UX & Design
Android UX & Design
 
Information Architecture Summit 2012 Recap
Information Architecture Summit 2012 RecapInformation Architecture Summit 2012 Recap
Information Architecture Summit 2012 Recap
 

Kürzlich hochgeladen

Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...
Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...
Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...Scott Andery
 
Take control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteTake control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteDianaGray10
 
Generative Artificial Intelligence: How generative AI works.pdf
Generative Artificial Intelligence: How generative AI works.pdfGenerative Artificial Intelligence: How generative AI works.pdf
Generative Artificial Intelligence: How generative AI works.pdfIngrid Airi González
 
[Webinar] SpiraTest - Setting New Standards in Quality Assurance
[Webinar] SpiraTest - Setting New Standards in Quality Assurance[Webinar] SpiraTest - Setting New Standards in Quality Assurance
[Webinar] SpiraTest - Setting New Standards in Quality AssuranceInflectra
 
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...Alkin Tezuysal
 
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsThe Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsPixlogix Infotech
 
Potential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and InsightsPotential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and InsightsRavi Sanghani
 
Emixa Mendix Meetup 11 April 2024 about Mendix Native development
Emixa Mendix Meetup 11 April 2024 about Mendix Native developmentEmixa Mendix Meetup 11 April 2024 about Mendix Native development
Emixa Mendix Meetup 11 April 2024 about Mendix Native developmentPim van der Noll
 
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better StrongerModern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Strongerpanagenda
 
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
Testing tools and AI - ideas what to try with some tool examples
Testing tools and AI - ideas what to try with some tool examplesTesting tools and AI - ideas what to try with some tool examples
Testing tools and AI - ideas what to try with some tool examplesKari Kakkonen
 
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfMoving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfLoriGlavin3
 
Generative AI for Technical Writer or Information Developers
Generative AI for Technical Writer or Information DevelopersGenerative AI for Technical Writer or Information Developers
Generative AI for Technical Writer or Information DevelopersRaghuram Pandurangan
 
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxMerck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxLoriGlavin3
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
Scale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterScale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterMydbops
 
Connecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdfConnecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdfNeo4j
 
Data governance with Unity Catalog Presentation
Data governance with Unity Catalog PresentationData governance with Unity Catalog Presentation
Data governance with Unity Catalog PresentationKnoldus Inc.
 
Sample pptx for embedding into website for demo
Sample pptx for embedding into website for demoSample pptx for embedding into website for demo
Sample pptx for embedding into website for demoHarshalMandlekar2
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity PlanDatabarracks
 

Kürzlich hochgeladen (20)

Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...
Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...
Enhancing User Experience - Exploring the Latest Features of Tallyman Axis Lo...
 
Take control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteTake control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test Suite
 
Generative Artificial Intelligence: How generative AI works.pdf
Generative Artificial Intelligence: How generative AI works.pdfGenerative Artificial Intelligence: How generative AI works.pdf
Generative Artificial Intelligence: How generative AI works.pdf
 
[Webinar] SpiraTest - Setting New Standards in Quality Assurance
[Webinar] SpiraTest - Setting New Standards in Quality Assurance[Webinar] SpiraTest - Setting New Standards in Quality Assurance
[Webinar] SpiraTest - Setting New Standards in Quality Assurance
 
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
 
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsThe Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and Cons
 
Potential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and InsightsPotential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and Insights
 
Emixa Mendix Meetup 11 April 2024 about Mendix Native development
Emixa Mendix Meetup 11 April 2024 about Mendix Native developmentEmixa Mendix Meetup 11 April 2024 about Mendix Native development
Emixa Mendix Meetup 11 April 2024 about Mendix Native development
 
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better StrongerModern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
 
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
Testing tools and AI - ideas what to try with some tool examples
Testing tools and AI - ideas what to try with some tool examplesTesting tools and AI - ideas what to try with some tool examples
Testing tools and AI - ideas what to try with some tool examples
 
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfMoving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdf
 
Generative AI for Technical Writer or Information Developers
Generative AI for Technical Writer or Information DevelopersGenerative AI for Technical Writer or Information Developers
Generative AI for Technical Writer or Information Developers
 
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxMerck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
Scale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterScale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL Router
 
Connecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdfConnecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdf
 
Data governance with Unity Catalog Presentation
Data governance with Unity Catalog PresentationData governance with Unity Catalog Presentation
Data governance with Unity Catalog Presentation
 
Sample pptx for embedding into website for demo
Sample pptx for embedding into website for demoSample pptx for embedding into website for demo
Sample pptx for embedding into website for demo
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity Plan
 

Mobile Information Architecture

  • 1. MOBILE INFORMATION ARCHITECTURE EVERYTHING YOU ALREADY KNOW IS STILL RIGHT. SORT OF. Presented by ANDY FITZGERALD
  • 2. 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
  • 3. ABOUT DELOITTE DIGITAL Focus on Mobile & Emerging Technologies Mobile Strategy Concepts & Prototypes Consumer mobile & mCommerce Enterprise mobiles B2B mobile Public sector mobile Mobile readiness
  • 4. Why does mobile matter?
  • 5. 4.8 billion people worldwide own mobile phones
  • 6. 4.8 billion people worldwide own mobile phones (4.2 billion people worldwide own toothbrushes).
  • 7. 4.8 billion people worldwide own mobile phones (4.2 billion people worldwide own toothbrushes). There are 1.2 billion mobile web users worldwide.
  • 8. 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.
  • 9. 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/digital-­‐disrup9on-­‐2x.png
  • 10. Is design for mobile really so different from web design?
  • 11. .YES. & NO
  • 12. .YES. & NO
  • 13. DONALD NORMAN The Design of Everyday Things (1988) 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
  • 14. THE WAY WE USE THE WEB RELIES HEAVILY ON “KNOWLEDGE IN THE HEAD.” WE HAVE INTERNALIZED THIS KNOWLEDGE REALLY WELL.
  • 15. THE WAY WE USE THE WEB RELIES HEAVILY ON “KNOWLEDGE IN THE HEAD.” WE HAVE INTERNALIZED THIS KNOWLEDGE REALLY WELL.
  • 16.
  • 17. WE’RE ALSO GOOD AT INTERNALIZING THE “HEAD KNOWLEDGE” WE USE IN MOBILE. INSTEAD OF ONE KNOWLEDGE PATTERN, HOWEVER, THERE ARE DOZENS.
  • 18. WE’RE ALSO GOOD AT INTERNALIZING THE “HEAD KNOWLEDGE” WE USE IN MOBILE. INSTEAD OF ONE KNOWLEDGE PATTERN, HOWEVER, THERE ARE DOZENS.
  • 19.
  • 21.
  • 22. DESIGN GUIDES ARE OPTIONAL, RIGHT? SOMETIMES YOU WANT YOUR APP TO LOOK THE SAME ACROSS DEVICES.
  • 27. 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)
  • 28. So how does one design for mobile?
  • 29. INFORMATION ARCHITECTURE HAPPENS BY DESIGN OR BY DEFAULT. WE HAVE INTERNALIZED THIS KNOWLEDGE REALLY WELL.
  • 30. DESIGNING FOR MOBILE Put content first Separate taxonomy and navigation Learn patterns
  • 31. CONTENT FIRST Future-proof content write for the “chunk” create content for re-use from the start 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
  • 32. CONTENT FIRST “THE MORE STRUCTURE YOU PUT INTO CONTENT THE FREER IT WILL BECOME.” – Rachel Lovinger @rlovinger
  • 33. TAXONOMY & NAVIGATION “A TAXONOMY IS BOTH [...] A HIERARCHICAL CLASSIFICATION SYSTEM [AND] ANY MEANS OF ORGANIZING CONCEPTS OF KNOWLEDGE.” –Heather Hedden, The Accidental Taxonomist
  • 34. 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.
  • 35. TAXONOMY & NAVIGATION The tools we use for web bring with them assumptions that can be hard to shake
  • 36. TAXONOMY & NAVIGATION Cleanly capture the organization and structure of your content to keep it free from context-specific constraints
  • 37. TAXONOMY & NAVIGATION Design navigation to fit a device-specific context
  • 41. 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
  • 42. Doesn’t this make for more work?
  • 43. EXPERIENCE HAPPENS WHEN CONTENT AND INTERACTION MEET IN THE MIND OF THE USER
  • 44. DESIGN TASKS Content Analysis Competitive Analysis User Research Traffic Analysis Personas Use Cases Taxonomy & Metadata
  • 45. DESIGN TASKS Content Analysis Navigation Competitive Analysis Labeling User Research Wireframing Traffic Analysis Interaction Design Personas Usability Testing Use Cases Visual Design Taxonomy & Implementation Metadata Oversight
  • 46. DESIGN TASKS Content Out Context In Content Analysis Navigation Competitive Analysis Labeling User Research Wireframing Traffic Analysis Interaction Design Personas Usability Testing Use Cases Visual Design Taxonomy & Implementation Metadata Oversight
  • 47. 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
  • 48. Recap
  • 49. 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
  • 50. Q&A
  • 51. THANK YOU! Presented by ANDY FITZGERALD