Issues with storyline on iPad

Apr 08, 2016

Is it possible to have storyline play in the browser on an iPad?  When I go to the published scorm module in a browser it displays a small preview of the first slide along with a launch button.  The launch button launches the articulate mobile player, but I would like to keep the user in the browser.

The second issue is that when it does open in the articulate mobile player all of the web objects are smaller than they appear in the preview or when viewed on a desktop browser.  This makes the web objects unusable.  Also some of the objects like hotspots and images do not appear in the mobile player.  Again this makes the project unusable.

My third issue is that the web objects take a little bit of time to load but the audio will start playing from the storyline timeline right away.  The web object is a short animation that I would like to have synced to the audio.  I have tried placing the audio directly in the html5 animation but the audio doesn't play because mobile browsers won't play audio without user input.  Is there a way to not play the slide until everything is loaded and ready to be played?

My .story project is attached.

5 Replies
Ashley Terwilliger-Pollard

Hi Eric,

If you want it to appear solely in the browser you'll want to remove the option at publish for using the Articulate Mobile Player. You can read more about the publishing options available here when accessing on a mobile device. As far as elements not working, could you point to specific items that aren't working? There are some known things here for the Mobile player and HTML5 that wont' work the same as Flash so you may want to begin by reviewing that. 


Eric Fortin

Thanks, yes I found the option for removing AMP during publishing.  That fixed the need the issue with the content only playing in the AMP.  It also fixed the issue with the web objects showing up very small.  In the browser on my iPad the web objects are showing up the correct size.

I have reviewed that chart to see if anything that wasn't available on html5 was the issue but none of the things that aren't working for me are unchecked on the chart for html5.  The main thing that is an issue for me is the drag and drop does not work on iPad and the web object (html5 animations) are not synced with the audio in the storyline timeline.

The drag and drop that does not function on iPad is on slide e: Writing a Treble Clef.  It sort of works on a desktop browser but the draggable image flickers and most of the time it is not visible.  The drag and drop works flawlessly in the preview in storyline.

I have tried to get the audio to sync two ways, one was to just include the audio in the html5 animation but the audio doesn't play on an iPad because it requires user input to play audio which means the audio doesn't play until you touch the web object.  By the time you touch the web object it is already out of sync.  The other option I tried was having the audio in the storyline timeline but because the web object takes a little bit of time to load the audio has already begun playing and therefore it is out of sync.


Ashley Terwilliger-Pollard

Hi Eric,

Thanks for checking into those items. As for the drag and drop, I suspect we'd need to see the course and how it's behaving once you've published and uploaded to your LMS or web server. Did you check to confirm that you're working on the latest update of Storyline 2 Update 7? 

Web objects won't be synced with the slide timeline, as they are linking to that location on the web and not included directly in the slide. I'm unclear on how you added it to the HTML5 animation - do you mean as a part of the web object itself and then that's what you've inserted into your .story file? You may want to look at sharing the .story file here as a part of the community forums so that other users could take a look at what you've set up and offer some additional advice since it seems to be working as expected (in terms of the slide timeline and web object not being synced and click to play media elements within the iPad) 

You can upload it using the "add attachment" button at the bottom of the reply window. 

Eric Fortin

The .story file is attached to my original post in this thread.  I have tested on scorm cloud and the drag and drop does seem to be working on iPad now, but I am seeing a new issue on desktop browsers.  When you roll over the background image for the drag and drop the dragabbles disappear sometimes.  This can be seen on slide 1.5 in the link below on scorm cloud.

My other issue with the audio and html5 animation still persists.  It seems my options are to include the audio in the html5 animation, or play the audio in the storyline timeline. 

The issue with including the audio in the html5 animation is that mobile devices require user input to be able to play audio.  This means no sound plays until the user touches the animation.  By that point the animation has already begun playing and therefore the audio is out of sync.  This can be seen in slides 1.1, 1.4, and 1.6.

When playing the audio from the storyline timeline the sync is also off because it takes a little bit of time for the web object to load.  Is there a way to start the timeline once the web object has been loaded?  Below is a link to the current test project on scorm cloud.  Having the audio play from the storyline timeline can be seen in slides 1.2, 1.3, and 1.5.

Ashley Terwilliger-Pollard

Hi Eric,

Thanks for sharing a link to your published output - and a reminder about the file being at the top. As for the audio and your animations - there isn't a way to sync audio on the slide timeline to play based on the web object as it's timeline is not readable or controlled by Storyline. The same is true in regards to how the audio plays from within the web object, as Storyline doesn't control how quickly that is loaded. I see that you've linked them from a local drive - do you have them hosted on a server where you could link them or do you have the video/animation files that you could insert directly into Storyline. That may give you a better experience in terms of how the elements load together. 

As for the drag and drop, I didn't experience any odd behavior testing it on my desktop using Chrome and within my iPad it all worked as expected as well, although it was a bit difficulty to match up the drags with their drop targets based on size of the item, the screen and that my finger covered the majority of the image so I couldn't really see where I was dropping it. I did notice that when looking at the slide you have a web object sitting behind the drag and drop elements? Web objects will appear at the top of content when they are hovered over as detailed here - so perhaps that is contributing to what you're seeing in terms of the items disappearing? Since I can't see the web object in your .story file I'm guessing it's a similar image to your existing slide set up with the drag/drop items shown?

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