Publishing for iPad- Problems with Articulate app and HTML5

I'm working on a course that needs to be accessible via iPad. Apparently, I cannot use the Articulate Mobile Player since the LMS we're working with does not support Tin Can API (which I understand is necessary for products accessed by logging into an account). 

This seems to leave HTML5. However, things that worked great in Flash are bugging up in HTML5. Here are just a few I found so far:

  • the logo image in the player doesn't show
  • some text renders less clearly
  • at times the entire player flickers (usually upon first loading, so maybe this is a loading issue?)
  • when clicking on the "notes" tab, the menu items jump on top, and the notes get pushed further down screen 
  • i created custom variables to track correct/incorrect answers for interactions. These variables are linked to images on a review screen, whose status changes depending on whether or not the answer was correct. However, sometimes the image status changes appropriately, and other times it does not update to reflect the correct value. I cannot figure out why there is this inconsistency. (I've tried placing the trigger for changing the variables in clicked object triggers and timeline start triggers of feedback layers. Neither provides consistent results).

I've consulted the following http://www.articulate.com/support/storyline/comparing-storylines-flash-html5-and-articulate-mobile-player-output but I'm still encountering unexpected issues.

Has anyone else had similar issues? Any issues with triggers/variables performing erratically? Does this have to do with the way HTML5 loads/refreshes? 

Also, I put in a feature request for being able to preview HTML5 content from Storyline. If this would be helpful for you, please request it as well! http://www.articulate.com/support/contact/submit.php?form=feature

12 Replies
David Sensenig

So i created some variable references and it turns out that loading IS the issue of why the variables behave erratically. When set to adjust the variable at the beginning of the timeline (for the "correct" feedback layer), if the user clicks "continue" too fast, the variable does not have time to change from false to true (or vice versa). This lag means the variable may or may not be adjusted. When the trigger is added to the beginning of the timeline of an object, the response is faster than when set to the beginning of the timeline of a layer, though still not instantaneous.

Not sure why this is; you'd think the beginning of the timeline would trigger events immediately.

Also discovered the seekbar can't be dragged the whole way to the right when the player is enlarged. Hm.

Ashley Terwilliger

Hi David,

There was a known issue with logos and HTML5 which was fixed in update 3, although it would only impact new Storyline projects. If you need to fix previously created Storyline projects you'll want to follow the directions here.  Also in regards to the flickering, due to mobile Safari browser limitations, we must redraw the canvas for certain events to occur, such as displaying slide layers. When this happens, you may see a brief flicker.

You also mentioned the notes information appearing with menu items, which is also a known issue described here. The suggested workaround in the meantime, is you can avoid this behavior by enabling or disabling both player tabs (Menu and Notes).

I haven't heard of the variable issues you're describing, but is your continue button a part of the slide or included in the player? If it's on the slide itself, and you click it before the slide finishes loading, I could see how it would not fire the variable trigger. It sounds like you've figured out a workaround that will work for you though. 

David Sensenig

Thanks for the response, Ashley. The continue button is part of the feedback layer, not the player. If enough time is allowed for the slide layer to load completely, the variable is updated. If I adjust the variable by triggering the start of the timeline of the continue button, and set the continue button to appear a fraction of  a second after the feedback timeline, the variable is adjusted more quickly than if I add the trigger to the start of the timeline of the feedback slide.

Ashley Terwilliger

Thanks for the additional information David, and since you mentioned it being on the slide itself it seems that it's not able to fire the other triggers until the slide loads completely. It sounds like you've gotten it to work as you'd like though, and if you need anything else please let us know. If something is still not working as expected please share your .story file here with us too as that may help us get a sense of what is happening. Also, you're always welcome to share it here as well. 

David Sensenig

Ashley, I did want to mention that I already have both the menu and notes tabs enabled; I'm still getting the unexpected insertion of the menu tab into the notes tab. As to disabling both, that doesn't seem to be a good option if you'd like to use those features. Hopefully this bug can get worked out soon.

David Sensenig

Case #00373789.

I was further directed to: http://www.articulate.com/support/storyline/menu-and-notes-display-in-the-same-player-tab-in-html5-output 

(note that when adding !Important; to the .css file, the semi-colons need to move too. I missed this on my first try).

Thanks Ashley to you and everyone else who has helped me get this straightened out.

David Sensenig

Arg. Thought the logo issue was fixed, but every so often it disappears again. I'll re-load it and it will work fine for awhile, then disappear. I have been saving my files to a network drive and I just came across your post here: http://community.articulate.com/forums/p/35710/192077.aspx#192077 that discusses file corruption. Is it possible this could be related?

Is a best practice to save files to a local machine, and then copy to a network drive for backup?