HTML5 Audio and Slide Layers in Storyline -FAIL!

Feb 21, 2013

Randall Sauchuck
By Randall Sauchuck

We have a custom interface with a Pause button on it. when the learner clicks this button it shows the slide Layer "pauseLayer". This layer is blank except for a Play button in the same location as the Pause button (to approximate a toggle button). When the user clicks the Play button it hides the slide Layer. We have the "pauseLayer" set to "Pause the main timeline playback".

In the Flash player it works great. Clicking "Pause" pauses the main timeline animation and audio playback. Clicking "Play" resumes from the point it stopped. Perfect!

IN HTML5 it is a failure. Clicking "Pause" stops the playback and audio but clicking "Play" resumes the animation ONLY. The audio never resumes.

THIS IS A CLIENT SHOW STOPPER!
Much of their user base is moving to HTML5 over Flash (iPads vs Desktops)

I have tried every possible combination of settings (main layer" reset to initial state on return" vs "resume from last point" vs "let computer decide" No difference. I have had NOTHING but trouble with HTML5 audio and slide layers on multiple projects. Its gettting old.

BTW iPad is running most current iOS so its not that. The same problem occurs on computer browsers running the story_html5.html version too. 

49 Replies
Randall Sauchuck
11 years ago02/21/13 at 12:40 pm (UTC)

I have tried multiple work arounds to no avail.

1. I replaced the "pauseLayer" Slide Layer trigger with a Lightbox Slide. This works great at pausing the audio in HTML5 and resuming it on close of the Lightbox. However since the Lightbox covers most of the screen and the developer has absolutely no control over it....it defeats the purpose of pausing to let user's read the screen.

2. I added a second media trigger to my Pause and Play buttons. Apparently the most recent version of SL added the ability to target audio already in the slide (I do not remember this option being there before in any case) So the Pause button Shows the layer AND pauses Sound1 while the Play button hides the layer AND pays Sound1. This works great as long as the user does not pause more than once on a single screen. If they do then the Play button choose the earlier point in the Sound file to start from and animations are no longer synchronized with the audio.

We are now at the point where the client is refusing to pay if we do not get this fixed to their satisfaction. So it looks like we may close the book on Storyline and redevelop all the content in Captivate,Lectora, or our own framework.

renee barnes
11 years ago03/25/13 at 11:18 am (UTC)

We have had many issues:

1) audio on main layer does not resume when layer (with audio) is closed.

2) video on layer even though set on auto play, most of the time does not restart automatically. user is forced to click the play button to start the audio but then the audio cannot be paused. if we leave the slide and return, open the layer again, the video keeps playing from when it stopped and we cannot turn it off unless the layer is closed.

3)  and this one in the quiz.....because the feedback is shown in layers, there is a flickering.

All these issues in html 5. we will try a version without layers to see if we have a better result.

By the way, when you branch off to a separate screen in a separate scene, but want to  give the impression that the user is still in a "layer" on the original screen, how do you trick the user into thinking they are on the original slide in the table of contents?

joshua simpson
almost 11 years ago05/21/13 at 12:54 pm (UTC)

Bump.

Any resolution to the layers issue spelled out above? We want to do a pause layer but I can't get the playback to work consistently.

I keep running into these threads where I have an issue that has already been presented to Articulate and continuously hear the "it will be fixed in a future update" or "I was able to recreate your issue but I cannot resolve the issue and have no timetable for a resolution". These are a tad discouraging.

Please update.

Thanks,

Josh

renee barnes
almost 11 years ago05/21/13 at 1:44 pm (UTC)

Our update is that we are using layers and things work ok IF the file is not loaded with audio, video, layers and triggers. For us, if we have a linear presentation  (with video in 1-3 screens) AND 1 or 2 screen with multiple layers. it works fine most of the time. But as we keep adding stuff (videos, audio, triggers), things start falling apart. Not sure if it is a software thing, since the other software we use also has challenges when publishing to html 5

Micah White
almost 11 years ago05/29/13 at 11:53 am (UTC)

Hi guys.

We have the update 3 1305:2012

We have a custom next button, back button, and pause play toggle on the master slide.  We use the old, "show a blank layer" trick to pause audio. 

The html5 output is still hosed on  the ipad. Audio does not pause, it restarts. The next and back buttons are really hard to press, and are not really usable,  

This is blowing away our first big Storyline deliverable. If anyone is getting luck here, can you tell us what steps you took ?

Patrick

William Nunes
almost 11 years ago06/24/13 at 8:48 pm (UTC)

I just discovered the html5 audio bug happening on a Galaxy Tablet - Android 4.0.4 (this is THE chosen device my client wants their training delivered on.)

I have a page with audio narration and synced text/graphics. Plays fine the first time, but after that page's timeline completes, clicking to another page, then back again, the audio will not replay.

On the tablet, the entire page seems stuck at the end of the timeline. Replay button does not work. I tried manually dragging the seek/progress bar back to the beginning and clicking Play, but it snapped right back to the end; no audio.

BTW, testing the html5 version on my laptop yielded slightly different behaviors: Firefox - plays first time, then won't replay, but dragging the seek bar will get it playing again. IE9 does the best. Replay button doesn't work, but clicking Play again will restart the page and audio. All of them--FF, IE, or the Tablet browser (Safari)--are ignoring the "Reset to Initial State" setting: if I click away before a page is done, when I click back it picks up where I left off.

I'm tired and frustrated. I have a workaround idea but I'll try it in the morning and report. If anybody has some good thoughts about tablets and html5, please let me know. Thanks.

Brian Batt
almost 11 years ago06/25/13 at 7:10 am (UTC)

William Nunes said:

I just discovered the html5 audio bug happening on a Galaxy Tablet - Android 4.0.4 (this is THE chosen device my client wants their training delivered on.)

I have a page with audio narration and synced text/graphics. Plays fine the first time, but after that page's timeline completes, clicking to another page, then back again, the audio will not replay.

On the tablet, the entire page seems stuck at the end of the timeline. Replay button does not work. I tried manually dragging the seek/progress bar back to the beginning and clicking Play, but it snapped right back to the end; no audio.

BTW, testing the html5 version on my laptop yielded slightly different behaviors: Firefox - plays first time, then won't replay, but dragging the seek bar will get it playing again. IE9 does the best. Replay button doesn't work, but clicking Play again will restart the page and audio. All of them--FF, IE, or the Tablet browser (Safari)--are ignoring the "Reset to Initial State" setting: if I click away before a page is done, when I click back it picks up where I left off.

I'm tired and frustrated. I have a workaround idea but I'll try it in the morning and report. If anybody has some good thoughts about tablets and html5, please let me know. Thanks.


Hi William and welcome to Heroes,

We don't officially support HTML5 on the Android side.  Unfortunately, Android lacks support for a specific HTML5 audio API that has been in place on the Apple side since the first version of iOS 6.

With that being said, the Android version of Google Chrome currently has the audio API in beta.  Once they've pushed that API to its release version, we'll start reviewing content on that browser to see if we can officially support it on the Android side.

Regarding the "reset to initial state" issue, can you send me your .story file?  I'll contact you via a private message.

Fred Tacon
over 10 years ago10/23/13 at 9:24 am (UTC)

Brian,

I have Update 3 but I am also seeing this audio issue. I have a screen with several steps in a process. When a user clicks a step, a layer is displayed that contains details and plays an audio file explaining the step. The user can click a close button to hide the layer and return to the process. Audio works fine the first time the user clicks a step. But, if they want to view the step again, the audio will not play in the HTML5 publish. Flash publish works fine. Please advise. Thanks!

Fred

This discussion is closed. You can start a new discussion or contact Articulate Support.