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.

Content Design for Mobile Devices - Now What? Conference 2017

136 views

Published on

We’ve all been so focused on designing for mobile devices that we’ve forgotten about content. But how your customers find, consume, and share your content on mobile is more important than ever. Learn about how to use content strategy to solve these issues, including content modeling, content auditing, and the core model. It may sound super nerdy now, but it won’t be once you’re there.

Published in: Marketing
  • Be the first to comment

  • Be the first to like this

Content Design for Mobile Devices - Now What? Conference 2017

  1. 1. Mobile Content Design Ahava Leibtag President Aha Media Group Now What 2017 1
  2. 2. 2
  3. 3. The Martian
  4. 4. 8
  5. 5. Designing for mobile is about content strategy work first and then mobile design second. 9
  6. 6. Steps to Great Content Design for Mobile 1. Understand users’ needs 2. Understand the technology 3. Understand the content ecosystem 4. Create content models and core pages 5. Prioritize the content 6. Other things to think about
  7. 7. Understand Users’ Needs 11
  8. 8. 12
  9. 9. Backstory: He has been working for the same law firm for 12 years and business has been growing quickly. His administrator hired the previous two IT companies but neither of them could keep up with the firm’s growing needs and he was disappointed by their work ethic. He knows the firm needs outstanding outside help because they don’t have the resources to bring in an internal IT employee. He wants a company that will help anticipate the firm’s needs. He wants to hire a highly recommended company that is extremely reliable. Age: 38 Lives in: Bethesda, MD Education: Georgetown Law School, Penn Undergraduate Occupation: Patent Attorney in Washington, D.C. HH Income: 250K (+50K) Family: Wife, Julie, 34, Graphic Designer Daughter, Danielle, 11 Son, Michael, 8 Lifestyle/Personality: • Drives an Acura and wife drives a Honda CRV • Gym membership and plays tennis • Coaches Michael’s soccer team • Family travels twice a year to California • Shops at Brooks Brothers and J.Crew • Dines out often with clients Devices and Channels: iPhone, iPad, laptop and desktop News and Information: Reads the Wall Street Journal and world news online Tasks and Objectives: • What kind of IT support do you provide? • How much experience do you have with the legal industry? • Do you have after business hours and weekend technical support? How responsive are you during those times? • Is there an assigned primary technical consultant? • Will you recommend and purchase hardware and software products for my law firm? • What is your pricing structure? • Who are some of your clients? Can you provide customer recommendations? Adam J. Seeking IT services: “We need professional help with our IT.”
  10. 10. QADX Motivations • Find an IT company that will be a good fit for his firm Primary Questions • What kind of IT support do you provide? • How much experience do you have with the legal industry? • Do you have after business hours and weekend technical support? How responsive are you during those times? Secondary Questions • Is there an assigned primary technical consultant? • Will you recommend and purchase hardware and software products for my lawfirm? • What is your pricing structure? • Who are some of your clients? Can you provide customer recommendations? Actions • Call with questions • Schedule a meeting Possible Encounters: • Search online • Referrals Possible Content: • Services • Portfolio • Support Hours Possible Content: • Products • Pricing • Customer Testimonials Possible Modes of Engagement Adam J. Seeking IT services: “We need professional help with our IT.”
  11. 11. Motivations • Find an IT company that will be a good fit for his firm Primary Questions • What kind of IT support do you provide? • How much experience do you have with the legal industry? • Do you have after business hours and weekend technical support? How responsive are you during those times? Secondary Questions • Is there an assigned primary technical consultant? • Will you recommend and purchase hardware and software products for my lawfirm? • What is your pricing structure? • Who are some of your clients? Can you provide customer recommendations? Actions • Call with questions • Schedule a meeting Possible Encounters: • Search online • Referrals Possible Pages: • Services • Portfolio • Support Hours Possible Pages: • Products • Pricing • Customer Testimonials Possible Modes of Engagement Adam J. Seeking IT services: “We need professional help with our IT.”
  12. 12. 16
  13. 13. 17
  14. 14. Understand the Technology 18
  15. 15. 19
  16. 16. Pros and Cons Pros Cons Native Application (App) • One tap on user’s home screen vs a URL to remember / bookmark / type in. • Storing information locally a little better, user preferences, login information, etc. Like Spotify caching songs on your phone. A mobile web site couldn’t do that. • Performance. Generally everything just works faster. • User has to download it and learn how to use it. Several steps in that funnel (open App Store, type in password, etc). • Cost of development. • Maintaining multiple code bases. Responsive • One code base • Scales to any device. • Performance • Can be complex to code (supporting images at many sizes, for example). @ahavaL #cmworld
  17. 17. @ahavaL #cmworld
  18. 18. @ahavaL #cmworld
  19. 19. @ahavaL #cmworld
  20. 20. Responsive @ahavaL #cmworld
  21. 21. @ahavaL #cmworld
  22. 22. Apps @ahavaL #cmworld
  23. 23. 27
  24. 24. 28
  25. 25. Responsive design won’t fix your content problem— but content strategy will. 29
  26. 26. How does this happen? 30
  27. 27. Divorce content from design @ahavaL #cmworld
  28. 28. 32 Category Definition Examples Content What you want to display on the screen Copy, images, data Design How and where you display the data Fonts, colors, placement Metadata The behavior of the content How it displays depending on the “holder”
  29. 29. 33
  30. 30. Understand the Content Ecosystem 34
  31. 31. 35
  32. 32. Ask yourself (and your team) • Formats: What types of digital content do we have currently? (All formats: text, video, audio, pictures, infographics and so on) • Print: Do we have print content that needs to be incorporated? • Architecture: Where does the content live? • Business objectives: How much of an asset is it to the organization? 36
  33. 33. Categorize 1. Focus content: which content is critical your customers and therefore benefits your business? 2. Guide: content that’s important to your users and beneficial to your business 3. Drive: towards content that people didn’t know they were looking for, but is beneficial to your business 4. Meh: content you’ll include because you feel you have to 37
  34. 34. 38 Drive Focus Meh Guide Business Impacts User Needs
  35. 35. Create Content Models and Core Pages 39
  36. 36. 40
  37. 37. The Core Model • Align content with business objectives • Support customers in accomplishing tasks Business Goals User Tasks www.ahamediagroup.com
  38. 38. 43
  39. 39. 44
  40. 40. 45
  41. 41. 46
  42. 42. 47
  43. 43. 48
  44. 44. Creating core pages or components 1. Identify core pages or content components that satisfy business goals and user needs’ 2. Model the content and identify the relationships 3. Map inputs and outputs (how people land and where they go next) 4. Create buckets of content according to their relationships 5. Prioritize which “pages” and content they need: What content elements that you just mapped belong on a small screen? 49
  45. 45. Presentation 50
  46. 46. 51
  47. 47. Prioritize the Content 52
  48. 48. 53
  49. 49. Not what do they need to see. Which order do they need to see it in? 54
  50. 50. 55
  51. 51. 57
  52. 52. @ahavaL #cmworld
  53. 53. Other things to think about 59
  54. 54. 60
  55. 55. User-Friendly Design and Voice/Tone • Loading times • Ergonomic design • Touchpoints • Cues • Microinteractions @ahavaL #cmworld
  56. 56. Loading Times @ahavaL #cmworld
  57. 57. Ergonomics ©Luke Wrobleski @ahavaL #cmworld
  58. 58. 64
  59. 59. Touchpoints @ahavaL #cmworld
  60. 60. Touchpoints @ahavaL #cmworld
  61. 61. Cues @ahavaL #cmworld
  62. 62. Microinteractions @ahavaL #cmworld
  63. 63. Steps to Great Content Design for Mobile 1. Understand users’ needs 2. Understand the technology 3. Understand the content ecosystem 4. Create content models and core pages 5. Prioritize the content 6. Think about microinteractions, cues and touchpoints
  64. 64. 70
  65. 65. Thank you Ahava Leibtag Aha Media Group, LLC ahava@ahamediagroup.com @ahavaL @ ahavaleibtag www.ahamediagroup.com

×