A 360° image is a panoramic photo that captures a scene from all angles. Use 360° images in Storyline 360 to create immersive learning experiences. Engage learners as they explore every angle with interactive elements, such as markers and hotspots.

Watch the following demo to see how it works.

Public Beta
360° images are currently in public beta for Storyline 360, which means you can use them for production as we continue to enhance them. Install the July 2021 update or later to give them a whirl.

Here’s a sneak peek of what’s to come:

  • Accessibility: Empower all learners to have the same engaging experience with built-in accessibility features for 360° images.
  • Translation: Localize 360° interactions alongside the rest of your course when you export text to XLIFF or Word for translation.
  • Tooltips: Display tooltips when learners hover over markers and hotspots in 360° interactions so learners know what to expect before they click.

If you have feedback, please share it in E-Learning Heroes or submit a feature request—we’d love to hear from you!

Adding 360° Images

It's easy to add 360° images to slides, layers, and slide masters. Go to the Insert tab on the ribbon, click 360° Image [Beta], and browse for a 360° image from your computer. Need panoramic images? Learn how to find them and create your own.

Add a 360 degree image

The 360° image will fill the slide, but you can use its sizing handles to resize it. You can also drag the 360° image to where you want it to display.

360 degree image on a slide

Supported Image Formats

Storyline 360 supports equirectangular panoramas in all standard image formats for creating 360° image interactions. We recommend using JPG for better compression.

For the best results, make sure your 360° image has a 2:1 aspect ratio (i.e., it’s twice as many pixels wide as high) and represents a full 360° field of view (e.g., it has two hemispheres when viewed flat as seen in the example below).

360 degree image example

If your image is larger than 8,000 x 4,000, Storyline 360 will automatically scale it down to fit.

Accessing 360° Image Tools

To format your panoramic image as it appears on the slide, select it and go to the Options tab on the ribbon.

360° image tools tab

Here’s a description of each option.

Edit

Use this option to open the 360° image editor to customize your image with markers, hotspots, and triggers. 

Replace

Use this option to swap out the current 360° image for a different one from your computer. All markers, hotspots, and triggers you applied to the original image transfer to the new image.

You can also use the media library to replace 360° images in your project—or right-click the image in Slide View, then choose Replace 360° Image.

Arrange

Click this drop-down arrow and use the available options to bring the selected object forward or send it backward.

Align

Click the alignment buttons to align images to the slide or to one another.

If only one image is selected, the alignment buttons will align it to the slide.

If more than one image is selected, the alignment buttons will align the images to each other.

If three or more images are selected, you can use the bottom two alignment buttons to distribute the images vertically and horizontally so they're evenly spaced.

If you need to fill the slide with the image, you can use the fill button in the bottom-right corner.

Position

Use the X and Y fields to position images on the slide. Just enter pixel values in the fields or use the spinners to adjust the values.

Size

Use the Width and Height fields to enter specific pixel values for the selected image(s).

Tip: By default, the aspect ratio is locked for pictures, screenshots, and characters. As a result, when you change the height, the width will automatically adjust to maintain the same aspect ratio. If you want to unlock the aspect ratio in order to change the dimensions independently, visit this user guide.

Opening the 360° Image Editor

Use the built-in 360º image editor to add markers, hotspots, and triggers. Here are four ways to open the 360º image editor:

  • Click the Edit 360º Image button on the image.
  • Select the image, then go to the Options tab on the ribbon and click Edit.
  • Right-click the image in Slide View, then choose Edit 360º Image.
  • Right-click the image on the timeline, then choose Edit 360º Image.

Explore the following user guides to learn about markers, hotspots, navigation, and interactivity.

Previewing Your Interaction

Preview the interaction or the entire slide from any tab in the 360º image editor. Just click the Preview drop-down arrow and choose a preview option.

Note: Most content displays during slide preview just like it will when you publish. However, some items are unavailable during interaction preview, such as triggers, transitions, and closed captions.

Saving Changes

To save your changes and return to Slide View, click the top half of the Save & Close button. Or, press Ctrl+Shift+S on your keyboard.

If you want to close the editor without saving your changes, click the Save & Close drop-down arrow and choose Close.

You can also press Ctrl+W on your keyboard to close the 360º image editor and open the prompt to save your changes.

You Might Also Want to Explore:

Adding Markers to 360° Images
Adding Hotspots to 360° Images
Controlling Navigation in 360° Images
Adding Interactivity to 360° Images 
Adding Accessibility to 360° Images
Answering 360° Images FAQs