Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

Launching a Mobile App from Concept to Launch

2.812 Aufrufe

Veröffentlicht am

This session presented at ATD Techknowledge 2016 will provide you with the foundation and resources to get started in mobile design. You'll learn best practices for designing for mobile learning, as well as what challenges you may face in platforms, frameworks, and technology, including smartphones versus tablets versus next-generation touch devices. In this session, the speakers will discuss and provide techniques for designing mobile apps that work—from sketching to prototyping. Learn about development tools and how to use HTML5 and CSS3 with responsive frameworks to create courses and apps that can be delivered to mobile and desktop devices.

Application on the Job:
Explore mobile design and how to create a great user experience.

Apply concepts with free resources and templates as soon as you get back to your office.

Discover the difference between HTML and native app development, and how to choose the right one for your project.

Use dozens of web resources to get started quickly.

Veröffentlicht in: Business
  • The Scrambler Unlock Her Legs | 95% Off by Bobby Rio-Rob Judge? ➤➤ http://t.cn/AiurDrZp
       Antworten 
    Sind Sie sicher, dass Sie …  Ja  Nein
    Ihre Nachricht erscheint hier
  • Legitimate jobs paying $40/h Tap into the booming online job, industry and start working now! ★★★ http://scamcb.com/ezpayjobs/pdf
       Antworten 
    Sind Sie sicher, dass Sie …  Ja  Nein
    Ihre Nachricht erscheint hier
  • There are over 16,000 woodworking plans that comes with step-by-step instructions and detailed photos, Click here to take a look ▲▲▲ http://ishbv.com/tedsplans/pdf
       Antworten 
    Sind Sie sicher, dass Sie …  Ja  Nein
    Ihre Nachricht erscheint hier

Launching a Mobile App from Concept to Launch

  1. 1. MOBILE AppLaunching a Nick Floro from Paper to Delivery
  2. 2. share
  3. 3. Experiment experiment
  4. 4. Goals ready
  5. 5. What is mobile?
  6. 6. 3 Key Factors 1. Audience 2. Technology 3. User Stories Why?
  7. 7. Time
  8. 8. Budget
  9. 9. desktoptabletphone Content Strategy phone tablet
  10. 10. App or Web Delivery
  11. 11. Native App • Faster performance • Unique platform features • Requires programming • iOS / Android / Amazon • Increased Costs per OS App Web App • Use web standards • Easy to deploy & update • Support all devices • Faster development cycle • Works everywhere • Requires web connection Web Hybrid App
  12. 12. How will you distribute? App Store Deployment Data Analytics / Reporting Updates Web
  13. 13. Amazon A Quick Example
  14. 14. Amazon Windowshop
  15. 15. What is Design?
  16. 16. How it works. Homework: Watch www.apple.com/designed-by-apple/
  17. 17. It’s about communication and problem solving. Homework: Watch www.apple.com/designed-by-apple/
  18. 18. Content Strategy
  19. 19. Content Strategy
  20. 20. simplify. write it down cut in half cut it again break cut & refine then done
  21. 21. Getting Inspired UI/UX
  22. 22. Flat Pages
  23. 23. Apple Weather
  24. 24. Yahoo Weather
  25. 25. Yahoo Weather
  26. 26. Tab Bar
  27. 27. Apple Clock
  28. 28. Tree Structure One Two Three Four Five Six
  29. 29. Tree Structure < Back Screen One > Screen Two > Screen Three > Screen Four > Screen Five > Screen Six >
  30. 30. First Aid
  31. 31. First Aid
  32. 32. First Aid
  33. 33. Innovation >
  34. 34. evernote
  35. 35. evernote
  36. 36. Pulse
  37. 37. Pulse
  38. 38. Pulse
  39. 39. Flipboard
  40. 40. Sketchingwhere ideas begin
  41. 41. communicate
  42. 42. tell a story
  43. 43. Contents Open Accordion Closed Accordion Closed Accordion Closed Accordion Hamburger Menu Accordion Blind / MODAL Play Text
  44. 44. peek and pop
  45. 45. A Screen New Project Stakeholder Activity • Multiple Choice • Drag & Drop • Photos
  46. 46. Screen 1 Menu Screen 2 Content Screen (include a video & text) Screen 3 Interactive Timeline or Activity (move to see time)
  47. 47. Prototyping on Paper POP
  48. 48. Visual Thinking
  49. 49. Mobile Apps
  50. 50. Adobe Illustrator Draw
  51. 51. Evernote Skitch
  52. 52. Paper by FiftyThree
  53. 53. Wireframing Low / High Fidelity
  54. 54. Tools: • Wireframes – Keynote / PowerPoint Quick Prototyping Techniques
  55. 55. This is my question example where you would tell a story and ask for a response? option 1 option 2 option 3 option 4 option 5
  56. 56. This is my question example where you would tell a story and ask for a response? Answer example the user could select from one of the options. Answer example the user could select from one of the options. Answer example the user could select from one of the options. Answer example the user could select from one of the options. Answer example the user could select from one of the options.
  57. 57. keynotekungfu.com
  58. 58. keynotopia.com
  59. 59. Custom Template in Keynote
  60. 60. Adobe Acrobat
  61. 61. User Interface | UI
  62. 62. User Interface | UI
  63. 63. User Experience | UX
  64. 64. User Experience | UX
  65. 65. Responsive Design
  66. 66. Responsive Design
  67. 67. getskeleton.com
  68. 68. getBootStrap.com
  69. 69. DEVICE ACCESS PERFORMANCE & INTEGRATION MULTIMEDIA OFFLINE & STORAGECONNECTIVITY SEMANTICS CSS3 3D, GRAPHICS 
 & EFFECTS
  70. 70. Parallax
  71. 71. Design for Flexibility
  72. 72. Mobile Factors
  73. 73. Form Factors
  74. 74. Bandwidth
  75. 75. Bandwidth
  76. 76. Input Mechanism
  77. 77. Context
  78. 78. Chrome Developer Tools
  79. 79. BrowserStack.com
  80. 80. Tools
  81. 81. adobe.com
  82. 82. PhoneGap.com
  83. 83. build.phonegap.com
  84. 84. What can you apply from today?
  85. 85. ResourcesTo help you grow.
  86. 86. abookapart.com
  87. 87. w3schools.com
  88. 88. www.uxmag.com
  89. 89. uxpin.com
  90. 90. UserTesting.com
  91. 91. reflectorapp.com
  92. 92. airserver.com
  93. 93. typekit.com
  94. 94. color.adobe.com
  95. 95. Adobe Color CC color.adobe.com
  96. 96. Thank You Nick Floro sealworks interactive studios nick@sealworks.com www.sealworks.com twitter.com/NickFloro Download the Presentation at: http://www.slideshare.net/nickfloro Download Handout: goo.gl/UhRzEw Download App Prototyping on Paper (POP)

×