Step by Step – Show, Explain and Guide Your Visitors

You might have encountered interactive demos created with screencasting and screengrabbing software (e.g. Amberjack, Demofuse or Jing) that explain an interface to users in a step-by-step manner. This is exactly what this script does for web sites. When you loaded this page and all went well you’ll have seen the examples, download and first paragraph section being highlighted and a small panel with information showing up in succession. This is done with this script.

Step by Step uses the Yahoo User Interface library, and pulls in most of its dependencies automatically. So, what you need to do is write a JSON object and either embed it in a script tag or link to it as an external file.

Requirements: Yahoo User Interface library, JSON
Demo: http://icant.co.uk/sandbox/stepbystep/
License: Creative Commons 3.0 License