Advanced Slider Techniques – Interactive Infographic

Information graphics, or “Infographics” for short, are quick and easy ways of presenting information in a more graphical format. They’re all the rage these days, and animating them can raise the bar to a whole new level of coolness!

But in the field of e-learning, where interactivity is massively important to the learning experience, how can we make infographics more interactive? And additionally, with the demise of Flash looming on the horizon, how can we accomplish this without its use?

I’ve mentioned Sliders on a previous blog, using values to control the appearance of layers. But here’s some neat things that weren’t shared in previous blogs. Did you also know multiple sliders can share the same value? Did you know that slider thumbs can be customized to pictures?

With these two thoughts in mind, I had a stab at creating a drag-to-reveal, interactive infographic. Don’t be fooled! There are two Sliders in this example. Do you know where the other one is?

Click the link below to view my presentation:

Click Here