Audio and HTML5 on iPad Frustration

Ah, html5 and the ipad... the bane of my development the past few months

Is the feedback on separate layers in the slide?  You might try adding a trigger to start the layer playing once it's displayed if you haven't already, but it should do this automatically.

Since html5 only wants one audio or video track at a time, I wonder if this is causing the problem.  Maybe the browser is reading it as two audio tracks.  Would it be possible to provide the feedback in separate hidden slides as opposed to layers in a slide?

Hey Scott!

Got a link we can check out, or can you attach the .story file? 

Hi, I have all slides set to advance By User, yet the audio doesn't play (on my computer w/Firefox or IE) on any slides using the story_html5.html file to launch it. I think this is normal when played on my PC through a web browser.

I am unable to test on my android tablet right now. Is there a place to simulate testing this as if it is on an iPad/iPhone?

That pesky audio thingy in HTML5 is tricky to get your head wrapped around.

If you think at a high level that HTML5 does not support auto playing of audio files, then think through your design with that at the forefront.

Clicking a "Submit" button (or any button with any name) to advance to another slide is not necessarily the same thing. You're still advancing to a new slide with the expectations the audio will play. 

The idea here is Click a button > audio plays. Click another button > advance slide.

- or - 

Click a button to advance slide > click a button on that new slide that plays audio.

You have to be "on" the slide first, then present a new button to play audio.

It's not Storyline. It's just how HTML5 works...today. 

Thanks, Kevin. I'm not sure how to even do this, but it sounds like I need to place a button on each slide if there is audio on it, right? Such as Advance to next slide...Play slide...Advance to next slide...play slide.Geez, you are right that it is hard to get my head around it.

OK, so how about I have all slides set to Advance automatically, then when the user arrives, they click Play (a button) that will trigger the audio. Then Next to continue. Right?

Yes. Build a small prototype to test. 

Try something like this:

• Slide 1
• Auto advance to Slide 2
• Click button to play audio on Slide 2
• Advance slide when media completes (audio file)

Something like that my only require one click per slide. The audio.

Hi, Kevin. I very much appreciate your help! I seem to have it working, but what about animation? I don't want the slide animation to play until the user clicks to start the audio, but it does play automatically. So I created another layer that contained all slide animation & objects that played when the play/pause button was clicked, but the 3 triggers on one button didn't work for me. (Button triggers are: play media when clicked, pause media when clicked, show new layer when clicked.)

I can make 2 buttons (Play and Pause) and apply the 3 triggers I mentioned. Or, I may need a variable? Or have static slides with no animation. Am I missing something else? Thanks. -Jill

Oh, and I wonder if anyone has a link to an iPad emulator thingy? I had a link at one time (to an Articulate server?).

Animations should work. But again, HTML5 doesn't auto play of video and audio so it may be the same for animations. Not sure enough to confirm, though.

Here's a link to a iPad mirroring app called "Reflection." For $14 it's pretty slick.

Reflection App

Also, if you're not familiar with this, it's an article in Articulate Support with a chart of what works/doesn't work for Flash, HTML5, and the mobile player.

Articulate Storyline Feature Support for Flash, HTML5, Mobile App Player

Thanks, Kevin. I've got the animation working as desired along with the audio I'll post the file later.

Reflection is very neat, but rather than a mirror app for iPhone/iPad, what I need is a way to see how Storyline will look/play as if on an iPhone/iPad. I do not own one. :o(

Hi, Heroes! I developed a method to make sure animated objects are synchronized with narration/audio in your HTML5 output.  MANY  thanks to Kevin Thorn for helping me understand this!

In essence: 

1. Slide 1 can be set to Automatically Advance to Slide 2
2. Add trigger to play audio on slide 2 when user clicks button, with an additional trigger to Show Layer 2. Place audio on main layer and all other slide elements on Layer 2. 
3. Add trigger on Layer 2  to Jump to next slide when timeline ends (the audio file)

This only requires one click per slide (to play the audio). Please see the attached story file as an example of this method.

Another note about audio that I discovered the hard way (and maybe it is already posted on the community somewhere): FireFox will not play the audio from my HTML5 output, but Google Chrome will. During testing, I mistakenly thought my audio wasn't working at all, when it was just a Firefox issue.

I hope this is helpful. The community has done so much for me! -Jill

Hi

I want my slides to advance 'when media completes' - in this case tigered by a specific audio file.

This works fine in preview mode, but not in HTML5 - is there something I've missed?

Liz

Hi;

Make sure you set your slides to advance automatically and not by a Click from User

Hello all,

Can I use Play audio trigger when timeline start? Instead of auto advance and all that. 

Hi Ravindra!

This thread is a bit dated, but what you are asking should work. Are you having difficulty with something you'd like us to take a look at?

Oh, I see a bit more detail here and invited you to share your project file.

This HTML5 audio issue is a real pain in the rear.

It happens on Chrome 57, and MobileSafari.

Any company that solves this issue would seem to have a huge leg up on the competition since everyone is dealing with this problem.

Hi Steve,

This forum discussion is a bit older, but as you can see in the earlier comments and the other linked forum discussion - the different browsers deal with Flash/HTML5 output a bit differently especially when it comes to auto play of the media elements. In Ravindra's case mentioned here, ultimately the "trigger that plays the audio file when the timeline starts" was what solved the issue on his end for use and playback on the iPad devices.

If you'd like our team to take a look and test your files, we'd be happy too - can you share a copy of the .story file with us using this form?