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).
Here's a step by step of how to get started with Twine and then publish your Twine file in Canvas:
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. :-)