I'm just about to begin writing my first e-learning module for use on a tablet and I was hoping that the good folk of this forum could offer me with as many tips as possible in the hope of avoiding some pitfalls...
Will I need to make adjustments to sizing or format when creating the module or is it all in the publishing?
What are the things I need to make different from developing a module for a PC?
You'll find that HTML5 output viewed on a desktop browser will often behave differently from a browser on a mobile device, e.g. iPad. So test early, test often on actual hardware!
If you are planning to embed videos for use on the mobile player you need to be aware that if you use standard embedding or add video, Youtube videos will generally not operate in HTML5 browsers on in the Articulate mobile player. Check out the second half of http://www.articulate.com/support/storyline/how-to-add-a-youtube-video-to-storyline to see how you need to do it.
Also, don't put audio on layers (or not a lot anyway) if you plan to play the course via the browser on the iPad because this can overload the memory on the device.
What common issues have you found that do not convert?
It is really difficult to know what will and won't convert, your mantra if a client wants it on iPad should be test/test/test and test some more.
Some things are simple to get round others will need you to rework your slides to create solutions. Simple things like having audio and video on a layer will cause issues.
It is really difficult to know what will and won't convert, your mantra if a client wants it on iPad should be test/test/test and test some more.
Some things are simple to get round others will need you to rework your slides to create solutions. Simple things like having audio and video on a layer will cause issues.
Is this a problem related to Storyline (envisaging a more seamless production in future) or merely the interaction between the media types?
HTML5 is still an emerging technology and not as mature as flash for this reason the published output for HTML5 is currently not as good as the flash output, I am sure this will get better over time. As far as tablets go there are some inherent weaknesses and faults in the devices, HTML5 on iPad will only allow one media type to play no workaround (unless you count merging the two into one file). Android devices are not currently supported but the OS is fragmented and must be a whole bag of pain for developers who are trying to create authoring solutions for HTML5 on these devices.
Windows tablets (including RT) have none of these issues as they support flash and work great with Articulate published content.
While a lot of the postings above have focused on tech considerations, there are, as you know, also a lot of design considerations, not the least of which are things like font and button size and usability. Take a look at some of your favorite tablet apps, see how they handle interactivity, graphics and font layouts, intuitive interfaces, etc. and then apply those to your design.
I've never used the mobile app so everything below has nothing to do with that.
I'm 100% with Gordon on the design aspect. Look into mobile app design for a much deeper understanding of UI (user interface) and UX (user experience) which are not the same thing. That's really what your doing anyways; creating a mobile app that displays instructional content. aka mLearning I guess.
Attached is a great resource I found for designing the size and position of UI elements on any device. Unless your users have "baby" fingers you'll probably have to create all custom navigation since the default buttons are very tiny on a 8" tablet or a 11" inch tablet with high resolution.
Also don't forget that Articulate adds a certain amount of additional border and content around your story size so you'll have to factor that in to ensure the user doesn't have to scroll around to see the whole project.
BTW Adobe Captivate 8 now has full responsive design to adapt your content to varying screen sizes and rotations, has motion gesture support (swiping, zooming, etc...) device preview, the ability to detect what type of device your user is using and adapt and also it can check your project for possible html5 issues. At $20/month it's a pretty useful tool to have in your toolbox along with Storyline.
Another key thing to avoid is embedding Web objects in your iPad productions because there are significant limitations in the way the Articulate Mobile Player app handles them.
Avoid scrolling panels in Storyline! They do not show or work on iPads - with Safari or Chrome. I was told the "2-finger" scroll would work on iPads but we could not get it to work. Spent way too much time on it!
15 Replies
Hope this helps,
Alex
You'll find that HTML5 output viewed on a desktop browser will often behave differently from a browser on a mobile device, e.g. iPad. So test early, test often on actual hardware!
My colleagues are absolutely right.
One more thing to add: Always use the newest update of Articulate Storyline
http://de.articulate.com/support/storyline/issues-addressed-in-the-latest-articulate-storyline-update
Just to avoid spending time.
Thanks for your comments guys...getting started soon,,,
If you are planning to embed videos for use on the mobile player you need to be aware that if you use standard embedding or add video, Youtube videos will generally not operate in HTML5 browsers on in the Articulate mobile player. Check out the second half of http://www.articulate.com/support/storyline/how-to-add-a-youtube-video-to-storyline to see how you need to do it.
This causes an issue?
What common issues have you found that do not convert?
Hi Louis,
Here are some other considerations from a design point of view that you that you might want to consider: Design Mobile Learning Like a Pro: Best Practices for mLearning
And if you'll be publishing for HTML5 I strongly recommend that you read the following articles: Optimizing HTML5 Output
Good luck with your project!
Also, don't put audio on layers (or not a lot anyway) if you plan to play the course via the browser on the iPad because this can overload the memory on the device.
It is really difficult to know what will and won't convert, your mantra if a client wants it on iPad should be test/test/test and test some more.
Some things are simple to get round others will need you to rework your slides to create solutions. Simple things like having audio and video on a layer will cause issues.
Is this a problem related to Storyline (envisaging a more seamless production in future) or merely the interaction between the media types?
HTML5 is still an emerging technology and not as mature as flash for this reason the published output for HTML5 is currently not as good as the flash output, I am sure this will get better over time. As far as tablets go there are some inherent weaknesses and faults in the devices, HTML5 on iPad will only allow one media type to play no workaround (unless you count merging the two into one file). Android devices are not currently supported but the OS is fragmented and must be a whole bag of pain for developers who are trying to create authoring solutions for HTML5 on these devices.
Windows tablets (including RT) have none of these issues as they support flash and work great with Articulate published content.
While a lot of the postings above have focused on tech considerations, there are, as you know, also a lot of design considerations, not the least of which are things like font and button size and usability. Take a look at some of your favorite tablet apps, see how they handle interactivity, graphics and font layouts, intuitive interfaces, etc. and then apply those to your design.
I've never used the mobile app so everything below has nothing to do with that.
I'm 100% with Gordon on the design aspect. Look into mobile app design for a much deeper understanding of UI (user interface) and UX (user experience) which are not the same thing. That's really what your doing anyways; creating a mobile app that displays instructional content. aka mLearning I guess.
Attached is a great resource I found for designing the size and position of UI elements on any device. Unless your users have "baby" fingers you'll probably have to create all custom navigation since the default buttons are very tiny on a 8" tablet or a 11" inch tablet with high resolution.
Also don't forget that Articulate adds a certain amount of additional border and content around your story size so you'll have to factor that in to ensure the user doesn't have to scroll around to see the whole project.
BTW Adobe Captivate 8 now has full responsive design to adapt your content to varying screen sizes and rotations, has motion gesture support (swiping, zooming, etc...) device preview, the ability to detect what type of device your user is using and adapt and also it can check your project for possible html5 issues. At $20/month it's a pretty useful tool to have in your toolbox along with Storyline.
Hello, Louis!
Another key thing to avoid is embedding Web objects in your iPad productions because there are significant limitations in the way the Articulate Mobile Player app handles them.
Please see my complete explanation posted here: Limitations of using Web objects with the Mobile Player app
Best of luck with your project!
Cheers,
Adele
Avoid scrolling panels in Storyline! They do not show or work on iPads - with Safari or Chrome. I was told the "2-finger" scroll would work on iPads but we could not get it to work. Spent way too much time on it!
The ideas shared above are wonderful!
So thankful we have these forums to share ideas!
This discussion is closed. You can start a new discussion or contact Articulate Support.