Introduction to Twine 2.6/Twine 2.8 [Videos]
(July 2023 – Ongoing)

Twine 2.6/Twine 2.8

• Twine 2.6: General: A Gentle Introduction to Twine
• Twine 2.6: General: Tour of User Interface
• Twine 2.6: General: What is Twee?

Harlowe 3.3

• Twine 2.6: Harlowe 3.3: Introduction: Introduction to the Default Story Format
• Twine 2.6: Harlowe 3.3: Introduction: Creating Links
• Twine 2.6: Harlowe 3.3: Introduction: Common Text Styling Approaches for Interactions
• Twine 2.6: Harlowe 3.3: Introduction: Example: Branching Dialogue
• Twine 2.6: Harlowe 3.3: Introduction: Alignment
• Twine 2.8: Harlowe 3.3: Introduction: Columns
• Twine 2.6: Harlowe 3.3: Introduction: Bulleted and Numbered Lists
• Twine 2.8: Harlowe 3.3: Introduction: Headings and Horizontal Rule
• Twine 2.8: Harlowe 3.3: Introduction: Using HTML

Harlowe 3.3: Macros

• Twine 2.6: Harlowe 3.3: Macros: Creating, Accessing, and Comparing Variables Using Macros
• Twine 2.6: Harlowe 3.3: Macros: Example: Keys and Doors
• Twine 2.6: Harlowe 3.3: Macros: Working with Hooks
• Twine 2.6: Harlowe 3.3: Macros: Example: Revisiting Keys and Doors
• Twine 2.6: Harlowe 3.3: Macros: Understanding Whitespace
• Twine 2.6: Harlowe 3.3: Macros: Including One Passage in Another
• Twine 2.6: Harlowe 3.3: Macros: Example: Updating Character Statistics
• Twine 2.6: Harlowe 3.3: Macros: Adding Randomness to Stories
• Twine 2.6: Harlowe 3.3: Macros: Example: Solo RPG
• Twine 2.6: Harlowe 3.3: Macros: Forced Passage Transitions
• Twine 2.6: Harlowe 3.3: Macros: Example: Revisiting Updating Character Statistics

Harlowe 3.3: Macros: Input and Using Data

• Twine 2.8: Harlowe 3.3: Macros: Text Input
• Twine 2.8: Harlowe 3.3: Macros: Example: Entering Passwords
• Twine 2.8: Harlowe 3.3: Macros: Forced Input
• Twine 2.8: Harlowe 3.3: Macros: Example: Ghost Input
• Twine 2.8: Harlowe 3.3: Macros: Dropdown and Checkbox
• Twine 2.8: Harlowe 3.3: Example: Ordering Food
• Twine 2.8: Harlowe 3.3: Macros: Cycling and Sequence Links
• Twine 2.8: Harlowe 3.3: Macros: Example: Choosing Equipment
• Twine 2.8: Harlowe 3.3: Macros: Box
• Twine 2.8: Harlowe 3.3: Macros: Float Box
• Twine 2.8: Harlowe 3.3: Macros: Example: Health and Mana
• Twine 2.8: Harlowe 3.3: Macros: 2bind
• Twine 2.8: Harlowe 3.3: Macros: Bound Interactions
• Twine 2.8: Harlowe 3.3: Macros: Meters
• Twine 2.8: Harlowe 3.3: Macros: Example: Health Meter
• Twine 2.8: Harlowe 3.3: Macros: Button
• Twine 2.8: Harlowe 3.3: Macros: Example: Updating Food Orders

Harlowe 3.3: Macros: Changers

• Twine 2.8: Harlowe 3.3: Changers: Text Styles, Colors, and Size
• Twine 2.8: Harlowe 3.3: Changers: Example: Repeating Styles
• Twine 2.8: Harlowe 3.3: Changers: Named Hooks and Change
• Twine 2.8: Harlowe 3.3: Changers: Example: Separating Macros and Content
• Twine 2.8: Harlowe 3.3: Changers: Enchant
• Twine 2.8: Harlowe 3.3: Changers: Example: Haunting
• Twine 2.8: Harlowe 3.3: Changers: ?Page, ?Passage, ?Sidebar, and ?Link
• Twine 2.8: Harlowe 3.3: Changers: Restyling a Story
• Twine 2.8: Harlowe 3.3: Changers: Hidden Hooks, Show, and Hide
• Twine 2.8: Harlowe 3.3: Changers: Example: Showing and Hiding Windows
• Twine 2.8: Harlowe 3.3: Changers: Prepend, Replace, and Append
• Twine 2.8: Harlowe 3.3: Changers: Example: Responding Dynamically to Links
• Twine 2.8: Harlowe 3.3: Changers: Color and Background Color
• Twine 2.8: Harlowe 3.3: Changers: CSS Macro
• Twine 2.8: Harlowe 3.3: Changers: Borders
• Twine 2.8: Harlowe 3.3: Changers: Example: Stylized Windows
• Twine 2.8: Harlowe 3.3: Changers: Setup, Header, and Footer Tags
• Twine 2.8: Harlowe 3.3: Changers: Event
• Twine 2.8: Harlowe 3.3: Changers: Example: Simple Input Filtering
• Twine 2.8: Harlowe 3.3: Changers: Text Rotate X, Y, and Z
• Twine 2.8: Harlowe 3.3: Changers: Example: Increasing Madness
• Twine 2.8: Harlowe 3.3: Changers: Action
• Twine 2.8: Harlowe 3.3: Changers: Example: Target Practice

Harlowe 3.3: Data Structures

• Twine 2.6: Harlowe 3.3: Data Structures: Working with Arrays
• Twine 2.6: Harlowe 3.3: Data Structures: Working with Datasets
• Twine 2.6: Harlowe 3.3: Data Structures: Working with Datamaps
• Twine 2.6: Harlowe 3.3: Data Structures: Example: Managing Inventory with Data Structures
• Twine 2.8: Harlowe 3.3: Data Structures: Strings
• Twine 2.8: Harlowe 3.3: Data Structures: Example: Splitting First and Last Names

Harlowe 3.3: Advanced Patterns

• Twine 2.6: Harlowe 3.3: Advanced Patterns: Using Lambdas
• Twine 2.6: Harlowe 3.3: Advanced Patterns: Example: Managing Inventory with Lambdas
• Twine 2.6: Harlowe 3.3: Advanced Patterns: Introducing Storylets
• Twine 2.8: Harlowe 3.3: Advanced Patterns: Metadata
• Twine 2.8: Harlowe 3.3: Advanced Patterns: Example: Searching for Passages
• Twine 2.8: Harlowe 3.3: Advanced Patterns: Accessing Passage Data
• Twine 2.8: Harlowe 3.3: Advanced Patterns: Example: Storing String Data in Passages
• Twine 2.8: Harlowe 3.3: Advanced Patterns: Saving and Loading Games
• Twine 2.8: Harlowe 3.3: Advanced Patterns: Example: Saving Inventory

Harlowe 3.3: Debugging

• Twine 2.6: Harlowe 3.3: Debugging: Common Issues
• Twine 2.6: Harlowe 3.3: Debugging: Example: Guided by Editing Colors
• Twine 2.6: Harlowe 3.3: Debugging: Test from Here

SugarCube 2.36

• Twine 2.6: SugarCube 2.36: Introduction: Switching Default Story Format to SugarCube
• Twine 2.6: SugarCube 2.36: Introduction: Introduction to SugarCube
• Twine 2.6: SugarCube 2.36: Introduction: Links and Passages
• Twine 2.6: SugarCube 2.36: Introduction: Applying Text Styles
• Twine 2.6: SugarCube 2.36: Introduction: Example: Expressing Exposition through Text Styling
• Twine 2.6: SugarCube 2.36: Introduction: Creating and Accessing Variables Using Macros
• Twine 2.6: SugarCube 2.36: Introduction: Example: Keys and Doors

SugarCube 2.36: Interactivity

• Twine 2.6: SugarCube 2.36: Interactivity: Adding Interactivity
• Twine 2.6: SugarCube 2.36: Interactivity: Example: Character Statistics
• Twine 2.6: SugarCube 2.36: Interactivity: Link Appending, Replacing, and Prepending
• Twine 2.6: SugarCube 2.36: Interactivity: Example: Improving Keys and Doors
• Twine 2.6: SugarCube 2.36: Interactivity: Working with Reader Input
• Twine 2.8: SugarCube 2.36: Interactivity: Repeat and Done
• Twine 2.8: SugarCube 2.36: Interactivity: Timed Delay
• Twine 2.8: SugarCube 2.36: Interactivity: Actions Macro
• Twine 2.8: SugarCube 2.36: Interactivity: Choice Macro

SugarCube 2.36: Displaying

• Twine 2.6: SugarCube 2.36: Displaying: Including One Passage in Another
• Twine 2.6: SugarCube 2.36: Displaying: Example: Improving Character Statistics
• Twine 2.6: SugarCube 2.36: Displaying: Printing
• Twine 2.6: SugarCube 2.36: Displaying: Example: Raising a Virtual Chicken
• Twine 2.6: SugarCube 2.36: Displaying: Understanding Whitespace
• Twine 2.6: SugarCube 2.36: Displaying: Example: Improving Raising Virtual Chickens

SugarCube 2.36: HTML

• Twine 2.6: SugarCube 2.36: HTML: Introducing HTML and Selectors
• Twine 2.6: SugarCube 2.36: HTML: Example: Layout with HTML
• Twine 2.6: SugarCube 2.36: HTML: Appending, Replacing, and Prepending with HTML
• Twine 2.6: SugarCube 2.36: HTML: Example: Revisiting Character Statistics
• Twine 2.6: SugarCube 2.36: HTML: Reviewing CSS with HTML
• Twine 2.6: SugarCube 2.36: HTML: Example: Form Validation

SugarCube 2.36: Input

• Twine 2.8: SugarCube 2.36: Input: Button Macro
• Twine 2.8: SugarCube 2.36: Input: Checkbox Macro
• Twine 2.8: SugarCube 2.36: Input: Numberbox Macro
• Twine 2.8: SugarCube 2.36: Input: Radiobutton Macro

SugarCube 2.36: Special Tag and Passage Names

• Twine 2.8: SugarCube 2.36: Special Tag and Passage Names: init Tag
• Twine 2.8: SugarCube 2.36: Special Tag and Passage Names: StoryInit Passage
• Twine 2.8: SugarCube 2.36: Special Tag and Passage Names: PassageHeader Passage
• Twine 2.8: SugarCube 2.36: Special Tag and Passage Names: PassageFooter Passage
• Twine 2.8: SugarCube 2.36: Special Tag and Passage Names: StoryAuthor Passage
• Twine 2.8: SugarCube 2.36: Special Tag and Passage Names: StoryInterface Passage
• Twine 2.8: SugarCube 2.36: Special Tag and Passage Names: StoryMenu Passage
• Twine 2.8: SugarCube 2.36: Special Tag and Passage Names: StoryDisplayTitle Passage
• Twine 2.8: SugarCube 2.36: Special Tag and Passage Names: StorySubtitle Passage

SugarCube 2.36: JavaScript

• Twine 2.8: SugarCube 2.36: JavaScript: Reviewing JavaScript Concepts
• Twine 2.8: SugarCube 2.36: JavaScript: Adding Randomness to Stories
• Twine 2.8: SugarCube 2.36: JavaScript: Example: Using Dice Rolls
• Twine 2.8: SugarCube 2.36: JavaScript: Reviewing Arrays
• Twine 2.8: SugarCube 2.36: JavaScript: Example: Random Entries from Arrays
• Twine 2.8: SugarCube 2.36: JavaScript: For Macro and Arrays
• Twine 2.8: SugarCube 2.36: JavaScript: Example: Managing Inventory with Arrays
• Twine 2.8: SugarCube 2.36: JavaScript: Reviewing Strings
• Twine 2.8: SugarCube 2.36: JavaScript: Example: Combining and Searching Text
• Twine 2.8: SugarCube 2.36: JavaScript: Reviewing Objects
• Twine 2.8: SugarCube 2.36: JavaScript: Example: Managing Inventory with Objects
• Twine 2.8: SugarCube 2.36: JavaScript: Reviewing Functions
• Twine 2.8: SugarCube 2.36: JavaScript: Example: Managing Inventory with Functions
• Twine 2.8: SugarCube 2.36: JavaScript: Using Script Macro
• Twine 2.8: SugarCube 2.36: JavaScript: Using setPageElement()
• Twine 2.8: SugarCube 2.36: JavaScript: Example: Reloading Included Passages
• Twine 2.8: SugarCube 2.36: JavaScript: Using passage()
• Twine 2.8: SugarCube 2.36: JavaScript: Example: Reacting to Current Passage Name
• Twine 2.8: SugarCube 2.36: JavaScript: Using time()
• Twine 2.8: SugarCube 2.36: JavaScript: Example: Checking the Oven
• Twine 2.8: SugarCube 2.36: JavaScript: Using variables()
• Twine 2.8: SugarCube 2.36: JavaScript: Example:
• Twine 2.8: SugarCube 2.36: JavaScript: Story and Passage API: Testing for and Retrieving a Passage By Name
• Twine 2.8: SugarCube 2.36: JavaScript: Story and Passage API: Retrieving Collections of Passages
• Twine 2.8: SugarCube 2.36: JavaScript: Story and Passage API: Example: Passage Text as Data
• Twine 2.8: SugarCube 2.36: JavaScript: UIBar API: Hiding and Showing Sidebar
• Twine 2.8: SugarCube 2.36: JavaScript: jQuery: Finding and Accessing HTML Elements
• Twine 2.8: SugarCube 2.36: JavaScript: jQuery: Responding to Events
• Twine 2.8: SugarCube 2.36: JavaScript: jQuery: “:passageinit” Event
• Twine 2.8: SugarCube 2.36: JavaScript: jQuery: “:passagestart” Event
• Twine 2.8: SugarCube 2.36: JavaScript: jQuery: “:passagerender” Event

SugarCube 2.36: Debugging

• Twine 2.6: SugarCube 2.36: Debugging: Common Issues
• Twine 2.6: SugarCube 2.36: Debugging: Watching Variables

---

Twine + Unity [Blog Posts]
(Feb 2021)

“How can I use Twine with Unity?”

---

Creating your own Twine 2 Story Format [Blog Posts]
(Feb 2020 – March 2020)

• Part 1: Understanding Twine 2 HTML Structures
• Part 2: Reading Story and Passage Data
• Part 3: Parsing Links
• Part 4: Adding Functionality
• Part 5: Packaging a Story Format

---

Learning Twine 2.3 [Videos]
(May 2019 – Feb 2020)

Harlowe 3.0

• Twine 2.3: Harlowe 3: Variables
• Twine 2.3: Harlowe 3: Setting and Putting Variables
• Twine 2.3: Harlowe 3: Hooks
• Twine 2.3: Harlowe 3: Conditional Statements
• Twine 2.3: Harlowe 3: Arrays
• Twine 2.3: Harlowe 3: Dice Rolling
• Twine 2.3: Harlowe 3: Date and Time
• Twine 2.3: Harlowe 3: Passage Tags
• Twine 2.3: Harlowe 3: Datamaps
• Twine 2.3: Harlowe 3: Datasets
• Twine 2.3: Harlowe 3: History and Passage
• Twine 2.3: Harlowe 3 Working with Strings
• Twine 2.3: Harlowe 3: Cycling Link Macro
• Twine 2.3: Harlowe 3: Understanding Whitespace
• Twine 2.3: Harlowe 3: Displaying Passages
• Twine 2.3: Harlowe 3: Passages as Text Storage

SugarCube 2.28

• Twine 2.3: SugarCube 2.28: Variables
• Twine 2.3: SugarCube 2.28: Setting and Updating Values
• Twine 2.3: SugarCube 2.28: Conditional Statements
• Twine 2.3: SugarCube 2.28: Dice Rolling
• Twine 2.3: SugarCube 2.28: Arrays
• Twine 2.3: SugarCube 2.28: Special Passage Names
• Twine 2.3: SugarCube 2.28: Object Literals
• Twine 2.3: SugarCube 2.28: Story History

Snowman 1.3

• Twine 2.3: Snowman 1.3: Variables
• Twine 2.3: Snowman 1.3: Template System
• Twine 2.3: Snowman 1.3: Passages as Text Storage
• Twine 2.3: Snowman 1.3: window.story
• Twine 2.3: Snowman 1.3: window.passage

Chapbook 1.0

• Twine 2.3: Chapbook 1.0: Vars Section
• Twine 2.3: Chapbook 1.0: Inserts
• Twine 2.3: Chapbook 1.0: Modifiers
• Twine 2.3: Chapbook 1.0: JavaScript Modifier
• Twine 2.3: Chapbook 1.0: Lookup Variables
• Twine 2.3: Chapbook 1.0: JavaScript: engine.state

---

Learning Twine 2.2 [Videos]
(July 2018)

Twine 2.2 Introduction

• Twine 2.2: Story List
• Twine 2.2: Story Map
• Twine 2.2: Passage Options and Editor
• Twine 2.2: Passage Links
• Twine 2.2: Story Stylesheet
• Twine 2.2: Style JavaScript
• Twine 2.2: Proofing Copy
• Twine 2.2: Story Formats

Style Markup and Hooks

• Harlowe: Style Markup
• SugarCube: Style Markup
• Snowman: Style Markup
• Harlowe: Hooks

Examples

• Example: Exploring a Castle (Passage Links)
• Example – Cephalopod Dating (Harlowe: Variables)
• Example – Cephalopod Dating (SugarCube: Variables)
• Example – Gardening (Story Stylesheet and Story JavaScript)
• Example – Escape Room (Harlowe: Hooks and Harlowe: Style Markup)
• Example – Fantasy Roguelike (Harlowe)

---

Procedural Generation in Twine (Twine 2.2) [Videos]
(July 2018)

• Macros
• Passages + JavaScript
• Passage Manipulation
• Example – History Generation

---

Twine 2.1 [Videos]
(April 2017 – June 2017)

Harlowe 2.0

• Twine 2.1: Harlowe 2.0: Enchant macro and ?Passage named hook
• Twine 2.1: Dialogs and Modals
• Twine 2.1: Harlowe 2.0: Using CSS with Icons
• Twine 2.1: Harlowe 2.0: Transitions and Animations
• Twine 2.1: Harlowe 2.0: Moving through “Dungeons”
• Twine 2.1: Harlowe 2.0: Instant Messenger Mechanics
• Twine 2.1: Harlowe 2.0: Common User Interface Designs
• Twine 2.1: Harlowe 2.0: “Keypad” Input
• Twine 2.1: Harlowe 2.0: Using Images
• Twine 2.1: Harlowe 2.0: Passage and History Macros
• Twine 2.1: Harlowe + jQuery: Basics
• Twine 2.1: Harlowe + jQuery: Elements and Navigation
• Twine 2.1: Harlowe 2.0: “Space Exploration”

SugarCube 2.0

• Twine 2.1: SugarCube 2.0: Story and Passage API
• Twine 2.1: SugarCube 2.0: Dialog API
• Twine 2.1: SugarCube 2.0: UIBar and UI API
• Twine 2.1: SugarCube 2.0: Setting API
• Twine 2.1: SugarCube 2.0: Engine API 
• Twine 2.1: SugarCube 2.0: State API
• Twine 2.1: SugarCube 2.0: Loadscreen API
• Twine 2.1: SugarCube 2.0: “Space Exploration”

Snowman 1.3

• Twine 2.1: Snowman 1.3: window.story
• Twine 2.1: Snowman 1.3: window.passage
• Twine 2.1: Snowman 1.3: Using Underscore.js
• Twine 2.1: Snowman 1.3: “Space Exploration”
• Twine 2.1: Working with CSS Grids

---

Twine 2.0 [Videos]
(Dec. 2014 – April 2016)

• An Introduction to Twine 2.0
• Twine 2.0: Assignment and Value Macros
• Twine 2.0: Hooks
• Twine 2.0: Changer and Sensor Macros
• Twine 2.0: Using CSS
• Twine 2.0: Using JavaScript in Harlowe
• Twine 2.0: Using JavaScript in Snowman
• Twine 2.0: Using JavaScript in SugarCube
• Twine 2.0: Advanced Data Types in Harlowe
• Twine 2.0: Story Modularity
• Twine 2.0: Debugging and Troubleshooting
• Twine 2.0: Turn-based Encounters
• Twine 2.0: No-click Navigation
• Twine 2.0: Dynamic Visual Effects
• Twine 2: User Input in SugarCube
• Twine 2: Using Images in SugarCube
• Twine 2: Using Functions as Macros in Snowman
• Twine 2: Creating a Dungeon Crawler — Part 1
• Twine 2: Creating a Dungeon Crawler — Part 2
• Twine 2: Creating a Dating Sim
• Twine 2: Re-creating Candy Box
• Twine 2: Inventory Systems
• Twine 2: Murder Hill House Mystery — Part 1
• Twine 2: Murder Hill House Mystery — Part 2
• Twine 2: Murder Hill House Mystery — Part 3
• Twine 2: Visual Novel Basics
• Twine 2: Header, Footer, and Startup tags in Harlowe
• Twine 2: Saving and Loading Games in Harlowe

---

Twine 1.4 [Blog Posts]
(Jan 2014)

• An Introduction to Twine 1.4
• Creating a basic maze in Twine
• Using HTML5 Audio in Twine

---

Select #TwineTuesday Posts
(Twine 1.3.5 and 1.4.2) [Blog Posts]
(Feb 2013 – Aug 2014)

• #TwineTuesday: Hosting Twine files with philome.la
• #TwineTuesday: Changing the CSS rules of a single passage link
• #TwineTuesday: No-click Twine using jQuery
• #TwineTuesday: Highlighting clicked links in the Jonah story format
• Twine Tuesday: Quest log
• Twine Tuesday: Timed Replacement of Content
• Twine Tuesday: No-click Twine (without jQuery)
• Twine Tuesday: Loading External JavaScript
• Twine Tuesday: Endless Story
• Twine Tuesday: Dynamically Adding Passages

---

Learning Twine Series
(Previously “Gamasutra”, now “Game Developer”)
(Twine 1.3.5) [Blog Posts]
(Feb 2013)

• Learning Twine: Part 1
• Learning Twine: Part 2
• Learning Twine: Part 3

---

Twine 1.3.5 [Videos]
(Jan. 2013 – Feb. 2013)

• Twine 1.3.5: A short tutorial on using Twine (in Windows)
• Twine 1.3.5: Choices, Variables, and if/else Statements
• Twine 1.3.5: Macros and Visuals
• Twine 1.3.5: A Project Review