Breaking With Tradition: Reading The Modern World
Twine Workshop
To Do This Week
- Play: Neon Grey, https://neongrey.itch.io/pet-that-cat
- Do: Twine Workshop
- Discuss: Complete the workshop
Overview
We have looked at the distinction between games and interactive stories, the mechanics of how they work, and some of the theory behind the genre known as “interactive fiction.” Now we are going to make our own. This project will last for the rest of the semester.
This week, you will learn the fundamentals of how to code stories in Twine (it’s easy), which is the interactive platform that has been used to build most of the games/stories we have read in this section of the class. Next week, you will start making a game based on a work, topic, or theme from the readings we have done so far. Then, you will have more time to finish. All you have to do this week is start learning Twine and post in the Discussion Forum.
This is sort of the culmination of the work you began in writing fanfiction and annotating a comic. I think that, as time goes on, there are more and more ways that people interact with stories and literature, and this class has been exploring ways that readers can be writers too.
What is Twine?
Twine is a free platform that consists mostly of hyperlinks, which are those links in the games that have taken you through the stories. In Twine, you write text in a box called a Passage (see tutorial below) and you include Links to new Passages. You can set Statistics, which you can later Test, but at its fundamental level, Twine is simply offering the reader a story with choices.
You will have to code this, but the coding is easy, and you will spend this week learning the basics.
First of all, download Twine here:
http://twinery.org/ (see the note on the right for “Download Twine 2.31”)
Here is a tutorial that will walk you through what you see when you are setting up Twine:
https://twinery.org/wiki/twine2:how_to_create_your_first_story
A quick note from the start: You can play twine on a phone or tablet, but you will need a desktop or laptop to write with it. For the tutorial, you can use the online version, but I would recommend you downloading Twine. I am including a cheat sheet from the JJ library that has instructions for saving and using the online version, but it is more complicated than just doing it on your computer (although it would work if, for example, you were just using JJ computers and you can save files to a flash drive).
Also, a quick note: Twine comes in several different versions: Harlowe, SugarCube, Snowman. You should use Harlowe and, if you are searching online for help, search for answers in that version.
The game this week: Pet That Cat does a lot of the things we will be talking about in a clear, straightforward way. It’s a successful bare-bones Twine with not a lot going on behind the scenes, although, when we are done, I hope you will be able to easily guess at the code behind it.
The Basics
If you have Twine on your computer, open it and select the button that says “+Story” You can title it whatever you want.
Doubleclick on the first Passage (It will be called “Untitled Passage”). This is your game’s starting point. Go ahead and retitle it “Start”
Now, you can start writing immediately. Let’s say you want to give the reader a room with two doors and make them choose between the doors.
Since Twine is a game of Passages connected by Links, you need to connect the Start passage to two new Passages representing the room behind each door.
The code to Create a passage in Twine is easy, you simply put two brackets around a word: [[ ]]
à So, type “You are in a room with two doors. Do you want to go in the [[left door that smells like moldy cheese]] or the [[right door that smells like flowers]]”
à Next, click on the X at the top right to close the passage and look at what happened. You’ve just created two new passages. Their titles are exactly the same as the text of your choices.
Twine is very open. There are multiple ways to do this very same thing. Let’s try a couple of other ways.
Changing an Existing Link
- Go back to your Start passage. You are going to change the text to forget about right and left. Edit your text so that it says, “You are in a room with two doors. Do you want to go in the [[door that smells like moldy cheese]] or the [[door that smells like flowers]]”
- Now, close this window and notice the difference: there are two new passages but the old ones are still there.
- The old passages are clutter, so let’s delete them. Hover over them and click the trash can.
Changing the title of where a link goes to
You can have the reader see the text of a Link but direct them elsewhere. This can come in handy at times. I don’t like moldy cheese, so let’s open the Passage for “door that smells like flowers.”
We want to give the reader a choice that might lead them back to where they started. Here’s how to do that:
- Give the reader a choice: “Now you see a ladder going [[up]] and [[down|Start]]. One leads to treasure and the other takes you back to the beginning.”
- Close it out and look at what’s changed. This time, only one new Passage popped up because the other has an arrow going back to Start. By putting a | between the display text (“down”) and the Passage title (“Start”), you hid the real destination of the link.
- Now, doubleclick on the “up” Passage and write, “You found a bunch of treasure!” Who doesn’t want treasure?
Now, you can hover over the “Start” variable and click the Play button to play the game.
Two really important notes:
à Capitalization matters. If you write that last choice as [[down|start]], it will create a whole new passage called “start” since it cannot tell that “Start” and “start” are the same thing.
à Spacing matters. If you write [[down| Start]], it will create a new passage for the same reason
Making it Multiple Choicey
Like Pet that Cat, you can also do the very same thing that we did before but make it more like a multiple choice test (like Choice of Dragons). If you want it to look like this, you first passage can be:
“You are in a room with two doors. Which do you want to open?
The [[left door that smells like moldy cheese]]
The [[right door that smells like flowers]]”
It doesn’t really matter how you do it. They will all get you to the same place.
Finally, your game as it stands should look like this:
If you want to look over any of this from another tutorial, here is a basic summary of how links work: https://twinery.org/wiki/twine2:how_to_create_links
*You should now have gotten the basics of how Twine operates. You should be able to make a rough Choose Your Own Adventure-style game if you want.
Variables
Take a deep breath. We’re going to get more complicated by adding variables. One of the fun things about Twine is that it is very open and customizable. You can make it do almost whatever you want. The way to do that is because of Variables and Macros (code snippets that test Variables).
There are three types of variables,
- Boolean (aka True/False)
- Numerical (i.e. 1, 2, 3), or
- Text (i.e. “valerian steel” “gemstones” “dragon glass”)
I’ll start with Boolean. They are all slightly different, but they work the same way. We are only going to tackle the Booleans today, because that is enough, but we will pick up with the others next week.
Boolean
- Go back to Start.
- At the bottom, type in (set: $map to false). This will create the variable ($map) and set it to its initial value of “false,” meaning the reader does not have the map when they start the game
- Go to the moldy cheese room’s Passage and type in:
“You found a map in all that gross, moldy cheese!
(set: $map to true)
You find a secret door leading to [[another room|door that smells like flowers]]
Awesome. You have created a pathway so that the player can get a map. Now we are going to test that value with more specific code.
- Go to the “door that smells like flowers” passage.
- At the bottom, type in (if: $map is true)[Your map tells you to choose [[up]]!]
- Close it, go back to Start and play it, this time avoiding the map. Everyone should be like it was before.
- Go back to Start and play it but go in the moldy cheese room first in order to get the map. This time, the text you wrote for the map shows you the right way to the treaasure!
If that code looks complicated, let’s break it down:
- (if: tells Twine to test what is inside the parentheses to see if it matches certain conditions.
- $map is the name of the variable that you set in the moldy cheese room. This is what is being tested.
- is standard coding language.
- true) finishes the code snippet by testing to make sure that $map has been set to true. If you haven’t gone in the moldy cheese room, $map will still be false and nothing will happen.
“[Your map tells you to choose [[up]]!]” is more intricate.
- When you’ve tested for a variable, you want to allow for a consequence if the test meets those conditions. To tell Twine to do that, you need to enclose the following text or code in a pair of brackets, as I did above, with a “[“ before the Your and a “]” after the “!”. It does not matter what you type after you have tested for $map, or how many lines you type, there is always a bracket at the end.
- This can look odd. For example, if I was not enthusiastic enough, I could have not done an exclamation point and it would have looked like [Your map tells you to choose [[up]]] with three brackets at the end.
- You can also “nest” things inside those brackets by putting another choice in there. So, if you’re feeling lucky, you can change this to
- (if: $map is true)[Your map tells you to choose [[up]] but maybe you just want to go [[home|]]?]
Note
As above, punctuation and spacing matter. If you type (if: $mapp is true), (if $map is true), (if: $map is true), you will get an error.
So your game might now look like this:
If you want to review this from another tutorial, or you are burning to learn about the other types of variables, check this out:
https://damonwakes.wordpress.com/2018/01/24/twine-for-beginners-using-variables/
This Week: Discussion
I think we’ve all had enough moldy cheese and maps. Close that Story and I want you to experiment by making a new one about whatever you want. It should have at least 2-3 choices and at least 1 variable.
When you have done this tutorial and made your own game, please post about your experience. Did it work fine? Were you surprised by anything you did? Frustrated? What would you like to do next?
And, please comment on someone else’s post. Did their experience mirror yours in any way? Can you offer any advice or suggestions?
Problems?
I always come across weird problems when I am working in twine, so, if you are confused, want to learn how to do something new, or are encountering a problem, I would suggest that you:
- Simple google your issue (i.e. google “can’t set variable twine Harlowe” will give you some forum posts)
- More specifically, search in this forum: https://twinery.org/forum/
- Post in the Q&A Forum. Someone from the class (or me) can probably help.
- If none of those work, feel free to email me.
