Tutorial: How To Twine

Twine is an online platform for producing interactive storytelling; it can be used to write build your own adventure stories, create presentations, produce fiction, and even make video games. In this tutorial you will learn how to start your story, link your individual pages, and publish your finished product.

1. Download Twine

Access their website http://twinery.org. You will be given the option to either download their 2.0.11 version or use their online program. Tip: for online use make sure not to delete/clear your browser history otherwise you will lose all of your work (Twine saves to browser). Once you’ve chosen how you will use this program you should see this on your window:

This is the page that you can start new stories, and find your previously saved stories. Click “Story+” to begin a new story. It’ll ask you to give your story a title; so let’s call this “First Twine”. The next page you should see is:

2. Start Writing!

Double click the white box that says “United Passage”, it should bring you to a page like this:

Once you’ve completed everything you’d like to be on this ^^ singular storysheet, it’s time to move on to the next page!

3. Creating/Linking More Passages

When you’re finished with your ‘First Slide’, and would like to create a new passage, you’d need to go to the bottom right corner of the story grid and click “+ passage

Let’s name this passage ‘Second Slide’. Once you’re done editing and writing in this passage you’re going to want to link it to your first passage, so when playing your story it follows your personalized order. The way you link one passage to the other is by typing in the story sheet (where you write your passage content), “[[sentence you’d like to link->name of passage you’d like to link to]]“. So in regards to my story, say I’d like to link my second slide to my first slide I’d write:

And this is how it would look:

So any time you press “play” it would start with the first slide and then move onto the second passage you have linked.

For those of you who are creating, choose your own adventure stories the way you would link multiple passages into one slide is by giving your players “decision” sentences in link format:

[[Choose to go home and spend the night alone.->Second Passage]]

[[Or choose to have a night out with the stranger from the cafe.-> Third Passage]]

4. Publishing Your Story

While publishing your story may not seem like the most difficult of tasks, on twine it can be a little tricky. If you do not have your own website you can’t just publish. The best alternative for those without websites, is to post to philome.la. Go to the bottom lefthand side of your story grid and click on your title.  Choose Publish to File. Upon clicking publish it should bring you to a page with a LOT of code

Don’t get overwhelmed! Go to File -> ‘Save As’. First name your story. At the bottom of the window you should see:

It’ll automatically save as a Web Archive if you don’t change the format rendering the file useless. Select Page Source.

Once you’ve saved the file to your computer you need to open it in an application called ‘Text Edit’.

Once opened in ‘Text Edit’ click on the title at the top of the window:

The title will be locked so you have to unselect the Locked option to edit. At the end of your title you need to add the tag “.html” in order for the file to be compatible with philome.la *If you save/use the Google Chrome Browser, it will automatically save to your desktop as an .html file*. For those of you using PC’s when selecting File -> Save As you will have the option in the form of a drop down box, to select what format you’d like to save your file in; choose HTML. Once on the website you will see this page:

Login to your Twitter, drop your .html file in the highlighted box, name your game, and publish! If you do not have a twitter, you can email your file to the DigLibArts email (DLAstutech@gmail.com), and we will post it for you!

5. Resources

  • On the Whittier College Dig Lib Art’s website there is a page solely dedicated to breaking down the art of Twine: Teaching Repository
  • A more in depth break down of all the steps can be found in the Twine Wiki