Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

TMA Going Mobile


Published on

A bit of background as to the growth and how we use mobile plus a web developers perspective for going mobile for a non-technical audience. Primarily for an arts/ cultural and ticketing audience.

Published in: Technology
  • Be the first to comment

  • Be the first to like this

TMA Going Mobile

  1. 1. Going mobileCarol Jones/ ChapterBrian Healy/ Tincan
  2. 2. Annual Sales Volume (in millions)In 2012 thenumber ofsmartphones soldwill exceed thenumber of PCssold Estimate
  3. 3. Its not the strongest speciesthat survives, nor the mostintelligent but the ones mostresponsive to change ...
  4. 4. Smartphonedemographicsby age andincome
  5. 5. So what do people do onmobile ...
  6. 6. ...they consume content
  7. 7. They listen to music, use social media AND they shop
  8. 8. 4 out of 5 consumersuse smartphones toshop Fandango sold 68,000 tickets in an hour on the opening day of ‘The Avengers’ on their mobile site and app
  9. 9. So the big question: How can we convert all this mobile usage into tickets sales?
  10. 10. “Your chance of converting all thattraffic into ticket sales without amobile sales tool is very low.” Mashable, Oct 2012
  11. 11. Solutions + Examples: A Web Developers Perspective Mobile web Web app Hybrid app Native appWebsites that are mobile friendly Mobile web as an app - in looks if Combines Native + Web. Native Other end of the spectrum - Typically the same website as nothing else tho this is changing. app provides shell, downloaded via platform specific, downloaded via what you see via your desktop, Accessed via the browser. No app app store, means all device features store (Apple App Store/ Androidit’s responsive and adapts to the store download, tho initial visit (e.g. camera) available. Web Marketplace). A completely users device can take time. delivers ‘live content’ different experience for the user
  12. 12. Richness of Approval Costs Audience Device Access Speed experience Process (Dev + Ongoing) Reach Native High Full Very Fast Mandatory Expensive Low Native speed as Medium Hybrid Medium Full Low overhead Moderdate necessaryWeb App Medium Partial Fast None Moderate Medium Mobile Low Low Fast None Best High Web
  13. 13. Which solution? Strategic questions Solutions Questions ... •Business needs/ user goals •Native app •Your audience •Hybrid app •Your content •Web app •Experience you want to •Mobile web deliver
  14. 14. Strategic questions Which solution? Questions ... Solutions •Business needs/ user goals •Native app •Your audience •Your content •Hybrid app •Experience you want to •Web app deliver •Mobile web
  15. 15. 5%
  16. 16. Process • Extend reach: Increase mobile audience Identify: Business goals • Maintain efficiencies: Same site/ content/ db • Users: 20-35 yrs; high rates mobile usage Understand: Users, offering • No obvious reason why audience not using the site on mobile Get buy in • New management: Keen to do MORE • User data, stats analysis, content audit, workshops, games and mobile exercises, produced Analyse + Workshop it prototypes Build it • 4 week developmentLaunch, measure, test, refine • Went live Dec 2011, refined and further improved over 2-3 weeks
  17. 17. Set Resizing <meta name="viewport" content="width=device-width; initial- scale=1.0; maximum- Sell scale=1.0;"> Sell (Tickets, (Tickets, Events, Events, Products) App/Home Icon Products) <link rel="apple-touch-icon" href="icons/regular_icon.png"/> <link rel="apple-touch-icon" sizes="114x114" href="icons/ retina_icon.png"/> Improving Improving Events Events UX UX (Developing (Developing Separate Mobile Site/Web App (for all) ++Engaging) (for all) Engaging) Javascript Launch if((navigator.userAgent.match(/i Phone/i)) || (navigator.userAgent.match(/iPod /i))) { Analysis Communica Communica if te te (document.cookie.indexOf("iphone (Brand _redirect=false") == -1) (Brand window.location = " Values) Values)"; } PHP if(strstr($_SERVER[HTTP_USER_AG ENT],iPhone) || Development strstr($_SERVER [HTTP_USER_AGENT],iPod)) { header(Location: ); exit(); } Remove Safari Address/Status Bars (top/bottom) <meta name="apple-mobile-web- app-capable" content="yes" /> PrototypesWorkshops Wireframes
  18. 18.
  19. 19. Desktop Tablet Smartphone•Four column layout •Four column layout, automatically adapts to two column •Single column layout layout for portrait•Full content experience •Assets dynamically •Assets dynamically resized (e.g. images, calendar) resized (e.g. nav) •Some content types replaced (e.g. footer) •More content types removed (e.g. calendar, image carousel)
  20. 20. Results•Mobile rate increased by 250% in 3 months•Dwell time, number of pages visited and returningvisitors, all increased (and faster than the non-mobilefigures)•Mobile bounce rate reduced by 5% (vs no change forthe non-mobile figures)•We know there’s more to do ...
  21. 21. Results•Mobile rate increased by 400% in 12 months•Dwell time, number of pages visited and returningvisitors, all increased (and faster than the non-mobilefigures)•Mobile bounce rate reduced by 10% more thandesktop (50% vs 40%)•There’s always more to do ...
  22. 22. Other business tools ... i.e. your ticketing system Open and Supported API Adaptive versioning (e.g. dynamic resizing of images) HTML5 (No Flash -e.g. SYOS)
  23. 23. “Will I have to redo our website?” Honestly?
  24. 24. Chapter and what we’re up to
  25. 25. QR Codes
  26. 26. Chapter App
  27. 27. Chapter App
  28. 28. Chapter App
  29. 29. Chapter App
  30. 30. Chapter App
  31. 31. Has a high retention rateWhatever mobile tool you usehas to provideinformation/booking ... fasterand easierReminders, social media sharing,push notifications
  32. 32. And what we’re up to next ... week
  33. 33. And what we’re up to next ... week
  34. 34. ResourcesTest your site: some nice examples of sites using media queries: reading that will help make friends withyour web developer/ web agency: