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 on SL2, but not on SL 360. I can't seem to locate the player_compiled.js (or story_compiled.js) file to even edit it. I'm using SL 360 publish to Web with HTML5 only content option. When the published file gets uploaded to mobile iOS device, the opening screen is always the Play button (see image below). And yes, I know that editing published files is not supported by Articulate.
95 Replies
Thanks so much for sharing your file and allowing me to take a look.
I apologize. You did ask about mobile initially. The play button is standard on mobile devices, which require user interaction.
- AurlienCoussemeCommunity Member
Do you plan to offer the possibility to edit this starting page?
I understand the necessity of creating a play button on mobile devices (which require user interaction) but the fact is that this display is the first contact with the learner, and this is not really attractive (in our user tests, many users were thinking it was a bug).
Intergated in Rise, it's even more awful...
Thank you
- DocFoxCommunity Member
I agree with Aurélien. A great deal of elearning content does not include video or audio and does not need a cumbersome and confusing "Play" button on mobile to allow the user to begin interacting with it. Just consider the interactions already built into Rise or the many content types of H5P (https://h5p.org/content-types-and-applications), most of which can be displayed on mobile devices just fine without requiring a "Play" button to get started. In fact, most of those H5P content types look much better than Storyline blocks when integrated into Rise (but then you lose the built-in tracking you get with Storyline blocks).
- MichaelNorth-1eCommunity Member
Fair point Eric, agree H5P is doing some great things. Hoping that the articulate team can continue to lead the way and possibly address this in a future release.
- MichaelNorth-1eCommunity Member
We have had challenges with this also, especially when the play button launches the iOS video preview which then needs to be closed before user can interact with the course.
Wonder if it would be possible to customise the black screen with an Image? This would create a sort of splash screen.
Hi Aurelien, Eric, and Michael,
As Leslie shared before, the play button was implemented to resolve two issues:
- Chrome/Safari blocking the autoplay of media unless there was a user interaction
- Mobile devices which require user interaction to launch content.
I'll be happy to let the team know that you'd like options to edit how that play button looks! Also, here's a bit more about how we work to prioritize feature requests, and you're always welcome to share those here in E-Learning Heroes or send along to our team as a feature request.
- DocFoxCommunity Member
Right, but those issues really only apply to content that might autoplay (e.g., audio or video).
For example, if I have a drag-and-drop exercise that I create in Storyline, there is no reason at all for mobile users to first click a confusing "Play" button to begin dragging the objects. The dragging itself (or the selection of a multiple choice option or the clicking on a hotspot or...) IS the user interaction. You do not need to create a perfunctory or substitute user interaction (the play button) to indicate the user's willingness to begin the real user interaction.
Storyline should be intelligently detecting the presence of media that might autoplay (e.g., audio and video) at the beginning of Storyline content, and then adding the play button/interface for mobile users only when necessary. Once again, H5P content is a great example of this. Most H5P content types work perfectly across mobile devices and browsers without the need for a play button to launch or activate them.
And it's not just about styling that play button -- it's about displaying it only when it is absolutely necessary. For a great deal of content, it is not necessary (and is, in fact, confusing and cumbersome for the end user).
- MichaelNorth-1eCommunity Member
Thanks Ashley, your clarification was helpful and yes this would be a good feature for mobile users specifically.
- FaizanMumtazCommunity Member
The ability to customize the play button would help immensely. I understand the need for it to exist. Thanks!
- EricFriedman-71Community Member
Wondering if there has been any update on this? I too share the concern and frustration of others on this thread. I am creating a learning object that has not video or audio to play on the first screen and therefore no play button is required. It will be confusing to users. I am going to have to add text above the object explaining that in order to access the learning object, they will need to tap the play button. It's a bit of an embarrassment frankly, which will likely lead to my needing to go with another content creation tool.
Hi Eric,
Thanks for checking in on an update for this. There isn't an option to disable that play button, as that fix was put in play to help with the autoplay issues folks were seeing in browsers such as Chrome, Safari, etc. Even if there is no audio/video on the first slide, having the button ensures there is a learn interaction to allow any other media to autoplay and ensure a seamless flow throughout the course.
We'll certainly let folks here know if anything changes on this setup!
- PhilMayorSuper Hero
I think it only shows play in Rise if there is no media on the first slide, there is no play button if you have no media outside of Rise. But you will need either a next button or someway for the user to click to move slide.
- rachelatkaiserCommunity Member
This worked for me in the latest version of SL (March 3, 2020 3.37.21614.0):
- Search in ds-slides.min for
MobileStartOverlay:function()
. - Find this instance:
MobileStartOverlay:function(){var e=this,t=DS.stringTabler,n=DS.vendorOverrides.feDropShadow ...
- It continues on and on until you reach
return c.createElement
. - Just like Mike's old instructions, add
setTimeout(this.onStart, 1);
just before this so it looks like:
l=o.isUnified,u=s.env.is360;setTimeout(this.onStart, 1);return c.createElement
Hope this helps!
- WesEllisCommunity Member
You are a life saver. Thanks so much for sharing your solution, Rachel!
- KerriBishman-a4Community Member
OMG Rachel. You are incredible!! This totally worked and MADE MY DAY!!!
- Search in ds-slides.min for
- OscarGagliardiCommunity Member
I understand the need for the play button at the beginning of a Storyline module, but on mobile devices why do we need it if the module doesn't have any audio or video on the first slide?
Why you don't give us at least the option to customize the black screen with the play button (that looks more like a mistake). It really looks out of place and not professional. Please make this a priority. Thank you.
Related Content
- 4 months ago