How to create a chromeless player for your eLearning courses

Articulate Storyline developers will know that the ‘player’ in Storyline is the shell our eLearning course sits in. However, if you’re new to Storyline development, you might be wondering what on earth a ‘player’ is. Simply put, the player holds your navigation features, including your menu, resources, glossary, previous and next buttons and much more.

However, there are occasions that you might want to hide this player to give your eLearning a chromeless look. Thankfully Articulate have built this feature in with the modern player in Articulate Storyline 360 – by quickly switching off all features in the menus and control section of your Storyline ribbon.

But for developers who have not yet upgraded to Articulate Storyline 360 and are still developing beautiful eLearning on Storyline 3 (or even 2!) there are some simple steps that you can take to give your eLearning a chromeless look.

Step 1: Turn off the player features

We start by turning off all of the player features (this includes our glossary, resources etc.)

1. Go to the ‘home’ tab in your Storyline ribbon and click ‘player’
2. In the ‘player properties’ window, scroll through the list and untick all items (i.e. Menu, glossary etc.)

This will leave you with a simple outline around your slide content

Step 2: Make the player border transparent

Next, we need to change the colour scheme settings for the player to make it transparent:

1. White you’re in the ‘player properties’ window, click ‘colors and effects’ on the ribbon
2. Click the link to ‘show advanced color edting’ which is under the ‘color scheme’ drop down box.
3. Use the ‘edit item’ drop down menu to edit the following:
   1. Base – Main background – set the transparency to 100%
   2. Base – Main border – set the transparency to 100%
   3. Base – Slide background – set the transparency to 100%
4. Your player will now be invisible.

Step 3: Save your chromeless player for other courses

Saving these settings means you can use them in any other course you develop. To do this you need to:

1. While you are in the ‘player properties’ window, click ‘current player’ and select ‘save as’
   
2. Give the player a recognisable name, for example ‘Chromeless player’ and click ‘OK’
3. Click ‘OK’ again to close the ‘player properties’ window

Step 4: Remove the previous, next and submit buttons

Any new slides you add to your course will automatically have navigation buttons. You will need to disable these to make your player completely invisible.

1. Go to Story View in your Storyline file. Press Ctrl + A twice to select all of the slides in your course
2. In the ‘slide properties’ panel, until the previous, next and submit boxes and double check all of the other player features are also unticked.

So, there you go, four simple steps to create a chromeless player, if you aren’t lucky enough to be using   Articulate 360  just yet!

—

Articulate 360 truly simplifies the eLearning content development process, from start to finish. If you want to get to know Articulate 360, join our   upcoming webinar : ‘An introduction to Articulate 360’.