I've been noticing some problems with the HTML5 playback. The problem seems to stem from the way animation timing is handled in the HTML output. Most of the time it works as intended, but occasionally you can scrub along the timeline to a point where things get out of whack. Sometimes an object may show up at the wrong time or a fade sometimes does not play and may just quickly appear/disappear depending on the animation. Is there a way to avoid or fix this issue?
Hi there Brandon, I'm happy to help here! I'm curious if this is happening due to the environment you're testing in. Where is the published output hosted? Also, what version of Storyline are you using?
If you've got a sample file you can share with me, even better!
The output was created with the latest version of Storyline 2 and has been hosted on multiple different servers by different providers. I can get this to happen in Chrome, Firefox, and IE just seems to be a broken mess with a lot of other issues. Unfortunately, I'm unable to share the files for NDA purposes, but I can tell you that it happens on other course files as well. My guess is that it's something with the Javascript Storyline uses for its HTML output.
Thanks for letting us know those details. Storyline 2 HTML5 output is only support in Google Chrome and Safari, so I'd expect to see some strange behavior in Firefox and IE.
If you're seeing odd behavior with the HTML5 output in the latest Chrome, however, that's something we'd love to dig in deeper with you about. I completely understand the privacy constraints, and wanted to mention that you can share your file privately with our Support Engineers here. They can even sign an NDA.
If that's not a viable option, would you be able to share a stripped down version or example file where the same behavior happens?
I made a quick example with some generic assets. I was able to get the one female image, which ends at 4.5 seconds, to still show at the end of 6 seconds. Also, if I scrub through the project the images will sometimes flicker like crazy instead of showing the fade in or out animation. Sometimes the animations do not to not play at all. Attached is a zip with an image showing the female at the end of the timeline and the project with the publish.
Note: I was able to reproduce these results in the latest version of Chrome.
Thanks for sharing the copy of your course. I published it using Storyline 2 Update 12 which is the latest update and I uploaded it here.
I tested the preview, Flash and HTML5 in Chrome, and I couldn't get the illustrated character to remain on the slide. The animations seemed to work normally too fading in and out. Can you look at that example for me and tell me how it behaves for you?
We've tried it on multiple computers and multiple browsers and it still breaks. Attached is a screen recording that I took using your link. If you notice as I scrub, the images start to freak out and flicker like crazy even when the animation should not be happening. Then occasionally you'll notice some of the images just disappear and never play their fade out animation. Last, but not least, I get the images that should have gone away seconds earlier, to stay up until the end of the timeline. Clearly, there is something wrong with your code.
10 Replies
Hi there Brandon, I'm happy to help here! I'm curious if this is happening due to the environment you're testing in. Where is the published output hosted? Also, what version of Storyline are you using?
If you've got a sample file you can share with me, even better!
The output was created with the latest version of Storyline 2 and has been hosted on multiple different servers by different providers. I can get this to happen in Chrome, Firefox, and IE just seems to be a broken mess with a lot of other issues. Unfortunately, I'm unable to share the files for NDA purposes, but I can tell you that it happens on other course files as well. My guess is that it's something with the Javascript Storyline uses for its HTML output.
Hey Brandon,
Thanks for letting us know those details. Storyline 2 HTML5 output is only support in Google Chrome and Safari, so I'd expect to see some strange behavior in Firefox and IE.
If you're seeing odd behavior with the HTML5 output in the latest Chrome, however, that's something we'd love to dig in deeper with you about. I completely understand the privacy constraints, and wanted to mention that you can share your file privately with our Support Engineers here. They can even sign an NDA.
If that's not a viable option, would you be able to share a stripped down version or example file where the same behavior happens?
Let me know!
I made a quick example with some generic assets. I was able to get the one female image, which ends at 4.5 seconds, to still show at the end of 6 seconds. Also, if I scrub through the project the images will sometimes flicker like crazy instead of showing the fade in or out animation. Sometimes the animations do not to not play at all. Attached is a zip with an image showing the female at the end of the timeline and the project with the publish.
Note: I was able to reproduce these results in the latest version of Chrome.
Hi Brandon,
Thanks for sharing the copy of your course. I published it using Storyline 2 Update 12 which is the latest update and I uploaded it here.
I tested the preview, Flash and HTML5 in Chrome, and I couldn't get the illustrated character to remain on the slide. The animations seemed to work normally too fading in and out. Can you look at that example for me and tell me how it behaves for you?
We've tried it on multiple computers and multiple browsers and it still breaks. Attached is a screen recording that I took using your link. If you notice as I scrub, the images start to freak out and flicker like crazy even when the animation should not be happening. Then occasionally you'll notice some of the images just disappear and never play their fade out animation. Last, but not least, I get the images that should have gone away seconds earlier, to stay up until the end of the timeline. Clearly, there is something wrong with your code.
Thanks for sharing your video on how to recreate the issue. I'm certainly seeing the same behavior if I follow your steps.
Would you be able to share the .story file so that I can take a closer look and get this reported.
I already shared it in my previous post named "html_issue.zip" that Ashley Terwilliger used to publish with.
I apologize Brandon - I saw a .zip file and typically that's the zipped published output. I'll take a look.
I took a look Brandon and I am able to see what you are reporting when publishing to HTML5, as we've discussed above.
I tested with removing the animation and it works as expected.
I do see where we have a similar issue reported, so I will add this thread and details to the report.
This discussion is closed. You can start a new discussion or contact Articulate Support.