マガジン

Twine入門:分岐小説ゲームを無料で作る

遊びをつくる

執筆にClaudeを使用しています。

週末の明るい机に置かれた、一つの仕組みで遊べる小さな完成済みゲーム。
記事のテーマをもとに制作したAI生成の写真風イメージ。

Twineは、プログラミングの知識なしに分岐する物語ゲームを作れる無料ツールです。ブラウザ上で動くHTMLファイルを書き出せるため、作ったゲームをそのままWebで公開できます。「選択肢で物語が変わるゲームを作りたいが、コードを書くのは難しい」と感じている人にとって、最初の一歩として選ばれることが多いツールです。 この記事では、Twineでどんなゲームが作れるのか、どのバージョンや形式を選ぶべきか、そして実際に動くゲームを完成させるまでの手順を順番に説明します。インストールから公開まで一通り読めば、今日中に最初の作品を試せる状態になることを目指しています。

この記事の目次
  1. Twineで作れるものとその限界
  2. バージョンと形式の選び方
  3. 最初の作品を作る手順
  4. よくある詰まりポイント
  5. 完成したゲームをどこで公開するか
  6. 次の行動
  7. 参考資料

Twineで作れるものとその限界

Twineが得意とするのは「テキストと選択肢を組み合わせた物語体験」です。場面ごとにテキストを書き、「どちらの道を選ぶか」「誰に話しかけるか」といった選択肢を置き、選んだ結果によって次の場面が変わります。ビジュアルノベル、ホラー脱出、会話シミュレーション、インタラクティブ詩など、テキストが主体のジャンルはほぼカバーできます。

一方で、アクション操作やリアルタイムの当たり判定はTwineの守備範囲外です。キャラクターを動かすプラットフォーマーや、弾を避けるシューティングを作ろうとすると、Twineの仕組みでは対応しきれず別のツールが適しています。「テキスト+選択肢+変数による状態管理」の組み合わせで表現したいゲームかどうかを最初に確認しておくと、方向性がぶれません。

バージョンと形式の選び方

Twineには現在、Twine 2が主流です。ブラウザ版(公式サイトから開いてそのまま使う)とデスクトップアプリ版(インストールして使う)の両方が提供されています。どちらも機能に大きな差はなく、作ったデータをHTMLファイルとして書き出せます。初めて使うならブラウザ版が手軽です。インストール不要で、アクセスするだけで編集を始められます。

Twine 2では「ストーリーフォーマット」と呼ばれる出力形式を選べます。主な選択肢は次の3つです。

  • Harlowe:Twine 2のデフォルト。独自の記法でリンクや変数を書く。学習コストが低く、初心者向け。
  • Sugarcube:カスタマイズ性が高く、セーブ機能やUIの調整がしやすい。中規模以上の作品に向く。
  • Chapbook:シンプルな記法で読みやすいコードになる。凝った演出より文章体験を重視する場合に合う。

最初の作品ではHarloweをそのまま使うのが無難です。変数やIF分岐もHarloweの記法で十分に実装できます。Sugarcubeは機能が豊富な分、学ぶことが増えるため、2作目以降で必要を感じたときに切り替えると判断しやすいです。

最初の作品を作る手順

1. プロジェクトを作る

ブラウザ版Twineを開き、「新しいストーリー」をクリックします。タイトルを入力すると、キャンバス上に「Untitled Passage」という最初の場面(パッセージ)が1つ表示されます。

2. パッセージを書く

パッセージをダブルクリックして開き、テキストを入力します。別の場面へのリンクは [[選択肢のテキスト->次のパッセージ名]] という形式で書きます。たとえば次のように書くと、「森に入る」と「村に戻る」という2つの選択肢が生まれます。

あなたは分かれ道に立っています。
[[森に入る->森のパッセージ]]
[[村に戻る->村のパッセージ]]

リンクを書くと、キャンバス上に自動で新しいパッセージが生成されます。そこを開いて続きの文章を書く、という作業を繰り返すことで物語が広がります。

3. 変数でフラグを管理する

選択の結果を記憶して後の場面に影響させたい場合は変数を使います。Harloweでは (set: $変数名 to 値) で変数を設定し、(if: $変数名 is 値)[表示するテキスト] で条件分岐を書きます。

たとえば「鍵を拾った」という選択をした場面で (set: $hasKey to true) と書いておき、後の扉の場面で (if: $hasKey is true)[扉を開けられる] と書けば、鍵を持っているときだけ扉が開くという演出になります。変数はゲームの状態管理の基本で、この仕組みを使えるようになると物語の複雑さを一段階上げられます。

4. テストとデバッグ

画面下の「テスト」ボタンを押すと、ブラウザ上でゲームを動かして確認できます。リンク先のパッセージが存在しない場合はエラー表示になるため、誤字やパッセージ名の不一致をすぐに発見できます。分岐の数が増えてきたら、すべてのルートを最低1回ずつ通ってみることが完成度を上げる最短の方法です。

5. HTMLとして書き出す

「公開」→「HTMLファイルに保存」を選ぶと、一つのHTMLファイルが生成されます。このファイルをブラウザで開けばゲームがそのまま動きます。外部サーバーへの依存がなく、ファイル単体で完結している点がTwineの大きな強みです。

よくある詰まりポイント

パッセージ名の揺れ:リンクに書いたパッセージ名と実際のパッセージ名が1文字でも違うとリンクが切れます。コピーペーストで揃えるか、キャンバス上で繋がっているかを目視確認する習慣を持つと防ぎやすいです。

スタートパッセージの設定忘れ:Twineは「スタートパッセージ」に設定されたパッセージからゲームが始まります。最初の場面のパッセージを右クリックして「スタートに設定」しておかないと、意図しない場面から始まることがあります。

CSSや画像を使いたい場合:Twine 2は単一HTMLファイルの中にすべてを埋め込む構造です。外部の画像ファイルを参照するリンクを書いた場合、そのHTMLを別の環境に持ち出すと画像が表示されなくなります。画像はBase64エンコードしてHTML内に埋め込むか、画像なしのテキスト表現に置き換えることを検討してください。

セーブ機能が必要な場合:Harloweにはデフォルトのセーブ機能がありません。長編を作る場合はSugarcubeへの切り替えを考えるか、物語の長さをプレイ時間15〜20分以内に抑えてセーブ不要な設計にする方法もあります。

完成したゲームをどこで公開するか

書き出したHTMLファイルはそのまま公開できます。itch.ioはHTMLゲームのアップロードに対応しており、英語圏では分岐小説の発表場所として広く使われています。ZIPに圧縮してアップロードする形式が一般的です。

日本語作品を日本語話者に届けたい場合は、HTMLゲームの投稿に対応したプラットフォームを探すことになります。アソバースはHTMLファイルおよびZIPファイルの直接投稿に対応しており、作ったTwineゲームをそのまま投稿・公開できます。日本語話者のプレイヤーが集まる場所に作品を置きたい場合の選択肢として確認してみてください。

次の行動

まずはTwineのブラウザ版を開き、3〜5個のパッセージをリンクでつないだ短い物語を1本完成させてみてください。「完成させる」経験がツールの理解を一番速く深めます。HTMLファイルを書き出したら、アソバースへの投稿も選択肢の一つとして試してみてください。

参考資料

  • Twine 公式サイト(Twineの概要・ダウンロード・ブラウザ版へのリンク)
  • Twine Wiki(Harlowe・Sugarcube・Chapbookの記法リファレンス)
  • Twine Cookbook(公式サンプルレシピ集)