Storyboarding eLearning with Twine

As I move into a new role, there is more of a demand to create storyboarding for eLearning courses. I know this is best practise, and I did study it on my Post Grad, but never really implemented it.

The first thing I needed to refresh on was ‘What is a storyboard and why do I need one?’ From the eLearning Coach (http://theelearningcoach.com/elearning_design/storyboards-for-elearning/)

‘A storyboard for eLearning is a document that specifies the visual elements, text elements, audio elements, interactions and branching (where the system or user will go next) of every screen in an online course. Many people also add the learning objectives to the storyboard.’

Pretty simple! Now, what about software to create one? You could use Word or PowerPoint. I found a great template on eLearning Brothers at http://elearningbrothers.com/free-instructional-design-storyboard-template/ but for me, I find PowerPoint a little cumbersome and you need a license for MS Office.

Having a web development background, I wanted a simple web-based solution that can be shared and work anywhere and Open Source if I can. I was pointed to a website called Twinery (http://twinery.org). This site states:

Twine is an open-source tool for telling interactive, nonlinear stories.

You don’t need to write any code to create a simple story with Twine, but you can extend your stories with variables, conditional logic, images, CSS, and JavaScript when you’re ready.

Twine publishes directly to HTML, so you can post your work nearly anywhere. Anything you create with it is completely free to use any way you like, including for commercial purposes.

On first impressions I was impressed. Although it could be said that it’s for simple games, I watched a few videos on YouTube (https://www.youtube.com/results?search_query=Twinery ) and it wasn’t long before I had something meaningful start to appear before me. Below is a screen capture of a simple work flow / story of publishing an article to WordPress. You can also access the exported file to see what it would look like at Adding a WordPress Article

To test your story flow, click on the Play button and follow the links! This is the same output as if you were exporting the file.

You do need to know some basic HTML, CSS and JavaScript to add some additional funky features, but basically there is a simple interface and programming language to make your story flow. One of the awesome things is you don’t need and account and you can export your story as an HTML file to share.

All the code and docs are available at https://twinery.org/wiki/twine_reference so why not check it out, you never know what you’ll come up with!