Rock Paper Scissors - Interactive Game Design Template

A Twine-based implementation of Rock Paper Scissors designed to teach fundamental interactive narrative mechanics to game design students with minimal programming experience.

Technical Implementation:

This project demonstrates several key techniques that students can adapt for their own projects:

Custom Typography - Integrates Google Fonts (Grenze Gotisch) through CSS imports, showing students how professional typography elevates game presentation beyond default system fonts.

@import url(https://fonts.googleapis.com/css2?family=Grenze+Gotisch);

tw-story {

    font: 200% 'Grenze Gotisch', cursive;

}

Randomized Branching Logic - Uses Twine's (either:) macro combined with (go-to:) to create dynamic opponent behavior. Each playthrough randomly selects between three outcome passages (P1, P2, P3), demonstrating how simple conditional logic creates replayability.    (go-to: (either: "P1", "P2", "P3")

Visual Layout Design - Implements two-column table structures created using WYSIWYG HTML editors. This workflow allows students to design complex layouts visually without writing code, then paste the generated HTML directly into Twine passages. This approach prioritizes design thinking over technical syntax.

https://wysiwyghtml.com/

Display Specifications: 1800x1200px (optimized for desktop browsers)

Teaching Notes::

This template solves a practical problem: students from art and design backgrounds can build functional games without getting stuck on programming syntax. They use visual tools for layout, Twine's plain-English commands for logic, and can focus on what matters—learning how randomization and branching actually work in games. It's a starter example for anyone teaching interactive storytelling to non-programmers.


I am not using variables here, though that would be an option - for instance after we finish first round we cold set a variable (set: $round_1_win to true) and "remember" results to recall these results on second round.

(if: $round_1_win is true)[that's a second win in a raw, nice work!]

--- download source folder with twine project (import story in twine) and images


StatusReleased
PlatformsHTML5
Authormantas
Made withTwine
Tags2D, Project template, Twine
Average sessionA few minutes
LanguagesEnglish
InputsMouse

Download

Download
twine_source.zip 3.1 MB

Leave a comment

Log in with itch.io to leave a comment.