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

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • camera/ images/ video, accelerometer, geolocation,
  • ICA had a 5% mobile rate plus a mobile bounce rate 33% higher than the non-mobile rate and extremely low page view and dwell times for mobile
  • We applied the same good thinking and web governance to it
  • What were the results ... remember measurable business goals!
  • What were the results ... remember measurable business goals!
  • Mobile web isn’t a bolt-on to your existing site and it can’t be added to it as such. At some level it requires a fundamental re-evaluation of your site (goals, audience insight, content review and overall strategy) So whilst you don’t HAVE to revamp your entire site, you and your web developer will be putting in a substantial amount of effort anyway and the closer to a revamp of your site you move, the more it will really help be a better solution AND deliver better results
  • 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: