Going mobile writing content for mobile
•Télécharger en tant que PPS, PDF•
5 j'aime•1,767 vues
Recommandé
Recommandé
Contenu connexe
Tendances
Tendances (20)
En vedette
En vedette (20)
Similaire à Going mobile writing content for mobile
Similaire à Going mobile writing content for mobile (20)
Going mobile writing content for mobile
- 1. Going Mobile What you need to know to create content for mobile devices
- 2. In This Presentation • Mobile and Mobile devices • Types of technical content to write for mobile • Design considerations (layout, language) • Look at instructions for mobile devices • Publishing to mobile (Out put types, Tools, Single sourcing)
- 3. What is mobile? “It’s not about the platform or technology its about the context. And when we differentiate by context, mobile as a concept, and a device, … into a range of scenarios: from interacting with the barcodes in a shop, to checking the bus schedule on your way to the station, playing games hours on end or spending 10 minutes reading through an article ...” Helge Tenno
- 4. What are Mobile devices • Portable • Hand held • Usually refers to Smart Phones or Tablets (with a touch screen) Picture from jquerymobile.com
- 5. The Big 3 From left: Lumia 900, iPhone 5, Samsung Galaxy S3 Picture from : www.cnet.com/iphone-5/
- 6. Mobile (R)Evolution MOCOM 2020 - The Future of Mobile Media and Communication
- 8. Mobile in 2013 • Brand wars will fuel innovation • Apps evolving and becoming more useful not just “time killers” and games. • Digital wallets • Flexible devices • Personal cloud • Seamless user experience
- 9. Using mobile devices for instruction Katy ISD -- A New Vision for Mobile Learning
- 10. What kind of technical content can we write for mobile devices?
- 11. Non APP Content on Mobile • User instructions • Technician instructions • Installation • On-site service information • Reference material • Programming Maps • Code samples and snippets • Instruction videos
- 12. Instructions for APPs • Help • Content Sensitive Help • Tutorial, Walk-through and Demo • Reference material • Instruction videos
- 13. APP Types • Native APPs • Native to the devices operating system, are installed and run directly on the device. • Has access to the devices features, hardware, ect. • Do not work cross platform • Web APPs • Runs in the mobile device’s web browser. • Limited access to the device’s native features • Can run in different devices as long as they have a browser. Picture from http://info.actionpaper.net
- 14. Design Considerations Picture from www.mlwebco.com
- 15. “Reading Mobile Content Is Twice as Difficult” Jakob Nielsen reader comprehension on mobile Summary: When reading from an iPhone-sized screen, comprehension scores for complex Web content were 48% of desktop monitor scores. Analysis of Facebook's privacy policy Results: Desktop screen: 39.18% comprehension score Mobile screen: 18.93% comprehension score Source: www.nngroup.com/articles/mobile-content-is-twice-as-difficult/
- 16. Keep it Focused • Clutter free main page with links to other topics. • Each page should focus on a topic. • Reading on small devices is hard - text is often skimmed. • Useful information should be found at a glance.
- 17. Keep it Vertical • Handheld devices are usually used in vertical mode. • Scrolling down is fine, sideways is okay sometimes. Scrolling up, down left & right is disorienting. Picture from www.funnyjunk.com/
- 18. Keep it in Style • Mobile Users have mobile design expectations layout, buttons, mobile language • Apps have character Picture from wt.blog.ictea.com/?cat=11
- 19. Keep it Light • Heavy graphics and media slow down the phone and can cause time out. Picture from www.tested.com/
- 20. Design for Easy Thumb Reach • Controls at the bottom • Scrollable content and buttons in the middle. • Headers for viewing only on top. • Consider left handers Picture from//mobile.smashingmagazine.com/2012/07/12/elements-mobile-user-experience/
- 23. Sample of Demo Source: www.inspireux.com/
- 24. Sample of Tutorial Source: www.inspireux.com/
- 25. Sample of Walkthrough Source: www.inspireux.com/
- 26. Sample of Screen Overlay www.inspireux.com/
- 31. Output Types • Instruction APP • Stand alone PDFs • Widget or Mobile Website • Help • Mobile help • HTML5 • ePub for Reading devices
- 32. Tools • Wiziapps – for making APP’s • Iridize – on page instructions, walkthrough demos • PDF • Flare (Web APP and HTML5) • Robohelp 10 (Android native APP & Web APP)
- 33. Single Sourcing • Flare (Web APP and HTML5) • Robohelp 10 (Android native APP & Web APP) • Plan for Mobile content: • Skins • Page breaks • Mobile language • Remove or trim graphics
- 34. Where to Find Further Information • Tapworthy Designing Great iPhone Apps By Josh Clark Publisher: O'Reilly Media • Content Strategy For Mobile By Karen Mcgrane • Neil Perlin • Tom Johnson - idratherbewriting.com • www.SmashingMagazine.com • Mobile Summit • Mobile Mondays (www.momotlv.com)
- 35. Thank You • mayairv@yahoo • @Maya_Regev
Notes de l'éditeur
- smaller screen hurts comprehension because: Users can see less at any given time. Thus, users must rely on their memory when trying to understand anything that's not fully explained within the viewable space. Less context = less understanding Users must move around the page more, using scrolling to refer to other parts of the content instead of simply glancing at the text. Scrolling introduces 3 problems: It takes more time , thus degrading memory. It diverts attention from the problem at hand to the secondary task of locating the required part of the page. It introduces the new problem of reacquiring the previous location on the page.
- Short term memory – don’t expect reader to remember information from one screen to another.
- Rotation is often turned off. Users must move around the page more, using scrolling to refer to other parts of the content instead of simply glancing at the text. Scrolling introduces 3 problems: It takes more time , thus degrading memory. It diverts attention from the problem at hand to the secondary task of locating the required part of the page. It introduces the new problem of reacquiring the previous location on the page.
- http://mobiledesignpatterngallery.com
- Convertbot is a unit conversion tool. Upon first launching the app, it asks the user up-front if they’d like to view a demo of how it works, then uses an animated demo along with bubble callouts to demonstrate the end-to-end action of converting something within the app. This demo is also accessible under the “Support” screen in the app, allowing the user to view it at a later time.
- http://mobiledesignpatterngallery.com
- http://mobiledesignpatterngallery.com
- Designing for mobile like shift from PDF to Help in 2000. Widget or Mobile Website – can be updated easily.
- Designing for mobile like shift from PDF to Help in 2000. Widget or Mobile Website – can be updated easily.
- Iridize – on page instructions – webapps. PDF good quality graphics to the side