Try to make a really short Twine story as practice to learn Twine, one of the platforms you could use for your team project this quarter!
Twine is a digital Choose-Your-Own-Adventure story maker. There are a bunch of others, but Twine is probably the easiest to learn. It makes HTML-based interactive text stories. If you want to make something with visuals, you could still use Twine, but there may be other more appropriate tools (which well discuss soon, too, but ask Mark for help if you need!).
- Go to Twine / An open-source tool for telling interactive, nonlinear stories
- (Optional) Follow one or both of these tutorials as much as you can get through:
- View these awesome articles about how choice-based stories are structured and alternatives to Twine:
DO NOT USE SAFARI on a Mac NOR EDGE on Windows! They wont allow you to save or export your Twine project without doing some security finagling in MacOS or Windows.
(either do this individually or with your team – put your names on the project somewhere!)
- Get a theme from this random theme generator OR pick your own topic related to your project.
- Brainstorm a very simple plot with two endings (if you picked a random theme) OR get started with a simple structure for your project idea with some various paths or configurations.
- Make a story with these features (refer to the tutorials above or to the Twine Info section below):
- at least 5 passages,
- one or more variables, using the (set:) command,
- some (if:) statements that display dynamic text dependent on the variables, and
- at least one image.
- After you finish your story, select Publish to File on the bottom left drop-up menu, and save the .html file somewhere. Then drop the file into the Twine Challenge folder in our Google Shared Drive.
- Post in Slack that youve finished with a brief summary of what your story is about!
The super basic things that you want to understand are:
- what a passage is
- Each box of text is called a passage aka room.
- how to write in a passage
- Just double click a box and start typing!
- how to link passages together
- If you put [[double brackets]] around some words in a passage, Twine will automatically create a new box called double brackets and link it.
More advanced things you want to understand are:
- how to display images within a passage
- Twine outputs HTML files so if you know HTML you got this.
- Just insert the HTML tag for an image like so: <img src=URL width=600>
- Replace URL with an image you found online, such as this one https://i.ytimg.com/vi/XCN-tmlxPTE/maxresdefault.jpg
- Set the width to a reasonable amount if you need to.
- how to create and use variables
- Use (set: $variable to 0) to create a variable (named variable) and set its value to 0.
- Then you can, later on, show dynamic text based on the variable value by using a conditional statement.
- (if: $variable is 0)[Show this text](else-if: $variable is 1)[Show this text instead](else:)[Show this text if variable isnt 0 or 1.]
Example use of variables:
- Lets say you have a story with two different paths that lead to the same ending but you want the story to change depending on which path the readers took to get to the ending. You can do this with setting a variable to one or another value and then have the last ending passage detect what that value is.
- Most often, variables are (set:) when you enter a passage for the first time.
- The below example can be found in the test.html file in our Shared Drive! Download it and open it in a browser.
- First, I created an initialization passage and just set some variables to default values. Then I had that go to the actual start of the story. From there, there are two rooms to go into. One of the rooms has a key, the other is actually a hallway with a flashlight. Both lead to a door that is locked. If you have the key, you can open it and end the story. If you dont, you can go back to the start room and try the other path. Meanwhile, you play around with the flashlight at the end, too, which might or might not happen, depending on if you went east the first time.
(set: $key to 0)
(set: $flashlight to 0)
You are in a strange room. Theres a door to the [[west]] and door to the [[east]].
You go through the door on the west and into another room. Hey theres a key here!
(set: $key to 1)
Theres another door at the [[end]] of this room.
You go through the door on the east and into a hallway. Theres a door at the [[end]] of the hallway. Hey, theres a flashlight here!
(set: $flashlight to 1)
You try the door. Its locked!
(if: $key is 1)[But you have a key, and it works! You unlock the door and [[exit]].](else:)[And you dont seem to have a key on you. Bummer.]
(if: $flashlight is 1)[You decide to shine your light around. It doesnt help. I guess you could also go back to the [[beginning->Start]].]
Yay, you got out! (if: $flashlight is 1)[With a flashlight even!]