Twine workshop
-
Upload
charles-palmer -
Category
Education
-
view
172 -
download
0
Transcript of Twine workshop
![Page 1: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/1.jpg)
Interactive StorytellingA Twine Workshop
![Page 2: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/2.jpg)
Presented by: Charles PalmerHarrisburg University of Science and Technology• Associate Professor• Executive Director• Program Lead
Author“Gamification for Performance” 2016Various articles and presentation on using game technologies in education and alternate reality.
![Page 3: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/3.jpg)
Today’s discussionOutline1. Overview of interactive storytelling2. Exploration of examples and concepts3. Building interactive stories4. Train on the using Twine in the
classroom5. Produce and share a short interactive
story6. Wrap-up and final thoughts
![Page 4: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/4.jpg)
Interactive storytelling …1Overview
![Page 5: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/5.jpg)
Interactive storytelling …1a form of digital entertainment in which the storyline is not predetermined
Overview
![Page 6: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/6.jpg)
ComparisonLinear stories• Pre-scripted• Typically delivered on one
platform/medium• Audience has no control• Storyteller has all control• Most common way to consume stories• Most films and books follow this style
Interactive stories• Made up of linear story loops• Multiple ending narratives• Often includes multiple delivery
platforms• Branching paths provide user choice• User is player within the narrative• Users create the narrative through
participation
Modified from Paulina Tervo’s,” Interactive Storytelling” slide deck. Downloaded from SlideShare.net 15 May 2016
![Page 7: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/7.jpg)
Not a new conceptWhat examples of “interactive storytelling” can you think of?
![Page 8: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/8.jpg)
Group work◇ Arrange yourselves into groups of three◇ Review the assigned ARG◇ Answer the following questions:■ Who is the audience■ What is the purpose of the ARG/Sim■ Describe the player activities
http://playgen.com/play/floodsim/1 2 http://www.andrew.cmu.edu/course/53-610/
4 http://timesocietygame.com/3 www.conducttr.com/training/be-inspired/faktion/
15 min
![Page 9: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/9.jpg)
Building Interactive stories …2Define Design Develop Deploy
Exploration
![Page 10: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/10.jpg)
Define Design Develop Deploy
In this phase we identify some of our goals and constraints for the learning exercise.
• Goals: what needs to be achieved• Criteria: what technology, timeframe, and limits are in
place• Scope: what would a success project accomplish
Define phase:
![Page 11: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/11.jpg)
Next, we’ll focus on the learner experience
• Experience: Who is the player, what experience are we constructing
• Story: Where, when, and why will the player undertake these activities
• Interactions: What activities will the player have to complete in order to master the learning goal
• Platform: What technologies are needed to facilitate these activities
Design phase:Define Design Develop Deploy
![Page 12: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/12.jpg)
Define Design Develop Deploy
Now we build the experience
• Plan: Outline a schedule of story beats and activities• Create media assets: Write, collect, record, format and
organize the various elements need to tell the story and promote learner activities
• Implement technologies: Build the frame work to support the learner activities
Develop phase:
![Page 13: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/13.jpg)
Define Design Develop Deploy
Now we prepare and deliver the experience with the audience.
• Finalize: Verify all media assets• Testing: Complete testing and archiving of the user
experience• Launch: Initiate the game• Monitor: Game masters monitor, interact, and manage
the real-time user experience• Close: End the game, update the archives, debrief the
team and remove/demote and live game links
Deploy phase:
![Page 14: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/14.jpg)
A brief recap of the development process
Building interactive stories
Define Design Develop Deploy
![Page 15: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/15.jpg)
Let’s see it in action …3A walkthrough of the development process
Building
![Page 16: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/16.jpg)
Define …Build an experience which let’s 5th graders interpret numerical expressions.
Goals:
Criteria:
Scope:
![Page 17: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/17.jpg)
Define …Build an experience which let’s 5th graders interpret numerical expressions.
Goals: Practice MATH.CONTENT.5.OAA.2
Criteria: Re-playable, individual, fun
Scope: 5 mins, web browser
![Page 18: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/18.jpg)
Design…Build an experience which let’s 5th graders interpret numerical expressions.
Experience:
Story:
Interactions:
Platform:
![Page 19: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/19.jpg)
Design…Build an experience which let’s 5th graders interpret numerical expressions.
Experience: Choose your own adventure style
Story: Kids must use math puzzles to retrieve baseballs from a neighbors yard.
Interactions: Select answers from given choices
Platform: Twine
![Page 20: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/20.jpg)
Design story components …Build an experience which let’s 5th graders interpret numerical expressions.
Setting: a neighbor’s backyard areaPlot: retrieve baseballs from neighbor’s yardGoal: practice the order of operation for mathematical equations Characters:
Friend(s): Brett, Madison, SamVillain(s): Mr. HarperOthers: none
![Page 21: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/21.jpg)
Develop…Build an experience which let’s 5th graders interpret numerical expressions.
Plan: Outline branching story
Create media assets:
Implement technology:
![Page 22: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/22.jpg)
Outline branching story
Introduction Reveal goal Identify challenge Try solution
Get help
Success Resolution
Failure
![Page 23: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/23.jpg)
Develop…Build an experience which let’s 5th graders interpret numerical expressions.
Plan: Outline branching story
Create media assets: Write story and identify images
Implement technology: Build Twine story
![Page 24: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/24.jpg)
Let see the finished story
![Page 25: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/25.jpg)
Deploy…Build an experience which let’s 5th graders interpret numerical expressions.
Final production: Refine story, clues, passages, and resolution
Testing: - - -
Launch: - - -
Close: - - -
![Page 26: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/26.jpg)
Hey, since we’re here, let’s make something.4
Train
![Page 27: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/27.jpg)
Place your screenshot here
Our development tool…Twine is an open-source tool for telling interactive, nonlinear stories.
http://bit.ly/cellcitygame
![Page 28: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/28.jpg)
How it worksWe’re going to start by building a short linear story.
Passage Passage Passage
![Page 29: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/29.jpg)
Branching choicesWe can also provide options for the player
Passage Passage Passage
Passage
![Page 30: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/30.jpg)
Twine instructionsLinksCreate links between passages using [[text]] or [[text|name]].
MacrosMacros are short commands used by twine to effect your story. The macros are pieces of code implemented when the macro is called; i.e., the (set:) macro is used to assign values.
StylingText formatting can be done within each passage using styles. Visit https://twine2.neocities.org/ for a complete list of commands.
VariablesStore values in variables which can be modified, displayed, and acted upon. Use the set command to do this; (set: $bugs to 5)
ConditionalsUse variable values to determine what happens next. Here is an example (if: $legs is 8)[You're a spider!]
RandomizationUse random and either to create unique experiences.Assign a random value by using (random: 1,6) or randomly select a value from a group (either: "slimy", "goopy", "slippery")
http://bit.ly/twine_manual
![Page 31: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/31.jpg)
Some advanced tricksPopupsTry this (alert:"Hello World") to have a message presented to the user. Look up confirm: and prompt: for added functionality.
clickThis command can be used to create your own macros. Try this; There is a small dish. (click: "dish")[Your finger gets wet.]
http://bit.ly/twine_manual
Removing navigationEdit the .redo and .undo classes in the Story Stylesheet to remove the navigation buttons..redo, .undo { display: none; }
Setting the backgroundUse the body selector in the Story Stylesheet to set the background of all passages.body {background: url("http://previewcf.turbosquid.com/Preview/2014/08/01__22_25_34/410_tile_Sky.jpge9d882c2-4435-4898-99f2-31979d851eb1Large.jpg")}
A twine tutorialCheck out VegetarianZombie’s incredible tutorial series on YouTube. http://bit.ly/twine_tutorial
![Page 32: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/32.jpg)
Deploy your storyhttp://philome.la/ is a free hosting service for your Twine stories. (This tool requires an active twitter account)
http://bit.ly/twine_manual
![Page 33: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/33.jpg)
Group work
5Find a partner who teaches the same subject, grade
year, or has a similar administrative role as you.Together, you will be a short interactive story for your
students.Start by choose a learning goal/objective.Next use the “Interactive Story Worksheet” to plan out
your experience.Finally, build the activity in Twine.
Produce
Deploy and share your URL with the group.
![Page 34: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/34.jpg)
Thanks for playing
6• For more information on Twine visit -
http://bit.ly/twine_tutorial• To learn more about building interactive
stories, check out my recently released book “Alternate Reality Games: Gamification for Performance”
Charles PalmerHarrisburg University of Science & [email protected]/in/charleslpalmer/http://www.slideshare.net/charlespalmerhu
Wrap-up
![Page 35: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/35.jpg)
Thanks!• For more information on Twine visit - http://bit.ly/twine_tutorial• To learn more about building interactive stories, check out my
recently released book “Alternate Reality Games: Gamification for Performance”
Charles PalmerHarrisburg University of Science & [email protected]/in/charleslpalmer/http://www.slideshare.net/charlespalmerhu
http://bit.ly/GfP-AMZN
![Page 36: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/36.jpg)
CreditsSpecial thanks to all the people who made and released these awesome resources for free:
◇ Presentation template by SlidesCarnival◇ Photographs by Unsplash
![Page 37: Twine workshop](https://reader031.fdocument.pub/reader031/viewer/2022011722/58ecd3051a28ab48098b4681/html5/thumbnails/37.jpg)