Storyline 2: How to Determine the Optimal Slide Size for Mobile Devices
Article Last Updated
This article applies to:
Optimizing your slide size for mobile devices depends on a number of factors, including:
- Whether you publish for Articulate Mobile Player (AMP), HTML5, or both
- The player features you add to your content
- The aspect ratio of learners' mobile devices
If you plan to include AMP output when you publish, use the AMP sizing guidelines below—even if you also publish for HTML5. On the other hand, if you'll only be distributing HTML5 output, jump to the HTML5 sizing guidelines.
Optimizing Content for Articulate Mobile Player
The AMP app is locked at a 4:3 aspect ratio on mobile devices. As a result, it won't completely fill a widescreen device. To optimize your content to fill the app, use the following guidelines to calculate the optimal width and height, based on the player features you plan to include in your course, then use those numbers to set your slide size in Articulate Storyline.
| No player features | 968 pixels wide x 668 pixels high |
| Sidebar | Subtract 200 pixels from slide width |
| Player tabs | Subtract 8 pixels from slide height |
| Seekbar and/or navigation buttons | Subtract 48 pixels from slide height |
Optimizing Content for HTML5
Storyline's HTML5 output is supported on a variety of mobile devices. Specifically, Apple devices running iOS 7 or later, and Android devices running Android OS 4.1 or later.
With so many mobile devices to choose from, it can be daunting to choose the best size for your course. Not to worry. Just use the interactive calculator below to determine the optimal slide size. Here's how:
- First, select an aspect ratio from the drop-down list for the most common mobile device your learners will be using. If you're not sure which devices they're using, we recommend using 4:3. Here are some popular devices and their aspect ratios. If your device isn't listed, check the manufacturer's technical specifications.
16:10 16:9 4:3 3:2 Galaxy Note Tablets Galaxy Note Phones iPad (all models) iPhone 4, 4S Galaxy Tab iPhone 5, 5C, 5S iPad Mini (all models) Surface 3 Nexus 4, 7, 10 iPhone 6, 6 Plus Moto X Nexus 5 Surface 1, 2 - On the right side of the calculator, choose the player features you plan to include in your course. The slide size will change based on your selections. (Learn how player features affect course dimensions.) If you don't need to add any player features, just skip to the next step.
- Use the calculated width and height to set your slide size in Storyline.
- The calculator is optimized for landscape mode on mobile devices.
- The calculated sizes accommodate the standard address/tab bar across the top of the browser. If learners customize their mobile browsers with bookmark bars or other navigation features that reduce the useable screen area, Storyline will automatically scale your course to fit.
- You can use different measurements than those recommended by the calculator as long as you maintain the same aspect ratio. For example: If the calculator determines your optimal slide size is 1000 x 500, you can use 1500 x 750, 500 x 250, etc.