How to Create an HTML Slideshow with Adobe InDesign

There are multiple ways to create a slideshow using InDesign. Let’s go through the options and how to export your content to HTML.

We’ll cover the following slideshow options:

• Multi-State Objects with Button Navigation
• Autoplaying Slideshow using the Animation Panel
• Easy Slideshows using the in5 Slideshow and Image Sequence Widgets
• Using in5’s Slideshow Builder to make life crazy easy
• in5’s Presentation Mode

There are two main ways to create HTML from InDesign: Publish Online, which is built into InDesign; and in5, which is a paid add-on made by Ajar Productions. You can see a comparison of Publish Online and in5 in this post.

Creating an Interactive Slideshow with Object States

You can create a Multi-State Object (MSO) using InDesign’s Object States panel, found under Window > Interactive.

When you create Object States, you’ve effectively created different visual versions of your content.

Each one of these states can act as a slide in your slideshow.

The nice thing is that you can control these states with InDesign’s button actions…the downside is that you can’t easily transition between states with animation when exporting to Publish Online (though you can do it using in5’s Slideshow Widget, see more below).

Animating Between Objects to Create Slide Transitions

You can use InDesign’s Animation and Timing panels to take a stack of photos and animation them from hidden to visible one-at-a-time, showing the top photo last. Each new photo effectively hides the one behind it as it fades in.

This option is a little messy to set up, but it can be exported to Publish Online. in5’s Image Sequence and Slideshow Widgets provide a much easier way to do this (see more below).

Easy Slideshows using the in5 Slideshow and Image Sequence Widgets

The in5 Slideshow Widget (in5 > Interactive Widgets > Slideshow) can take any MSO in your document and turn it into a slideshow with animated transitions.

All you have to do is select the relevant options in the panel and export with in5.

Using this option, you can still have complex and interactive content within your Object States.

If you want a simple image slideshow, using the Image Sequence Widget (in5 > Interactive Widgets > Image Sequence) is even easier.

For an image sequence, you can simply select a folder filled with images and in5 will turn it into a self-running slideshow for you.

Using in5’s Slideshow Builder to make life crazy easy

If you want to build a slideshow the fastest and easiest way possible—be it interactive or animated—and you have an in5 Pro plan or higher, you can simply run the Slideshow builder…which will create thumbnails, navigation buttons, and animated transitions for you.

See it in action in the video below.

in5’s Presentation Mode

If you want to get really sophisticated with your slides using InDesign pages, then in5 can turn your entire document into an HTML slideshow using Presentation Mode with the autoplay feature. You can learn more about in5’s Presentation Mode in this post and see an example of a self-running slideshow in this post.