top of page

Storyline Canvas Size

When you are starting a new eLearning project in Storyline, it is always best practice to first take care of several elements that you know won’t change easily or at all. These elements could be:

  • Player style

  • Player buttons

  • Master slides (for content, quizzes and feedback)

  • Slide size

  • Font style

Working on setting the ground for all these at the beginning of an eLearning project will make your life easier and will certainly speed up your process and ensure consistency throughout your eLearning module.

The one element I would like to focus on in this article, is the size of the eLearning slides, given that if you change it later on during the development of the project, could cause some spacing and proportion issues for your content.

The first thing you have to keep in mind when setting the size of the eLearning Storyline template, is the requirements from the client. Usually, in my experience, the client should provide a document or some instructions indicating the preferred size for the modules that are being implementing on their system. For example, the client can indicate a size of 1024 x 768, or 1920 x 1080, depending on the configuration used on their computers.

However, I don’t like to think in terms of pixel sizes, but rather in terms of the aspect ratio.

Why is that?

Especially in Storyline, you will notice that, if you use a size of 1920 x 1080, it will definitely look great with HD quality images, and in general it will give you a lot more of space to place objects on the canvas, but keep in mind that:

  • The eLearning module is usually framed in a browser, decreasing the actual area in which the module is going to be displayed, and

  • Not all the users have a monitor capable of such a resolution

On top of that, if you pay special attention, you will notice that the default buttons on the Storyline player, will decrease its size in relation to the size of the template, when you set the player to fit in the browser’s window.

So to avoid these issues, I always recommend to focus on the aspect ratio rather than the actual size, and in general terms, you can use 2 types of aspect ratios: 4:3 or 16:9.

Examples of 4:3 aspect ratios could be 1024 x 768 pixels or 800 x 600 pixels; and examples of 16:9 aspect ratios could be 1920 x 1080 or 1600 x 900.

Keep in mind to activate the “Scale player to fill browser window” in any case and decide which aspect ratio you want to work with. For example, if you want to give the impression of a 1920 x 1080 template, you can use instead 960 x 540 to keep the 16:9 aspect ratio, and this will avoid the issue of the storyline player buttons being too small to interact with. See the comparison below:

960 x 540 canvas

1920 x 1080 canvas

To learn more about how to program your modules in Storyline, please visit our website at or email us at

Featured Posts
Recent Posts
Search By Tags
Follow Us
  • Facebook Basic Square
  • Twitter Basic Square
  • Google+ Basic Square
bottom of page