The internet in your pants

11,826 views
11,058 views

Published on

*Based on "The web you were used to is gone" — delivered at General Assembly as part of Mike Atherton's UXDI course, in London, UK on 1/15/2014*

Information architecture and content strategy are the foundation of any website but, when it comes to mobile, they can literally mean the life or death of a product.

The truth is that even the best-designed and well-engineered mobile products can still fail if their IA is not sound, and that’s because mobile information architecture doesn’t only define the structure of content, but also determines how users will interact with it. And speaking of content, do you know what content should go on your mobile sites and apps? Are your users finding what they came for?

In this talk we will take a look at the thought process that drives mobile content strategy, the specific challenges and opportunities of the mobile space and how information architecture and content strategy contribute to the creation of outstanding cross-channel experiences.

Published in: Technology

The internet in your pants

  1. THE INTERNET IN YOUR PANTS TROUSERS Architecture and strategy for your mobile content alberta soranzo | @albertatrebla image: flickr.com/photos/gregoryjordan the internet in your pants trousers
  2. REMEMBER THE INTERNET? image: wtfjeans.com the internet in your pants trousers
  3. THE INTERNET IS IN YOUR PANTS image: wtfjeans.com the internet in your pants trousers
  4. WHAT IS MOBILE? image: huffingtonpost.com (Alamy) the internet in your pants trousers
  5. MOBILE USAGE STATISTICS • 86% of mobile internet users use their device while watching TV.  • By 2014, mobile internet usage will overtake desktop internet usage.  • Adults spend more time on mobile media than they do on newspapers and magazines combined.   source: pocketyourshop.wordpress.com the internet in your pants trousers
  6. MOBILE ONLY PAGEVIEWS the internet in your pants trousers
  7. WHAT IS MOBILE? image: flickr.com/photos/guidedbycthulhu the internet in your pants trousers
  8. MOBILE WEB STATISTICS • 99% of smartphone owners use their mobile browser at least once a day.  • 46% of consumers will NOT return to a mobile site that is not working properly.  • 39% of business do nothing to make site mobile-ready. • 74% of consumers will wait 5 seconds for a web page to load on their mobile device before abandoning the site. • 18% of all web traffic in the U.S. is mobile traffic. That number skyrockets to 24% in Africa, and 30% in Asia. This is up 192.5% since 2011. source: pocketyourshop.wordpress.com the internet in your pants trousers
  9. MOBILE ONLY USERS source: mobithinking.com the internet in your pants trousers
  10. MOBILE SEARCH STATISTICS • 95% of mobile users use their devices for local search.  • 52% of all local searches are done from a mobile device.  • 9 out of 10 mobile phone searches result in a purchase or visit.  • 3 out of every 5 searches are conducted on a mobile device.  source: pocketyourshop.wordpress.com the internet in your pants trousers
  11. DIRECTV the internet in your pants trousers
  12. DIRECTV the internet in your pants trousers
  13. DO YOU HAVE A WEBSITE? “You need to get your content onto mobile devices. Period.” — Karen McGrane the internet in your pants trousers
  14. WHO DECIDES WHAT MATTERS? image: flickr.com/photos/d_space the internet in your pants trousers
  15. MOBILE IS SOCIAL image: flickr.com/photos/strandloper/ the internet in your pants trousers
  16. MOBILE ONLY FACEBOOK source: allfacebook.com the internet in your pants trousers
  17. HOW WE USE THE INTERNET “If people want to do something on the internet, they will want to do it using their mobile device. Period.” — Karen McGrane the internet in your pants trousers
  18. WHAT ABOUT CONTEXT? image: flickr.com/photos/kattebelletje/ the internet in your pants trousers
  19. WHAT ABOUT CONTEXT? image: flickr.com/photos/piblet the internet in your pants trousers
  20. ONE SITE the internet in your pants trousers
  21. MANY DEVICES the internet in your pants trousers
  22. THERE IS NO SUCH A THING AS MOBILE IA image: flickr.com/photos/cannedtuna the internet in your pants trousers
  23. WHAT IS IA? The structural design of shared information environments. source: en.wikipedia.org/wiki/Information_architecture the internet in your pants trousers
  24. CROSS-CHANNEL IA BLUEPRINT image: tylertate.com/blog/2012/02/21/cross-channel-ia-blueprint.html the internet in your pants trousers
  25. TOUCHPOINTS MATRIX image: journalofia.org/volume1/issue1/02-brugnoli/jofia-0101-02-brugnoli.pdf the internet in your pants trousers
  26. WHAT DOES IA DO? IA interprets information and expresses distinctions between signs and systems of signs and involves the categorization of information into a coherent structure. source: en.wikipedia.org/wiki/Information_architecture the internet in your pants trousers
  27. DESKTOP the internet in your pants trousers
  28. TABLET the internet in your pants trousers
  29. MOBILE the internet in your pants trousers
  30. WAYFINDING STRUCTURE AS DESIGN PATTERNS image: Android Design Patterns the internet in your pants trousers
  31. MOBILE PATTERNS - HYERARCHY source: uxbooth.com the internet in your pants trousers
  32. MOBILE PATTERNS - HYERARCHY the internet in your pants trousers
  33. MOBILE PATTERNS - HUB & SPOKE source: uxbooth.com the internet in your pants trousers
  34. MOBILE PATTERNS - HUB & SPOKE the internet in your pants trousers
  35. MOBILE PATTERNS - NESTED DOLL source: uxbooth.com the internet in your pants trousers
  36. MOBILE PATTERNS - NESTED DOLL the internet in your pants trousers
  37. MOBILE PATTERNS - TABBED VIEW source: uxbooth.com the internet in your pants trousers
  38. MOBILE PATTERNS - TABBED VIEW the internet in your pants trousers
  39. MOBILE PATTERNS - BENTO BOX source: uxbooth.com the internet in your pants trousers
  40. MOBILE PATTERNS - BENTO BOX the internet in your pants trousers
  41. MOBILE PATTERNS - FILTERED VIEW source: uxbooth.com the internet in your pants trousers
  42. MOBILE PATTERNS - FILTERED VIEW Filter the internet in your pants trousers Filter
  43. SENSEMAKING MANAGING INFORMATION TO CREATE MEANING image: flickr.com/photos/10ch the internet in your pants trousers
  44. CONTENT = INFORMATION “Typically information foraging must be analysed as decision making under uncertainty” — Peter Pirolli the internet in your pants trousers
  45. CONTENT = INFORMATION “A strong information layer is the key to crosschannel success” — Andrea Resmini and Luca Rosati the internet in your pants trousers
  46. WAYFINDING FOR SENSEMAKING the internet in your pants trousers
  47. PROGRESSIVE DISCLOSURE the internet in your pants trousers
  48. THERE IS NO SUCH A THING AS MOBILE CONTENT STRATEGY image: abookapart.com the internet in your pants trousers
  49. THE CHALLENGE the internet in your pants trousers
  50. ADAPTIVE CONTENT • • • • • Reusable Strong structure Independent of presentation layer Metadata Content Management System (CMS) the internet in your pants trousers
  51. ADAPTIVE CONTENT the internet in your pants trousers
  52. REUSABLE CONTENT the internet in your pants trousers
  53. CONTENT MODEL the internet in your pants trousers
  54. STRUCTURED CONTENT Variable Label CHIS Data Source(s) Age Groups Levels Year Description Restrictions the internet in your pants trousers
  55. STRUCTURED CONTENT GLOBAL NAVIGATION AND SERVICE LINKS SEARCH LOGO AND SLOGAN MAIN NAVIGATION SLIDE TITLE (10 WORDS MAX) FEATURED PRODUCT 1 (3 WORDS MAX) CAROUSEL PHOTO FEATURED PRODUCT 2 (3 WORDS MAX) PUB SEARCH SLIDE TEASER (50 WORDS MAX) ASK THE EXPERT (100 WORDS MAX) HEALTH CARE REFORM (100 WORDS MAX) PROGRAM 1 (50 WORDS MAX) PROGRAM 2 (50 WORDS MAX) PROGRAM 2 (50 WORDS MAX) PROGRAM 1 (50 WORDS MAX) the internet in your pants trousers TOPIC CENTER (10 LINKS x 4 WORDS MAX) PROGRAM 2 (50 WORDS MAX) SPOTLIGHT (100 WORDS MAX) PROGRAM 2 (50 WORDS MAX) NEWS (5 LINKS x 10 WORDS MAX) NEWSLETTER SIGNUP
  56. STRUCTURED CONTENT GLOBAL NAVIGATION AND SERVICE LINKS SEARCH SLIDE TITLE (10 WORDS MAX) NAV CAROUSEL PHOTO SEARCH (SITE AND PUBS) CAROUSEL PHOTO THUMB SLIDE TEASER SHORT (10 WORDS MAX) SLIDE TEASER (50 WORDS MAX) FEATURED PRODUCT 1 (3 WORDS MAX) FEATURED PRODUCT 1 (3 WORDS MAX) PUB SEARCH FEATURED PRODUCT 2 (3 WORDS MAX) FEATURED PRODUCT 2 (3 WORDS MAX) TOPIC CENTER (10 LINKS x 4 WORDS MAX) NEWS (5 LINKS x 10 WORDS MAX) NEWS (5 LINKS x 10 WORDS MAX) NEWSLETTER SIGNUP the internet in your pants trousers TOPIC CENTER (5 LINKS x 4 WORDS MAX)
  57. THE INTERNET IN YOUR PANTS image: techpinions.com the internet in your pants trousers
  58. THE FUTURE WAS YESTERDAY the internet in your pants trousers
  59. THE FUTURE IS YESTERDAY image: slashgear.com the internet in your pants trousers
  60. BTW image: flickr.com/photos/gregoryjordan the internet in your pants trousers
  61. STEPHEN HAY the internet in your pants trousers
  62. thank you @albertatrebla albertasoranzo@gmail.com UCLA Center for Health Policy Research Illustration: Dan Willis the internet in your pants trousers
  63. RESOURCES Content Strategy for Mobile Karen McGrane A Book Apart, 2011 Pervasive Information Architecture Andrea Resmini, Luca Rosati Morgan Kaufman, 2012 Android Design Patterns Greg Nudelman Wiley, 2013 Information Foraging Theory: Adaptive Interaction with Information Peter Tirolli Oxford University Press (USA), 2009 Sense-making in Cross-channel Design. Fisher, J., Norris, S., & E. Buie (2012). Journal of Information Architecture. Vol. 4, No. 1-2. journalofia.org/volume4/issue2/02-fisher/ How Netflix Reverse Engineered Hollywood Alexis Madrigal - The Atlantic theatlantic.com/technology/archive/2014/01/how-netflix-reverse-engineered-hollywood/282679/ the internet in your pants trousers

×