Today I’d like to talk about size—the size of the project slides as well as the size of the finished display. There are times that a project simply needs a certain size or is best displayed in a certain way. So it’s your job, as the designer, to make your project shine within these parameters.

Articulate Storyline has several options that help you work within size constraints. To save you critical development time, here are three easy ways to manage size in your Storyline project:

1. Set the Story Size

When starting a project in Storyline, it automatically defaults to 720 x 540 pixels, which means a 4:3 aspect ratio. If you’d like to change the size or the aspect ratio, go to the Design tab and select Story Size.

When the Change Story Size window appears, you can either choose an option from the Story Size selector, or you can enter your preferred width and height. Note that by checking the Lock aspect ratio box you can keep the current proportions.

Keep in mind that the player will add width and height, so your published output will be a little larger than the story size you select here.

2. Adjust Size as You Go

Even if you’re knee-deep into your project when you realize the size needs to be changed, you can still set the size as above. Then, Storyline will ask you what to do with the slides you’ve already created:

  • If new size is larger: You can decide to Scale To Fit or Fill Background
  • If new size is smaller: You can Scale To Fit or Crop

In a perfect world, of course we’d try not to change our project size midstream, as oftentimes doing so means we have to resize or rearrange objects in the new dimensions. But things happen, and this feature helps you manage those incidents and make the best of it.

3. Define the Player and Browser Size

With your pixel size and aspect ratio set, you can also select how your project will be displayed in the browser window.

Click on the Home tab, select Player, and open the Player Properties menu.

Select Other to get the browser and player size options:

For the browser, you can choose between Display at user’s current browser size (leaving the size as the user currently has it set), Resize browser to optimal size (depending on your project size), or Resize browser to fill screen.

I usually leave the settings on Display at user’s current browser size, which is the default setting, assuming that the user has already chosen the best size for their display. But the other two options are handy if the course opens in a new browser window and you want to make sure that the window has the exact size of the player or plays in full screen.

For the player, you can choose between Scale player to fill browser window and Lock player at optimal size, which is bound to your project size.

It seems like the Scale player to fill browser window option is the most frequently used. However, if you have very small images in your course, be aware that they may not display crisply in a full-screen mode due to missing image resolution.

With these options, managing size in Storyline is a cinch! Do you have experience working with the size settings in Storyline? Leave a comment below to tell us which settings you use the most, or any tips you have about working with project size.

Want to try something you learned here, but don’t have Articulate software? Download a free 30-day trial, and come back to E-learning Heroes regularly for more helpful advice on everything related to e-learning.

Julie Since
Darin Fennell
Darin Fennell
Dan Roddy