Your SlideShare is downloading. ×
0
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Mobile Strategy 2013
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Mobile Strategy 2013

494

Published on

Lindsay Herbert's presentation on Mobile Strategy at the Digital Marketing Show 2013

Lindsay Herbert's presentation on Mobile Strategy at the Digital Marketing Show 2013

Published in: Technology, Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
494
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
22
Comments
0
Likes
1
Embeds 0
No embeds

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
  • Mobile OS by region statsProfile your audience – look at key parameters, for example operating systemsConsider global regions differently (iOSin Australia compared with Asia)
  • What’s changed… chat through the key events in the past yearPick a trend … Siri & free messaging 9challenge to BBerry
  • Google Glass. Seems daft now but…
  • Diagram: Mary Meeker at the Wall Street Journal D11 Conference May 29 2013The uptake of tablets has been rocket like surpassing desktop and notebook PC’s less than 3 years after they were first introducedPredicted sales of tablets will surge from 72.7 million in 2011 to 383.3 million in 2017
  • Average person looks at their phone 150 times a day most of these are very brief interactionsDesign needs to accommodate for these very brief interactions
  • People interact with touch-based user interfaces with their fingers. So user interface controls have to be big enough to capture fingertip actions without frustrating users with erroneous actions and tiny targets. Apple - 44pxWindows – 9mmNokia – between 7 and 8mmThe average finger pad is 10-14mm with the fingertip being 8-10mmWhat does this mean? Don’t make tiny links and tiny spaces…
  • Use existing visual shortcuts for essential operations. These are already emerging as standards so don’t reinvent the wheel.Hamburger icon = menuCircular arrow = refreshMagnifying glass = searchCog = settingsThumb = like
  • Screen design needs to take into consideration the device it will inhabit.These diagrams illustrate the average user reachThings that you don’t want a user to hit by mistake need to sit up in the orange areaWith the longest reach area running top to bottom we can expect most scrolling will occur in these areas (and therefore the thumb will hover there)
  • Screen design needs to take into consideration the device it will inhabit.These diagrams illustrate the average user reachThings that you don’t want a user to hit by mistake need to sit up in the orange areaWith the longest reach area running top to bottom we can expect most scrolling will occur in these areas (and therefore the thumb will hover there)
  • Mobile browser basedStandard mobiWeb app mobiUsually have their own IACost effectiveLightweightWide reach
  • Mobile browser basedStandard mobiWeb app mobiUsually have their own IACost effectiveLightweightWide reach
  • Mobile browser basedStandard mobiWeb app mobiUsually have their own IACost effectiveLightweightWide reach
  • One website, that flows across multiple devicesBrowser basedSame content delivered to all usersMonashTacticalDigital business transformation
  • One website, that flows across multiple devicesBrowser basedSame content delivered to all usersMonashTacticalDigital business transformation
  • One website, that flows across multiple devicesBrowser basedSame content delivered to all usersMonashTacticalDigital business transformation
  • My issue with responsive design is when it becomes lowest common denominator design, 'working' on all screens but not excelling on any. – Roan Lavery (Free Agent)
  • One website, that flows across multiple devicesBrowser basedSame content delivered to all users
  • One website, that flows across multiple devicesBrowser basedSame content delivered to all users
  • One website, that flows across multiple devicesBrowser basedSame content delivered to all users
  • Examples of some framework providers
  • Mobile browser basedStandard mobiWeb app mobi
  • Mobile browser basedStandard mobiWeb app mobi
  • Mobile browser basedStandard mobiWeb app mobi
  • Use on the go
  • Use on the go
  • Device features. Although web apps can take advantage of some features, native apps (and the native components of the hybrid apps) have access to the full paraphernalia of device-specific features, including GPS, camera, gestures, and notifications.Offline functioning. A native app is best if your app must work when there is no connectivity. In-browser caching is available in HTML5, but it’s still more limited than what you can get when you go native.Discoverability. Web apps win the prize on discoverability. Content is a lot more discoverable on the web than in an app: When people have a question or an information need, they go to a search engine, type in their query, and choose a page from the search results. They do not go to the app store, search for an app, download it, and then try to find their answer within the app. Although there are app aficionados who may fish for apps in app stores, most users don’t like installing and maintaining apps (and also wasting space on their device), and will install an app only if they expect to use it often.Speed. Native apps win the speed competition. In 2012 Mark Zuckerberg declared that Facebook’s biggest mistake had been betting on the mobile web and not going native. Up to that point, the Facebook app had been a hybrid app with an HTML core; in 2012 it was replaced with a truly native app.Installation. Installing a native or hybrid app is a hassle for users: They need to be really motivated to justify the effort. “Installing” a web app involves creating a bookmark on the home screen; this process, while arguably simpler than downloading a new app from an app store, is less familiar to users, as people don’t use bookmarks that much on mobile.Maintenance. Maintaining a native app can be complicated not only for users, but also for developers (especially if they have to deal with multiple versions of the same information on different platforms): Changes have to be packaged in a new version and placed in the app store. On the other hand, maintaining a web app or a hybrid app is as simple as maintaining a web page, and it can be done as often or as frequently as needed.Platform independence. While different browsers may support different versions of HTML5, if platform independence is important, you definitely have a better chance of achieving it with web apps and hybrid apps than with native apps. As discussed before, at least parts of the code can be reused when creating hybrid or web apps.Content restrictions, approval process, and fees. Dealing with a third party that imposes rules on your content and design can be taxing both in terms of time and money. Native and hybrid apps must pass approval processes and content restrictions imposed by app stores, whereas the web is free for all. Not surprisingly, the first web apps came from publications such as Playboy, who wanted to escape Apple’s prudish content censure. And buying a subscription within an iOS app means that 30% of that subscription cost goes to Apple, a big dent in the publishers’ budget.Development cost. It’s arguably cheaper to develop hybrid and web apps, as these require skills that build up on previous experience with the web. NN/g clients often find that going fully native is a lot more expensive, as it requires more specialized talent. But, on the other hand, HTML5 is fairly new, and good knowledge of it, as well as a good understanding of developing for the mobile web and hybrid apps are also fairly advanced skills.User Interface. Last but not least, if one of your priorities is providing a user experience that is consistent with the operating system and with the majority of the other apps available on that platform, then native apps are the way to go. That doesn’t mean that you cannot provide a good user experience with a web app or a hybrid app–it just means that the graphics and the visuals will not be exactly the same as those with which users may be already accustomed.
  • There are two approachesEither is fine
  • 2. Is probably the most comfortable fit given you already have Corporate website; Microsite ; Campaign site is fine
  • TescoBank UI flow
  • Digital bloat
  • Digital bloatAvoid digital bloat by monitoring the effectiveness of your channels and adjust your resourcing accordingly
  • Chinese taxi appsSay your current location and where you are going and a voice message is sent to all nearby available taxisView the taxi's location in realtime and then push to talk directly to the driver to co-ordinate pickup
  • BlipparJawbonePebbleSmart TVVuzixPingit from BarclaysbankSquare (Credit card reader)
  • ORGANISATIONS MUST SEEK OUT TECHNOLOGIES THAT PROVIDE A SINGLE CUSTOMER VIEW, AN INTEGRATED EXPERIENCE AND BUSINESS INTELLIGENCE
  • ORGANISATIONS MUST SEEK OUT TECHNOLOGIES THAT PROVIDE A SINGLE CUSTOMER VIEW, AN INTEGRATED EXPERIENCE AND BUSINESS INTELLIGENCE
  • Transcript

    1. Putting Mobile First November 27, 2013 Lindsay Herbert Head of Digital @precedent#@lindzeiy
    2. @precedent#@lindzeiy
    3. @precedent#@lindzeiy
    4. EDINBURGH PERTH LONDON MELBOURNE CARDIFF HONG KONG @precedent#@lindzeiy
    5. 135 experts Strategy & research Branding & communications User-centred design Development & hosting Digital marketing @precedent#@lindzeiy
    6. 24 Years Experience Quality Stability Loyalty Results @precedent#@lindzeiy
    7. Who we work with @precedent#@lindzeiy
    8. @precedent#@lindzeiy
    9. Mobile whitepaper series 1. Optimising Mobile 2. Targeting Mobile @precedent#@lindzeiy 3.
    10. Putting Mobile First 1. A Changing World 2. What Are My Options? 3. Design Considerations 4. Choosing the Optimum Approach 5. Making It Happen 6. Considering The Future @precedent#@lindzeiy
    11. A Changing World – What do your customers use? Windows Blackberry Android iOS Smart TV @precedent#@lindzeiy
    12. A Changing World – Mobile operating system by region June 2012 to May 2013 Australia Asia iOS Europe Android SymbianOS Other Source: Stat Counter – Global Stat Counter - http://gs.statcounter.com/ @precedent#@lindzeiy
    13. A Changing World – Constantly evolving landscape @precedent#@lindzeiy
    14. A Changing World – Google I/O @precedent @lindzeiy
    15. A Changing World – Tablets @precedent#@lindzeiy
    16. A Changing World – The surge towards tablets Global Units Shipped (MMs) Global PC (Desktop / Notebook) and Tablet Shipments by Quarter (Q1: 1995 - Q1: 2013) Source: Katy Huberty, Ehud Gelblum, Morgan Stanley Research. Gartner. Data as of 4/13. @precedent#@lindzeiy Note: Notebook PCs include Net books
    17. A Changing World – Affordable tablets @precedent#@lindzeiy
    18. Putting Mobile First 1. A Changing World 2. What Are My Options? 3. Design Considerations 4. Choosing the Optimum Approach 5. Making It Happen 6. Considering The Future @precedent#@lindzeiy
    19. What Are My Options? Take the time to understand your user’s behaviour and context. @precedent#@lindzeiy
    20. @precedent#@lindzeiy
    21. What Are My Options? Remember a Mobile User… 1. Typically has short bursts of activity 2. Can be time poor or network restricted 3. Is usually goal driven 4. Loves using her phone - joy of use, personal item 5. Tells others of a good experience 6. Needs a simple uncomplicated experience @precedent#@lindzeiy
    22. What Are My Options? Take the opportunity to innovate in design and function. @precedent#@lindzeiy
    23. What Are My Options? Don’t just follow the web @precedent#@lindzeiy
    24. What Are My Options? 4(ish) choices Mobi Responsive Feeds Apps Native @precedent#@lindzeiy Hybrid
    25. What Are My Options? – Roll It: App or Web? @precedent#@lindzeiy
    26. Putting Mobile First 1. A Changing World 2. What Are My Options? 3. Design Considerations 4. Choosing the Optimum Approach 5. Making It Happen 6. Considering The Future @precedent#@lindzeiy
    27. Design Considerations ‘ Effective mobile designs not only account for these one thumb/one eyeball experiences but aim to optimize for them as well. ’ Luke Wroblewski – Mobile First @precedent#@lindzeiy
    28. Design Considerations – Hit Areas @precedent @lindzeiy
    29. Design Considerations – Hit Areas User interface control sizes: Apple = 44px Windows = 9mm Nokia = between 7 and 8mm The average finger pad is 10-14mm with the fingertip being 8-10mm @precedent @lindzeiy
    30. Design Considerations – Common Language Use existing visual shortcuts for essential operations: Hamburger icon = menu Circular arrow = refresh Magnifying glass = search Cog = settings Thumb = like @precedent#@lindzeiy
    31. Design Considerations - Reach Hard Easy Average Left hand @precedent#@lindzeiy Hard Easy Average Right hand
    32. Design Considerations - Reach Hard: Things you don’t want to hit by mistake Hard Easy Hard Easy Easy: Things that require the most scrolling Average: Where the thumb naturally hovers Average Left hand @precedent#@lindzeiy Average Right hand
    33. Putting Mobile First 1. A Changing World 2. What Are My Options? 3. Design Considerations 4. Choosing the Optimum Approach 5. Making It Happen 6. Considering The Future @precedent#@lindzeiy
    34. Choosing the Optimum Approach - mobi @precedent#@lindzeiy
    35. Choosing the Optimum Approach - mobi What it’s good for: – Providing focus and clear structure – Deploying without impact on main website – Delivering quickly – Wide reach working via browser – Can be designed to respond to screen size or orientation @precedent#@lindzeiy
    36. Choosing the Optimum Approach - mobi Drawbacks: – Can’t access device functions (e.g. internal storage) – Offline functions limited to HTML5 caching – User interface needs to be more simplistic – Slower than a native or hybrid app @precedent#@lindzeiy
    37. Choosing the Optimum Approach - Responsive @precedent#@lindzeiy
    38. Choosing the Optimum Approach - Responsive What it’s good for: – You only have to write the content once – Easy updates and maintenance – Experience stays consistent for users across all devices and platforms @precedent#@lindzeiy
    39. Choosing the Optimum Approach - Responsive Drawbacks: – One-size fits all means you can’t cater as well for different user behaviours and contexts – The same drawbacks for mobi also apply here @precedent#@lindzeiy
    40. Choosing the Optimum Approach - Responsive ‘ It's cheap but degrading to reuse content and design across diverging media forms like print vs. online or desktop vs. mobile. Superior UX requires tight platform integration. ’ Jakob Neilsen – 21st May 2012 @precedent#@lindzeiy
    41. Choosing the Optimum Approach - Responsive @precedent#@lindzeiy
    42. Choosing the Optimum Approach – Hybrid Apps @precedent#@lindzeiy
    43. Choosing the Optimum Approach – Hybrid Apps What it’s good for: – Lets you develop once to many devices – Can access some device features like internal storage – Better offline use (thanks to internal storage access) @precedent#@lindzeiy
    44. Choosing the Optimum Approach – Hybrid Apps Drawbacks: – Not as a fast as a native app – Can’t access all device functions – Has to be downloaded from app stores – Will not be a rich interface @precedent#@lindzeiy
    45. Choosing the Optimum Approach – Hybrid Apps @precedent#@lindzeiy
    46. Choosing the Optimum Approach – Native Apps @precedent#@lindzeiy
    47. Choosing the Optimum Approach – Native Apps What it’s good for: – Fastest speeds – Richest possible user interface – Can access every feature of the device – Best offline usage @precedent#@lindzeiy
    48. Choosing the Optimum Approach – Native Apps Drawbacks: – Needs to be developed for each device type – Data is a key consideration for unconnected use – Updates need to be rolled out for each type – Developing for each device type quickly adds to costs @precedent#@lindzeiy
    49. Choosing the Optimum Approach – Feeds @precedent#@lindzeiy
    50. Choosing the Optimum Approach – Feeds @precedent#@lindzeiy
    51. Choosing the Optimum Approach – Your priorities? Device features Native first, then Hybrid Offline functioning Native first, then Hybrid Speed Native (learn from Facebook) User interface Native Maintenance Web or Hybrid Platform independence Web or Hybrid Development cost Web or Hybrid Discoverability Web Installation Web Content restrictions, approval process and fees Web (learn from Playboy) @precedent#@lindzeiy
    52. Putting Mobile First 1. A Changing World 2. What Are My Options? 3. Design Considerations 4. Choosing the Optimum Approach 5. Making It Happen 6. Considering The Future @precedent#@lindzeiy
    53. Making It Happen – Mobile First approach @precedent#@lindzeiy
    54. Making It Happen – Adapting content @precedent#@lindzeiy
    55. Making It Happen – Adapting content Don’t just follow the web @precedent#@lindzeiy
    56. Making It Happen – UI Flow @precedent#@lindzeiy
    57. @precedent#@lindzeiy
    58. Making It Happen – Resource and Process ‘ The more channels I run, the more resource I’ll need, right? ’ @precedent#@lindzeiy
    59. Making It Happen – Resource and Process @precedent @lindzeiy
    60. Putting Mobile First 1. A Changing World 2. What Are My Options? 3. Design Considerations 4. Choosing the Optimum Approach 5. Making It Happen 6. Considering The Future @precedent#@lindzeiy
    61. Considering The Future – Remember it’s a Phone! @precedent#@lindzeiy
    62. @precedent#@lindzeiy
    63. Considering The Future – PrecEvents Out of the Box! @precedent#@lindzeiy
    64. Considering The Future – PrecEvents Out of the Box! @precedent#@lindzeiy
    65. Considering The Future – Customer journeys with Sitecore www.sitecore.net
    66. Considering The Future – Sitecore engagement platform www.sitecore.net
    67. Considering The Future – Trends for 2014 – Connected devices – Mobile payments and e-wallet – Mobile advancement - wearable devices (NFC) – Lounge computing - socially integrated TV – Move towards social business – Smart content with personalisation & aggregation – Self service applications @precedent#@lindzeiy
    68. Considering The Future – Finally… Don’t disappoint Don’t be afraid to innovate Don’t delay in providing a solution (think-apply-review-refine) @precedent#@lindzeiy
    69. Considering The Future – Finally… Think big. Start small. Act Quickly. Smart thinking wins… @precedent#@lindzeiy
    70. @precedent#@lindzeiy
    71. Follow Precedent on LinkedIn to find out more about our seminars and ideas, and add me to keep in touch. Follow @Precedentcomms on Twitter to see what we think is interesting in digital, and follow me for updates from my blog. @lindzeiy on Twitter

    ×