Goin’ Mobile:What PR pros need to know     MPRC Webinar Series       www.meprcouncil.org                             plein...
pleinairinteractive.com
welcome...To participate:hello@pleinairinteractive.com                                pleinairinteractive.com
plein air interactiveAn interactive agency for museums...  Online communications strategy  Bulletproof design/branding  Ea...
Questions... How many of you have a computer? Smartphone? Tablet?                           pleinairinteractive.com
Questions... Do you already offer an optimized mobile experience? Are you planning on doing so in the next 6 months?      ...
Today’s Agenda Mobile User Experience (what’s different?) Keys to a successful mobile user experience Designing for the mo...
Why care about mobile?Professional communicators need to know howpeople use mobile devices so that they areprepared to eff...
Why care about mobile?                     pleinairinteractive.com
Why care about mobile? 25B downloads from Apple Store; 1B/month Tablet ownership: 10% > 20%... 20% > 29% (Pew) More mobile...
Why care about mobile?  12.6 Million iPhone users visit Google Maps  every day (7.6 Million Android users)  60% of of smar...
Mobile Devices  Smart phone                 pleinairinteractive.com
Mobile Devices  Tablets                 pleinairinteractive.com
Mobile Devices  Laptops (yes, laptops)                           pleinairinteractive.com
What analog device did they replace?  Computer  Tablet  Smartphone                              pleinairinteractive.com
What analog device did they replace?  Computer = typewriter  Tablet = book  Smartphone = “dumb” phone                     ...
When do we use them? (context)  Computer  Tablet  Smartphone                             pleinairinteractive.com
Device Context  Computer = work  Tablet = reading, casual  Smartphone = immediate, location sensing                       ...
Computer - Tasks  Build a website  Write a book  BUY  CREATE                    pleinairinteractive.com
Tablet - Tasks  View a website  Read a book  BUY  CONSUME information                        pleinairinteractive.com
Smartphone - Tasks  Its “killer app”: killing time  Check in: foursquare, email, call, Facebook, Twitter  Communicate imme...
GamesWeatherSocial networkingMaps, navigation, searchMusicNewsEntertainment                           Most frequentVideo, ...
NewsWeatherEmailSocial mediaPersonal Interest                    Top 5 mobile                    app categories           ...
Computer      - Luke Wrobleski, http://www.lukew.com/ff/entry.asp?1451 - 11/22/11                                         ...
Smartphone       - Luke Wrobleski, http://www.lukew.com/ff/entry.asp?1451 - 11/22/11                                      ...
Tablet         - Luke Wrobleski, http://www.lukew.com/ff/entry.asp?1451 - 11/22/11                                        ...
What do we use to buy?  83% - computer owners  63% - tablet owners  31% - smartphone (impulse buys)                       ...
What do people buy?  Event tickets - 38%  Daily deals - 38%  Apparel - 36%  Travel/books/games/movies - 33%  Consumer elec...
Who buys? Tablets:     67% of men     39% of women Smartphones:     39% of men     23% of women                    - JumpT...
Who buys? iPhones + iPads = 92% of all mobile purchases during the 2011 Holidays Average purchase is higher with iOS devic...
Native or Web?  Only 4% of consumers said they prefer to use  a company’s (native) app - Zmags survey  25% of all native a...
(not) Going Native  Expense will increase (more devices to test)  HTML5 will improve capabilities  Better integration with...
6 keys to a successfulmobile user experience   Do a mobile task analysis   Define your strategy for mobile UX   Adopt mobil...
Mobile Task Analysis   What do you want people to do?   Where will they be when they are doing it?   (what’s the context) ...
Define  Describe your target audience’s needs,  context - understand them  Outline their tasks - and how you’re app helps  ...
Typical Mobile Tasks   Managing Deadlines   Rapid Change   Business Information (reference)   Directions (location)   Publ...
Typical eReader Tasks   Organize   Share   READ!                        pleinairinteractive.com
TouchPressTapDragFlick                Touch TermsSlideSwipePinchRotateZoom         - Luke Wrobleski, http://www.lukew.com/...
Mobile Messages - signals   Getting started   Tour   Progress   Demo (examples)   Friendly error messages   Confirmation me...
Mobile design techniques   “Detect and direct”   Responsive Web Design                           pleinairinteractive.com
pleinairinteractive.com
Detect and DirectDetect the device and show custom mobile site:    Feed a different set of templates/HTML (at    same URL)...
Examples - detect and direct   www.pleinairinteractive.com   www.walkerart.org   mobile.boston.com   www.imamuseum.org/mob...
Responsive Web DesignUse a single codebase to render a site:    Media queries    Fluid grids    Flexible images and media,...
Responsive Web Design  <link rel="stylesheet" type="text/css"    media="screen and (max-device-width: 480px) and  (resolut...
Examples - Responsive Web Design   www.happycog.com   www.crushlovely.com   curator.pleinairinteractive.com               ...
Mobile Usability  “Design for mobile first.” - Luke Wrobleski  “If in doubt, leave it out.” - Jakob Nielsen  “Make it tapwo...
Best Practices for Mobile                        pleinairinteractive.com
Make the most of small screens   Make tasks obvious   Reduce words - be a ruthless editor   Plan for partial attention   D...
Provide what they needwhen they need it   “Progressive Disclosure”   Quick access to easy/common tasks                    ...
Minimize typing  Include defaults  Compute field values  Drop-downs, not text boxes  Auto-complete  Allow for typoes  Make ...
Consider ergonomics  Phones are used with one hand, standing up  Tablets are used with two hands, sitting down            ...
Consider context  Who will be using this app?  What will they be doing?  Where will they be?  When will they be doing it? ...
Design the tappable area  Space between touchpoints  Size of touchpoint:    Apple: 44x44 pixels (“fingertip size”)    Micro...
Trends to watch  Augmented reality  Artificial intelligence  Image recognition  Biometrics  Transactions  HTML5  Native >> ...
Strategy   Create: Digital Engagement                           pleinairinteractive.com
Strategy  Know your audience  Analyze your audience  You need a mobile-friendly website  Editorial response plan for socia...
Get them to your site                        pleinairinteractive.com
Don’t.....             pleinairinteractive.com
Don’t.....             wtfqrcodes.com                              pleinairinteractive.com
Don’t say....           Click here!                         pleinairinteractive.com
Tools/Apps  Buffer - bufferapp.com - scheduled posting  to Twitter, FB, LinkedIn and analytics  Twylah - twylah.com - incr...
Must-read books  Mobile First - Luke Wrobleski  Alertbox - Jakob Nielsen (mobile usability)  UIE.com - Jared Sprool (mobil...
Resources  Luke Wrobleski - ideation and design: http://www.lukew.com/ff/  Mobile first: http://www.abookapart.com/products...
Q&Ahello@pleinairinteractive.com                                pleinairinteractive.com
Thank you  Rob Landry  rob@pleinairinteractive.com  www.pleinairinteractive.com  @portlandhead, @gopleinair  facebook.com/...
Upcoming SlideShare
Loading in...5
×

Goin' Mobile - Maine PR Council Webinar

897

Published on

Webinar to the Maine Public Relations Council on how to understand mobile devices and how people use them to effectively incorporate mobile communications into an overall strategy.

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

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

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Goin' Mobile - Maine PR Council Webinar

    1. 1. Goin’ Mobile:What PR pros need to know MPRC Webinar Series www.meprcouncil.org pleinairinteractive.com
    2. 2. pleinairinteractive.com
    3. 3. welcome...To participate:hello@pleinairinteractive.com pleinairinteractive.com
    4. 4. plein air interactiveAn interactive agency for museums... Online communications strategy Bulletproof design/branding Easy content management Mobile tours/apps/sites e-commerce pleinairinteractive.com
    5. 5. Questions... How many of you have a computer? Smartphone? Tablet? pleinairinteractive.com
    6. 6. Questions... Do you already offer an optimized mobile experience? Are you planning on doing so in the next 6 months? pleinairinteractive.com
    7. 7. Today’s Agenda Mobile User Experience (what’s different?) Keys to a successful mobile user experience Designing for the mobile user experience Mobile Strategy Tips Resources Q&A pleinairinteractive.com
    8. 8. Why care about mobile?Professional communicators need to know howpeople use mobile devices so that they areprepared to effectively present their messagesand create understanding. pleinairinteractive.com
    9. 9. Why care about mobile? pleinairinteractive.com
    10. 10. Why care about mobile? 25B downloads from Apple Store; 1B/month Tablet ownership: 10% > 20%... 20% > 29% (Pew) More mobile users than PC users by 2015 More m-commerce than e-commerce by 2015 (Gartner) 15M iPads, 4M Kindle Fire’s sold during Holiday period pleinairinteractive.com
    11. 11. Why care about mobile? 12.6 Million iPhone users visit Google Maps every day (7.6 Million Android users) 60% of of smartphones run Android, 34% run iOS (source: Canalys) -- but iPhones account for half the traffic 40% of mobile searches are for local places or things pleinairinteractive.com
    12. 12. Mobile Devices Smart phone pleinairinteractive.com
    13. 13. Mobile Devices Tablets pleinairinteractive.com
    14. 14. Mobile Devices Laptops (yes, laptops) pleinairinteractive.com
    15. 15. What analog device did they replace? Computer Tablet Smartphone pleinairinteractive.com
    16. 16. What analog device did they replace? Computer = typewriter Tablet = book Smartphone = “dumb” phone pleinairinteractive.com
    17. 17. When do we use them? (context) Computer Tablet Smartphone pleinairinteractive.com
    18. 18. Device Context Computer = work Tablet = reading, casual Smartphone = immediate, location sensing pleinairinteractive.com
    19. 19. Computer - Tasks Build a website Write a book BUY CREATE pleinairinteractive.com
    20. 20. Tablet - Tasks View a website Read a book BUY CONSUME information pleinairinteractive.com
    21. 21. Smartphone - Tasks Its “killer app”: killing time Check in: foursquare, email, call, Facebook, Twitter Communicate immediately: Facebook, Twitter, Instagram, Pinterest Gather data about a location BUY? CONSUME + CONNECT pleinairinteractive.com
    22. 22. GamesWeatherSocial networkingMaps, navigation, searchMusicNewsEntertainment Most frequentVideo, moviesShopping/retail mobile tasksDining/restaurantSportsProductivityCommunicationTravel pleinairinteractive.com
    23. 23. NewsWeatherEmailSocial mediaPersonal Interest Top 5 mobile app categories pleinairinteractive.com
    24. 24. Computer - Luke Wrobleski, http://www.lukew.com/ff/entry.asp?1451 - 11/22/11 pleinairinteractive.com
    25. 25. Smartphone - Luke Wrobleski, http://www.lukew.com/ff/entry.asp?1451 - 11/22/11 pleinairinteractive.com
    26. 26. Tablet - Luke Wrobleski, http://www.lukew.com/ff/entry.asp?1451 - 11/22/11 pleinairinteractive.com
    27. 27. What do we use to buy? 83% - computer owners 63% - tablet owners 31% - smartphone (impulse buys) - JumpTap/comScore pleinairinteractive.com
    28. 28. What do people buy? Event tickets - 38% Daily deals - 38% Apparel - 36% Travel/books/games/movies - 33% Consumer electronics - 32% Flowers + gifts -30% Toys - 30% General services (photo printing, shipping, etc.) - 26% Consumer packaged goods - 25% - JumpTap/comScore pleinairinteractive.com
    29. 29. Who buys? Tablets: 67% of men 39% of women Smartphones: 39% of men 23% of women - JumpTap/comScore pleinairinteractive.com
    30. 30. Who buys? iPhones + iPads = 92% of all mobile purchases during the 2011 Holidays Average purchase is higher with iOS devices: $123 vs. $101 for Android devices - RichRelevance pleinairinteractive.com
    31. 31. Native or Web? Only 4% of consumers said they prefer to use a company’s (native) app - Zmags survey 25% of all native apps are used just once (Localytics) People prefer b/c they can more easily comparison shop pleinairinteractive.com
    32. 32. (not) Going Native Expense will increase (more devices to test) HTML5 will improve capabilities Better integration with the full web For now, build native apps. Eventually, though, apps will move from “the store” to the Web - Jakob Nielsen, http://www.useit.com/alertbox/mobile-sites-apps.html - 2/13/12 pleinairinteractive.com
    33. 33. 6 keys to a successfulmobile user experience Do a mobile task analysis Define your strategy for mobile UX Adopt mobile style guidelines Use prototypes to validate mobile UX Build in mobile accessibility Test on target devices pleinairinteractive.com
    34. 34. Mobile Task Analysis What do you want people to do? Where will they be when they are doing it? (what’s the context) When will they be doing it? Create personas and write up use cases pleinairinteractive.com
    35. 35. Define Describe your target audience’s needs, context - understand them Outline their tasks - and how you’re app helps them accomplish them Define the architecture (getting started...messages...context- sensitivity...accessibility) List target mobile devices pleinairinteractive.com
    36. 36. Typical Mobile Tasks Managing Deadlines Rapid Change Business Information (reference) Directions (location) Public transportation Emergencies Communication (checking in) pleinairinteractive.com
    37. 37. Typical eReader Tasks Organize Share READ! pleinairinteractive.com
    38. 38. TouchPressTapDragFlick Touch TermsSlideSwipePinchRotateZoom - Luke Wrobleski, http://www.lukew.com/ff/entry.asp?1071 pleinairinteractive.com
    39. 39. Mobile Messages - signals Getting started Tour Progress Demo (examples) Friendly error messages Confirmation messages (but not too many) pleinairinteractive.com
    40. 40. Mobile design techniques “Detect and direct” Responsive Web Design pleinairinteractive.com
    41. 41. pleinairinteractive.com
    42. 42. Detect and DirectDetect the device and show custom mobile site: Feed a different set of templates/HTML (at same URL) Feed a different style sheet (but use same markup) at same URL Redirect to a mobile site “m.mysite.com” pleinairinteractive.com
    43. 43. Examples - detect and direct www.pleinairinteractive.com www.walkerart.org mobile.boston.com www.imamuseum.org/mobile pleinairinteractive.com
    44. 44. Responsive Web DesignUse a single codebase to render a site: Media queries Fluid grids Flexible images and media, through dynamic resizing or CSS pleinairinteractive.com
    45. 45. Responsive Web Design <link rel="stylesheet" type="text/css" media="screen and (max-device-width: 480px) and (resolution: 163dpi)" href="shetland.css" /> pleinairinteractive.com
    46. 46. Examples - Responsive Web Design www.happycog.com www.crushlovely.com curator.pleinairinteractive.com pleinairinteractive.com
    47. 47. Mobile Usability “Design for mobile first.” - Luke Wrobleski “If in doubt, leave it out.” - Jakob Nielsen “Make it tapworthy.” - Josh Clark pleinairinteractive.com
    48. 48. Best Practices for Mobile pleinairinteractive.com
    49. 49. Make the most of small screens Make tasks obvious Reduce words - be a ruthless editor Plan for partial attention Design to focus on critical content pleinairinteractive.com
    50. 50. Provide what they needwhen they need it “Progressive Disclosure” Quick access to easy/common tasks pleinairinteractive.com
    51. 51. Minimize typing Include defaults Compute field values Drop-downs, not text boxes Auto-complete Allow for typoes Make text boxes big enough Provide error recovery and confirmation (“undo”, “are you sure?”) pleinairinteractive.com
    52. 52. Consider ergonomics Phones are used with one hand, standing up Tablets are used with two hands, sitting down pleinairinteractive.com
    53. 53. Consider context Who will be using this app? What will they be doing? Where will they be? When will they be doing it? Why will they be doing it? pleinairinteractive.com
    54. 54. Design the tappable area Space between touchpoints Size of touchpoint: Apple: 44x44 pixels (“fingertip size”) Microsoft: 38x38 Google/Android: density-dependent, enables scaling pleinairinteractive.com
    55. 55. Trends to watch Augmented reality Artificial intelligence Image recognition Biometrics Transactions HTML5 Native >> Web pleinairinteractive.com
    56. 56. Strategy Create: Digital Engagement pleinairinteractive.com
    57. 57. Strategy Know your audience Analyze your audience You need a mobile-friendly website Editorial response plan for social media Have a dashboard to improve awareness + response time Use a smartphone (iPhone) like a boss pleinairinteractive.com
    58. 58. Get them to your site pleinairinteractive.com
    59. 59. Don’t..... pleinairinteractive.com
    60. 60. Don’t..... wtfqrcodes.com pleinairinteractive.com
    61. 61. Don’t say.... Click here! pleinairinteractive.com
    62. 62. Tools/Apps Buffer - bufferapp.com - scheduled posting to Twitter, FB, LinkedIn and analytics Twylah - twylah.com - increases engagement Tumblr - tumblr.com - post images, messages from mobile devices Instagram - instagram.com - Post photos, cross-post to Facebook, Twitter Foursquare - foursquare.com - check ins pleinairinteractive.com
    63. 63. Must-read books Mobile First - Luke Wrobleski Alertbox - Jakob Nielsen (mobile usability) UIE.com - Jared Sprool (mobile articles, webinars) Tapworthy: Designing Great iPhone Apps - Josh Clark eBooks: Ann Rockley, Charles Cooper pleinairinteractive.com
    64. 64. Resources Luke Wrobleski - ideation and design: http://www.lukew.com/ff/ Mobile first: http://www.abookapart.com/products/mobile-first Alertbox: http://www.useit.com/alertbox/ eBooks 101: http://www.ebooks101book.com Responsive Web Design: http://www.abookapart.com/products/ responsive-web-design Touch gesture reference guide, stencils: http://www.lukew.com/ff/ entry.asp?1071 User Interface Engineering - webinars, articles: http://www.uie.com/ pleinairinteractive.com
    65. 65. Q&Ahello@pleinairinteractive.com pleinairinteractive.com
    66. 66. Thank you Rob Landry rob@pleinairinteractive.com www.pleinairinteractive.com @portlandhead, @gopleinair facebook.com/gopleinair linkedin.com/in/robertarthurlandry pleinairinteractive.com

    ×