Laura Gibbs

You really CAN play Twine games in Canvas: Step by Step

Blog Post created by Laura Gibbs on Sep 23, 2018

This morning I wrote up a bunch of Tech Tips for my students about using Twine to create interactive, non-linear stories that they could publish in their blog posts or webpages... and then of course I got curious about whether it would work in Canvas. And glory hallelujah, Twine works PERFECTLY in Canvas. So, I thought I would write up a quick step-by-step guide. To get a sense of the result, here's a story I wrote earlier this semester: The Mouse-Bride (for notes about that story, see where I included it in my class project here: Chain Tales Portfolio).


THE MOUSE-BRIDE: Choose-Your-Own-Adventure in Canvas


screenshot of twine game in canvas


Here's a step by step of how to get started with Twine and then publish your Twine file in Canvas:


1. Create a simple story. I've got a step by step guide here for my students. You can find lots more information about creating Twine stories at the site.


2. Download the HTML file. In the lower right-hand corner of the Twine editing screen, there is an up-arrow that pops open a menu. Choose "Publish to File".


3. Upload HTML to Files in Canvas. Now just upload the file to the Files are in Canvas. Honestly, that's all you have to do! Your Twine game is right there, ready to play!


4. Embed the File. If you want to give the game some context, though, you should take one more step and embed the File in a Canvas Page. To do that, you just need this iframe snippet:


<iframe src="https://___/courses/___/files/___/download" width="100%" height="600"></iframe>


Fill in the blanks with your Canvas domain, course number, and file number, and adjust the width and height if you want. Create your Page, and then just type TWINE where you want to embed the file; switch to the HTML editor, and replace where you typed the word TWINE with the iframe snippet. You're done!


So........... go wild, people! You could have your students build their own stories, or you could do that collaboratively, working with post-it notes on the wall, and then transferring that to a Twine file.


I had so much fun building my Mouse-Bride story. Here's a screenshot of my Twine editing board; this is the most complex story I have ever done. :-)


twine storytelling board


Happy storytelling........!!!