Sliding Image Gallery

This sample was built in response to two Articulate Storyline E-Learning Heroes Challenges: #176 (Using Small Words to Explain How Complex Things Work) and #84 (Using Image Sliders and Photo Galleries in Online Courses). Challenge #176 challenged designers to create an example (static or interactive) that explains a complex subject using only simple graphics and the 1,000 most-used words in the English language while Challenge #84 was to show and share an image slider for e-learning using the style or layout of our choice.

Description

In designing for the challenge of using small words to explain complex things, I wanted to do something more than the traditional clicking to reveal information. To make the presentation more interesting, I decided to integrate the image slider challenge into the product. The slider features a highlight of the selected photo and an enlarged version of that selection to accompany the text.

Challenge #176 restricted the words I could use so I chose a topic that was on the list and that I was familiar with – my cat. I used photographs from my cat’s Instagram and information that I learned while training her to be an adventure cat. The limitation of only using the 1000 most common words as outlined in the challenge determined the description that I used to accompany each photo. It was difficult to find phrasing that worked and I was unable to say everything I wanted, but the end result is simple and clear.

Demo

Click the image below to view the interaction. The link will open in a new window. Due to legacy compatibility issues with the software that originally created this demo (Storyline 2), this may not work in Google Chrome.