Forum Discussion
Remove play button on html5 opening screen in Storyline 360
Is there a way of editing the code on one of the files to remove the big play button that appears on the opening screen of a mobile device accessing the html5 file? I've seen threads on how to do it...
Hi Wendy -
Thanks so much for responding. See below for more details.
In SL2, if you selected Web Publication and checked HTML5 only, the published output had a mobile folder. Within that folder, there was a player_complied.js file. Within the body of that file, it was possible to locate and change the setting of populateIOSLaunch to remove the need for the user to have to click a Play button to initiate the start of an interaction on an iOS device ( avoiding multiple clicks to just get the mobile user started). This solution only works if the first slide is NOT a video, so we adjusted our SL2 content accordingly.
However, in SL 360, that player_compiled.js file no longer exists. Instead, according to Articulate Support, the automatic display of the white screen and play button for iOS is controlled by the app.min.js file, which is referenced as a link source in the last lines of the story_html5.html . I've been able to open the app.min.js file, but the setting of populateIOSLaunch is no longer used. Because the file in minified, our developers are having difficulty determining what part of the code is actually controlling the Play button for iOS.
I thought about using the new responsive player, but my understanding is that it doesn't support JS - which we use extensively to both pass variables between SL interactions and the underlying database, and to notify the event listener on triggers associated with the user completing / cancelling out of the interaction.
Unfortunately, for now, the user experience for an iOS mobile user using Articulate 360 file isn't on par yet with our SL content. If you or anyone else has a workaround or solution now that we've moved to SL 360, I'd welcome it.
Mary
Hi Mary,
Although I can't help with the code modification I did want to make one distinction that the new responsive player within Storyline 360 is different than the Articulate Mobile player. The latter is what doesn't support Javascript as detailed here. The responsive player is what you're seeing when you view the HTML5 output on a tablet or mobile device.
Storyline 360’s HTML5 output and new responsive player give learners the best viewing experience on tablets and smartphones, making Articulate Mobile Player (AMP) output unnecessary, unless learners need to download content for offline viewing or your course includes FLV videos with alpha-channel transparency, both of which are supported in AMP.
Hope that helps clarify that piece and that someone else in the community can help with those code adjustments!
Hi Ashley -
Thanks for replying. Great news about Storyline 360 output supporting Javascript.
I'm trying to confirm my understanding of the new Storyline 360 published output, and maybe you can help. In SL2, we used the Publish to Web output option. We uploaded the story_html5.html file to our web server (or app server) and then created a link on the website page (or app screen) that launched the story file for the user to view from their laptop, tablet or smartphone.
If we select Storyline 360 as the published output type, the file is then published to Articulate 360. From the published message dialogue, I'm provided with a 'View Project Link', which - when clicked - launches the Articulate 360 review page. While Review is helpful, I'm looking for the file that I would upload to our server so learners can view the SL360 content from our website (or mobile app) on their tablet or smartphone.
Based on information on how to publish Articulate 360 for mobile devices, I think web output is still the publication option we should select, and we should still link to the uploaded .html file (we don't want users to download and don't need Flash). If that's the case, I guess I'm still waiting for some indication of where in the app.min.js file the play button can be suppressed for iOS devices.
Let me know if I'm on the right track!
