Internet in your pocket
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

Internet in your pocket

  • 10,339 views
Uploaded on

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

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.

Webinar — May 28th, 2014
http://www.architecta.it/imparare/internet-in-tasca/

More in: Mobile , Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
10,339
On Slideshare
8,299
From Embeds
2,040
Number of Embeds
21

Actions

Shares
Downloads
576
Comments
6
Likes
156

Embeds 2,040

http://www.macsafe.at 1,466
http://faz.my 297
http://editor-5386a11525f06e8b31000037.lvh.me 97
http://stuffs4cse.blogspot.in 51
https://twitter.com 29
http://localhost 26
http://moodle.uisek.edu.ec 19
http://mangastorytelling.tistory.com 16
https://www.lytespark.com 10
http://10.0.0.90 9
http://www.google.com 4
http://10.0.0.42 3
http://macsafe.at 2
http://www.linkedin.com 2
https://home.jolicloud.com 2
http://stuffs4cse.blogspot.com 2
http://www.hanrss.com 1
https://www.linkedin.com 1
http://www.ordinoapp.com 1
http://htmledit.squarefree.com 1
http://tweetedtimes.com 1

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. image: flickr.com/photos/gregoryjordan Architecture and strategy for your mobile content ! ! ! ! ! ! alberta soranzo | @albertatrebla THE INTERNET IN YOUR POCKET
  • 2. REMEMBER THE INTERNET? image: wtfjeans.com
  • 3. THE INTERNET IS IN YOUR POCKET image: wtfjeans.com
  • 4. WHAT IS MOBILE? image: huffingtonpost.com (Alamy)
  • 5. USE
  • 6. 86% of mobile internet users use their device while watching TV. source: pocketyourshop.wordpress.com
  • 7. source: pocketyourshop.wordpress.com 14% 86%
  • 8. By 2014, mobile internet usage will overtake desktop internet usage. source: pocketyourshop.wordpress.com
  • 9. InternetUsers(MM) 0 500 1000 1500 2000 2007 2009 2011 2013 2015E
  • 10. Adults spend more time on mobile media than they do on newspapers and magazines combined.   source: pocketyourshop.wordpress.com
  • 11. what is mobile? What is mobile? image: flickr.com/photos/guidedbycthulhu HOW DO WE USE THE INTERNET?
  • 12. 18% of all web traffic in the U.S. is mobile traffic. That number skyrockets to 24% in Africa, and 30% in Asia. source: pocketyourshop.wordpress.com
  • 13. This is up 192.5%since 2011. source: pocketyourshop.wordpress.com
  • 14. MOBILE ONLY PAGEVIEWS 12.7%3.7% 8.1%1.5% 22.9%4.5% 12.8%2.8%16.6%4.8%5.3%.9% 14.2%2.9% 2010 2013 North America Europe Asia Worldwide South America Africa Oceania
  • 15. 99% of smartphone owners use their mobile browser at least once a day.  source: pocketyourshop.wordpress.com
  • 16. 46% of consumers will NOT return to a mobile site that is not working properly. source: pocketyourshop.wordpress.com
  • 17. 74% of consumers will wait 5 seconds for a web page to load on their mobile device before abandoning the site. source: pocketyourshop.wordpress.com
  • 18. 39% of business do nothing to make their site mobile-ready. source: pocketyourshop.wordpress.com
  • 19. MOBILE ONLY USERS source: mobithinking.com Country % mobile-only Country % mobile-only Egypt 70% Indonesia 44% India 59% Thailand 32% South Africa 57% China 30% Ghana 55% US 25% Kenya 54% UK 22% Nigeria 50% Russia 19
  • 20. SEARCH
  • 21. 95% of mobile users use their devices for local search.  source: pocketyourshop.wordpress.com
  • 22. 52% of all local searches are done from a mobile device. source: pocketyourshop.wordpress.com
  • 23. 3 out of every 5 searches are conducted on a mobile device.  source: pocketyourshop.wordpress.com
  • 24. 9out of every 10 mobile phone searches result in a purchase or visit.  source: pocketyourshop.wordpress.com
  • 25. DO YOU HAVE A WEBSITE? “You need to get your content onto mobile devices. Period.” — Karen McGrane
  • 26. WHO DECIDES WHAT MATTERS? image: flickr.com/photos/d_space
  • 27. MOBILE IS SOCIAL image: flickr.com/photos/strandloper/
  • 28. source: allfacebook.com
  • 29. source: allfacebook.com
  • 30. Users(MM) 0 250 500 750 1000 Q4 12 Q1 13 Q2 13 Q3 13 Q4 13 Mobile Mobile Only FACEBOOK
  • 31. NO MORE BOUNDARIES “If people want to do something on the internet, they will want to do it using their mobile device. Period.” — Karen McGrane
  • 32. WHAT ABOUT CONTEXT? image: flickr.com/photos/kattebelletje/
  • 33. WHAT ABOUT CONTEXT? image: flickr.com/photos/piblet
  • 34. ONE SITE Examples of diffent sites on different platform
  • 35. MANY DEVICES
  • 36. image: flickr.com/photos/cannedtuna THERE IS NO SUCH A THING AS MOBILE IA
  • 37. WHAT IS IA? The structural design of shared information environments. source: en.wikipedia.org/wiki/Information_architecture
  • 38. CROSS-CHANNEL IA BLUEPRINT image: tylertate.com/blog/2012/02/21/cross-channel-ia-blueprint.html
  • 39. image: journalofia.org/volume1/issue1/02-brugnoli/jofia-0101-02-brugnoli.pdf TOUCHPOINTS MATRIX
  • 40. 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
  • 41. DESKTOP
  • 42. TABLET
  • 43. MOBILE
  • 44. MOBILE PATTERNS The organization structure is usually hierarchical, but can have other structures, such as concentric or even chaotic. image: Android Design Patterns STRUCTURE AS DESIGN PATTERNS WAYFINDING
  • 45. MOBILE PATTERNS - HIERARCHY source: uxbooth.com
  • 46. MOBILE PATTERNS - HIERARCHY
  • 47. MOBILE PATTERNS - HUB & SPOKE source: uxbooth.com
  • 48. MOBILE PATTERNS - HUB & SPOKE
  • 49. MOBILE PATTERNS - NESTED DOLL source: uxbooth.com
  • 50. MOBILE PATTERNS - NESTED DOLL
  • 51. MOBILE PATTERNS - TABBED VIEW source: uxbooth.com
  • 52. MOBILE PATTERNS - TABBED VIEW
  • 53. MOBILE PATTERNS - BENTO BOX source: uxbooth.com
  • 54. MOBILE PATTERNS - BENTO BOX
  • 55. MOBILE PATTERNS - FILTERED VIEW source: uxbooth.com
  • 56. MOBILE PATTERNS - FILTERED VIEW Filter Filter
  • 57. image: flickr.com/photos/10ch MANAGING INFORMATION TO CREATE MEANING SENSEMAKING
  • 58. CONTENT = INFORMATION “Typically information foraging must be analysed as decision making under uncertainty” — Peter Pirolli
  • 59. WAYFINDING FOR SENSEMAKING
  • 60. THERE IS NO SUCH A THING AS MOBILE CONTENT STRATEGY image: abookapart.com
  • 61. THE CHALLENGE Adaptive content is more than just “mobile.” It means getting your content into a format so you can share and distribute it to any platform you want. It means you can get your content onto platforms you control—and platforms you don’t. It even means you’ll have a fighting shot at getting your content onto platforms that haven’t been invented yet.
  • 62. ADAPTIVE CONTENT Reusable Strong structure Independent of presentation layer Metadata Content Management System (CMS)
  • 63. ADAPTIVE CONTENT Adaptive content is more than just “mobile.” It means getting your content into a format so you can share and distribute it to any platform you want. It means you can get your content onto platforms you control—and platforms you don’t. It even means you’ll have a fighting shot at getting your content onto platforms that haven’t been invented yet.
  • 64. REUSABLE CONTENT Find examples
  • 65. NEWSLETTER SIGNUP PROGRAM 1 (50 WORDS MAX) PROGRAM 2 (50 WORDS MAX) PROGRAM 2 (50 WORDS MAX) GLOBAL NAVIGATION AND SERVICE LINKS SEARCH LOGO AND SLOGAN MAIN NAVIGATION CAROUSEL PHOTO FEATURED PRODUCT 1 (3 WORDS MAX) FEATURED PRODUCT 2 (3 WORDS MAX) PUB SEARCH SLIDE TITLE (10 WORDS MAX) SLIDE TEASER (50 WORDS MAX) ASK THE EXPERT (100 WORDS MAX) TOPIC CENTER (10 LINKS x 4 WORDS MAX) HEALTH CARE REFORM (100 WORDS MAX) SPOTLIGHT (100 WORDS MAX) PROGRAM 1 (50 WORDS MAX) PROGRAM 2 (50 WORDS MAX) PROGRAM 2 (50 WORDS MAX) NEWS (5 LINKS x 10 WORDS MAX) STRUCTURED CONTENT
  • 66. STRUCTURED CONTENT NEWSLETTER SIGNUP GLOBAL NAVIGATION AND SERVICE LINKS SEARCH CAROUSEL PHOTO FEATURED PRODUCT 1 (3 WORDS MAX) FEATURED PRODUCT 2 (3 WORDS MAX) PUB SEARCH SLIDE TITLE (10 WORDS MAX) SLIDE TEASER (50 WORDS MAX) TOPIC CENTER (10 LINKS x 4 WORDS MAX) NEWS (5 LINKS x 10 WORDS MAX) NAV SEARCH (SITE AND PUBS) SLIDE TEASER SHORT
 (10 WORDS MAX) FEATURED PRODUCT 1 (3 WORDS MAX) TOPIC CENTER (5 LINKS x 4 WORDS MAX) NEWS (5 LINKS x 10 WORDS MAX) CAROUSEL PHOTO THUMB FEATURED PRODUCT 2 (3 WORDS MAX)
  • 67. METADATA image: http://dev.npr.org/#station-finder-api-examples
  • 68. PROGRESSIVE DISCLOSURE
  • 69. THE HOMEPAGE IS DEAD
  • 70. image: martinbelam.com THE BUZZFEED ARTICLE
  • 71. image: martinbelam.com THE NYTIMES REPORT
  • 72. image: martinbelam.com
  • 73. ACTUALLY, NOT YET
  • 74. THE INTERNET IN YOUR POCKET image: techpinions.com
  • 75. THE FUTURE WAS YESTERDAY
  • 76. THE FUTURE IS YESTERDAY image: slashgear.com
  • 77. BTW image: flickr.com/photos/gregoryjordan
  • 78. STEPHEN HAY
  • 79. thank you. Illustration: Dan Willis alberta soranzo | @albertatrebla | wearefriday.com
  • 80. 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 ! Fisher, J., Norris, S., & E. Buie (2012). Sense-making in Cross-channel Design. Journal of Information Architecture. Vol. 4, No. 1-2. journalofia.org/volume4/issue2/02-fisher/