One of the new features in Storyline 360 is the addition of Dials. What is a Dial? A Dial lets a user rotate a shape around a mid-point along a range of allowable values. Just like any other objects, you can add a Dial from the Insert menu.

One neat feature that I initially overlooked is ‘Convert to Dial’, which lets you select an object on a slide and turn it into a Dial. Once inserted, the process of formatting and setting Dial parameters is very similar to that of a slider. In fact, I think of a Dial as a special-case slider, the only difference being that the dial ‘track’ is radial and not straight like a regular slider. The Dial Format tab provides options to select different Pointer and Pin styles or completely customize their fill, border and effects.

The Dial Design tab provides parameters that determine how the Dial functions, e.g. the initial and end value of the dial. Again, if you are familiar with Sliders in Storyline 2, you will have no problems working with Dials.

I created a few examples that can be viewed here. For testing purposes I tried to cram as many sliders into each slide as possible. So, be patient, it may take a few secs to load the various slides! Also, with Flash support being phased out in the near future, I published this test project with the new ‘HTML5 with Flash fallback’ option. With that publishing option selected, the HTML5 version will be displayed first, even on desktops with HTML5-compatible browsers that may also have the Flash plugin installed. Since I use a dial for the navigation in my test file, I didn’t enable the Next/Prev player controls. I did however select the new swipe actions for Next and Previous, so that, on a mobile device, I could test support for these gestures. And finally, I selected the new option to force users on mobile devices to view the content in landscape mode. If a user does rotate the device to portrait mode, a message like the one shown below is displayed.

The HTML5 version worked fine on a desktop (Windows7, Chrome 53).  On a Mac laptop with Safari, I noticed some discoloration of custom Pointers, especially in the second example (the map). The HTML5 output worked reasonably well on a mobile device (I tested on a Samsung Galaxy S6 and iPad). In the Flash-only version, the dial that provides the slide navigation is not being displayed at all.

On a small device screen, turning a dial will obviously be challenging, but you can use the new Pinch-to-Zoom gesture to zoom in on an area on the screen.

On iPad, the responsiveness of the Dials was quite sluggish and Safari crashed a few times while pinching. Also, I could not access the second example (the map) as the page did repeatedly reload when swiping right from the slide with the sound mixer.

Working on this project also gave me a chance to publish it to the new Articulate 360 Review site. Once a project has been published to Articulate Review, you can send the link to testers/reviewers. They can then run the project in their browser and comment on any issues. That greatly simplifies the review process, especially when working with remote SMEs or clients. The basic functionality is comparable to the ReviewMyeLearning , a site that’s been around for years and provides a lot more options for the management of review comments.

My dial examples are all rather technical, but that doesn’t mean there are no non-technical use cases. I’m sure that other users will come up with all kinds of ideas for how to integrate dials into their projects.

Here is a tutorial about Dials. Good luck with Storyline 360!

Edit 04/2017: Here is the link to an additional Dial interaction.