【#STORYEM】小テスト付きチュートリアルを作ろう / 世界最速・最軽量AIゲームブックエンジン『STORYEM(ストリーム)』の活用例(商用利用無料)

ゲームブックエンジン「STORYEM」とは？

このnoteにて公開しています、世界最速・最軽量・高機能・商用利用無料のゲームブックエンジン「STORYEM（ストリーム）」。

AIの力を借りて、文章や単語から数分で「遊べる完成品ゲーム」が出来上がる、100KBに満たない超軽量サイズの、驚異のゲームブック制作エンジンです。以下の記事からどなたでもダウンロードでき、商用無料・カスタマイズ自由です。

小テスト付きのSTORYEMチュートリアルを、STORYEMで40分で作りました

このゲームブックエンジン「STORYEM（ストリーム）」、もちろん上記のメイン記事には、詳しい使い方を画面写真付きで載せています。

それはそれとしてお読みいただくと楽しいのですが、それとは別に、

・STORYEM自体の技術デモンストレーションを兼ねて、
・STORYEMチュートリアルゲーム（小テスト付き）を、
・STORYEM自体で作ってみました。

ああ、ややこしい・・・笑

今回は、２つのバージョンを作り、制作時間は、合計で約40分。
その内訳は、以下のような感じでした。

■「バージョン１：小テストなし＆戦闘あり」
①AIに比較的自由にチュートリアルゲームを作らせる【5分】
②AIが作ってきたデータ内の説明文を私が修正する【10分】
③私が一度動かして遊んでみる【10分】

■「バージョン２：小テストあり＆戦闘なし」
④制作の方針を私が考え直し、AIに修正させる【5分】
⑤AIが修正してきたデータを私が確認し、再度動かして遊んでみる【10分】

Webに公開しており、以下より遊べます。まずは、触ってみましょう。

すぐ遊べるWeb版「STORYEMゲームブック制作ガイド」

▼バージョン１「小テストなし＆戦闘あり」をすぐ遊ぶ

▼バージョン２「小テストあり＆戦闘なし」をすぐ遊ぶ

どうやって「バージョン１」を作ったか、解説します

(1) まず、STORYEMを起動したら、右上の「▼menu」を開きます。

(2) 青い『CSV生成アシスタント「STORYEM GAMEBOOK studio」を別タブで開く』のボタンを押して、STORYEM studioを起動します。

(3) STORYEM studioの入力欄に、以下のように記入しました。

(4)  studio画面の一番下の「プロンプトをコピーしてAIを起動」を押します。ChatGPTとGeminiが選べますが、今回はGeminiにしてみました。

(5) Geminiの画面が起動します。実はこの瞬間、クリップボードには、280行ほどの、長文のAI向け命令文（プロンプト）がコピーされています。

(6) Geminiのチャット入力欄に、クリップボード内の命令文を「Ctrl+V」または、右クリック→貼り付け　で貼り付け、送信ボタンを押します。

すぐにバージョン1のチュートリアルゲームのデータが完成

すぐに以下のように、AIがSTORYEM用のデータを生成してくれました。
ちゃんとAIは、STORYEMのnoteの記事も学習してくれていたんですね。
ちょっと嬉しかったです。

さて、以下の最初の２行が「ルールCSV」。そのあと1行分の空行があり、そして4行目からが全部で30パラグラフで進行する「シナリオCSV」です。
※「シナリオCSV」は全部ここに掲載すると長いので、以下、ところどころ「（中略）」しています。

ttl,bg,max_hp,init_skill,init_luck,init_food
STORYEMゲームブック制作ガイド,bg_studio.jpg,20,8,10,3

id,type,text,options,e_name,e_skill,e_hp,next,bgm,bgi,effect
1,normal,"ようこそSTORYEMゲームブック制作ガイドへ！ここでは4つのステップでゲーム制作を学びます。まずは「①サンプルゲームを遊ぶ方法」から始めましょう。","進む→2",,,,,bgm_main.mp3,bg_start.jpg,
2,normal,"まずはnote記事からSTORYEMをダウンロードしましょう。解凍したフォルダ内にある「index.html」をブラウザで開くだけで準備完了です。","次へ→3",,,,,,,

（中略）

5,normal,"「封印庫の冒険」を無事に体験できましたか？理解度チェックとして、システムのバグ（仮想敵）を排除してみましょう！","戦う→6",,,,,,,eat
6,battle,"理解度チェック：基本操作のバグが襲ってきた！","デバッグする",操作バグ,6,4,7,bgm_battle.mp3,,

（後略）

25,end,"おめでとうございます！あなたはSTORYEMを完全にマスターしました。STORYEMで、あなただけの物語を作り始めましょう。あなたに良い旅があらんことを！","物語を書き始める",,,,,bgm_main.mp3,bg_end.jpg,

AIのハルシネーション（誤り）に遭遇

遊ぶ前に、生成されたデータ内の文章を全てチェックしたところ、いくつか説明文に事実と異なる記述が見つかりましたので、私の方でファクトチェック（事実確認チェック）をして、修正しました。

たとえば、パラグラフ2には当初は

STORYEMには最初から『封印庫の冒険』というサンプルゲームが入っている。タイトル画面からそのまま開始すれば遊ぶことができる。

という記述があったのですが、これは誤りでして、サンプルゲーム『封印庫の冒険』を遊ぶには、いくつかのクリック操作が必要なのです。

今回は、私自身が開発したツールについてのチュートリアルゲームの作成なので、著作権侵害チェックの必要はなかったですが、このファクトチェックに私自身が少しだけ、パワーを使いました。

AIは時々、「ハルシネーション（Hallucination＝幻覚）※」といって、過去に学んだ「常識」と混同したりして、間違った回答をすることがあります。

文章に改行を入れるには「\n」で

実はSTORYEMでは、文章中に「\n」を書くことで、改行を入れることができます。

例えば、

の文章に「\n」を２組、追記して

のようにすれば、ゲーム画面上では

のように表現できるのです。
ただし、AIにこれをさせてしまうと、データが壊れる原因になるので、現在は、人の手で追記する必要があります。

技術的には解決方法があるので、将来的には、改良していきたいと思っています。

遊んでみると「なんか違う感」がした

さて、いよいよゲームを遊んでみたのですが、ところどころ挟まる戦闘に、違和感を覚えました。

戦闘自体がチュートリアルとは全く無関係なので、純粋にチュートリアルで学びたい場合に、邪魔になるんですよね。

「バグが襲ってきた」なんて、まるでこのSTORYEMが欠陥品だと誤解されてしまう恐れもあり、ちょっと悪ノリ感がありすぎです。
個人的には、こういうのは大好きなのですが。

なので、戦闘はやめて、選択式の小テスト形式に修正すべきだと感じました。

・・・というわけで、バージョン２を作ることにしました。

バージョン２はこうやって作りました

戦闘をやめて小テスト形式に変える「バージョン２」を作るために、
STORYEM studioの入力欄に、以下のように記入しました。

新しい要望を文章で書いて、その後に、現在のデータを丸ごと貼り付ければ、AIは状況を理解して、データを書き換えてくれるのです。

もちろんこの作業は、後日にゆっくり行なっても、精度は変わりません。
また、今回は「三択式小テスト」にしましたが、理論上は選択肢はいくつでも構いません。

※なお、以下の「（中略）」の部分は、実際には省略せず、元のデータを丸ごと入力欄に貼り付けています。

あとは、バージョン１を作った時と同じ手順でAIに生成させれば、完成です。

バージョン２で遊んでみました

無事に、以下のように、理想的な三択式の小テストクイズになりました。

間違った選択肢を選んだ場合、生命力が減り、以下のように不正解表示の画面に進みます。

その後、また元の小テスト画面に戻ってきますので、正解するまでは先のチュートリアルに進めないようになっています。

ただし、生命力が減るのは１問につき１回のみとし、全ての小テスト（計４問）全てで間違っても、生命力が0にはならないようにAI側で調整をしてくれています。

途中で生命力が０になってゲームオーバーになってしまっては、チュートリアルとして失格ですからね。
あくまでチュートリアルの目的は、ストレスなく、操作を覚えてもらうことなのですから。

この一連の動作は、以下のようなシナリオデータになっています。

「パラグラフ6」にて三択クイズを表示し、正解の場合はチュートリアルの続きとなる「パラグラフ7」に進むようになっています。

クイズに不正解の場合は、このバージョン２で追加された「パラグラフ61」に進み、不正解のメッセージを表示して、生命力（hp）を2ポイント減点し、元の「パラグラフ6」に戻ります。
「hp-2」と書かれているので、減点は1回のみです。

（もしこれを「!hp-2」のように「!」を付けた場合は、不正解のたびに生命力が減点となるので、何度も不正解をするとゲームオーバーになってしまうわけです）

なお、不正解表示の「パラグラフ61」の「61」という数字は、「61番目のパラグラフ」というよりも「パラグラフ6の枝番1」と理解しておくと、わかりやすいでしょう。
これは、AIが独自の判断で分かりやすく発番したものです。

完成後にAIにインタビューしてみました

さて、バージョン２が良いゲームになったところで、AIにインタビューをしてみました。

＜私＞
すばらしい！ちゃんと役に立つ小テストになっているね。

＜AIの回答＞
ありがとうございます！お役に立てたようで嬉しいです。

単なる戦闘を「システムのバグ」や「理解度チェック」という名の三択クイズに置き換えることで、遊びながらSTORYEMの仕様を自然に復習できる構成にしてみました。特に「文字コード」や「!（繰り返し）」の仕様は、制作時に間違いやすいポイントですからね。


＜私＞
選択肢を間違えて不正解になり、生命力が減っても、ゲームオーバーにならないようになっているのは、理由があるの？

＜AIの回答＞
ご質問ありがとうございます！その仕組みには、制作ガイドとしての役割を果たすための「意図的な設計」がいくつか隠されています。

理由は大きく分けて3つあります。

１．「学び」を止めないための配慮
このゲームブックの目的は、プレイヤーを倒すことではなく、STORYEMの使い方を正しく理解してもらうことにあります。
もし不正解で即座にゲームオーバー（最初からやり直し）になってしまうと、学習のモチベーションが削がれてしまいます。「間違えてもリトライできる」状態にすることで、正しい知識を定着させることを優先しています。

２．リソース管理のチュートリアル
このガイドでは、以下のSTORYEMの機能を実際に体験してもらう仕組みを取り入れています。

ダメージ（!hp-3）： 間違えるとペナルティがあるという緊張感。

回復（eat / !eat）： ダメージを受けても、道中の休憩ポイントや食料で立て直せるというゲームバランスの学習。

「体力が減っても死なない」のではなく、**「死ぬ前に正解を見つけるか、回復ポイントを活用する」**という、ゲームブック特有のリソース管理を体験させているのです。

３．!hp-n の動作検証
技術的な理由として、今回実装した !hp-3（訪れるたびに減少）というエフェクトの挙動をプレイヤーに実感してもらう意図もあります。
「一度間違えて戻り、また間違えるとさらに減る」という動きを体験することで、「あ、こうやって罠を作るんだな」というサンプルとしての役割を果たしています。

※もちろん、もっとシビアなゲームにしたい場合は、ルールCSVの max_hp を低く設定したり、不正解時のダメージを -20 などに設定して「即死トラップ」にすることも可能です！

【実験】選択肢を「十択」にすると？

最後に、ちょっと実験をしてみました。
小テストの選択肢は、理論上はいくらでも増やすことができます。

たとえば「十択式」にすると、こんな感じになります。
若干の狂気すら感じますが、「STORYEMではこういうこともできる」というデモンストレーションとしては、アリなのかもしれませんね。

この「十択」の実験後にも、AIへインタビューをしてみました。

＜私＞
十択式にしたことで、選択肢が多すぎてプレイヤーのストレスになるのではという懸念はあった？

＜AIの回答＞
確かに、ゲームデザインのセオリーから見れば「十択」はかなりのスパルタ設定ですよね。通常、プレイヤーの認知負荷を考えると選択肢は3〜5つが適正と言われています。

そこをあえて十択にしたのには、制作ガイドとしての「あえて負荷をかける意図」と、STORYEMの「仕様上の限界への挑戦」という2つの側面があります。

１．「なんとなく正解」を防ぐ教育的効果
三択や四択だと、内容を理解していなくても消去法や勘で当たってしまうことが多々あります。
このガイドは、「CSVの仕様を正確に覚える」という実技的な目的があるため、あえて選択肢を増やすことで「なんとなく選ぶ」ことを封じ、しっかりテキストを読み返して確認させるという、いわゆる「ドリル」のような役割を持たせています。

２．画面UIの限界と視認性のテスト
STORYEMにおいて、選択肢が10個並んだ時に画面がどう見えるかを確認する「UIテスト」の側面も兼ねています。

・選択肢がボタンとして縦に並んだ際、どれくらいの圧迫感があるか？
・画面の下に隠れてしまわないか？
・誤タップ（誤クリック）が起きないか？

これらを制作者自身が体験することで、「自分でゲームを作る時は、選択肢は5つくらいに留めておこう」という反面教師的な気づきを得てもらうことを期待しています。

３．「理不尽さ」もゲームブックの味
オールドスタイルのゲームブックには、時に膨大な選択肢から正解を引かされる「理不尽な迷宮」のような面白さがあります。
十択の中から正解を見つけ出した時の「これで仕様を完璧に理解したぞ！」という達成感（あるいは、間違えて体力が削られる焦り）は、三択では味わえないゲームとしてのスパイスとして導入しました。

▼今回のファイルの一式ダウンロード

さて、今回のファイル一式は、以下からダウンロードできます。
解凍してindex.htmlを開き、STORYEMの画面右上の「▼menu」から、同じフォルダ内のルールCSVとシナリオCSVをそれぞれファイル選択すれば、すぐに遊べます。

▼バージョン１「小テストなし＆戦闘あり」一式ダウンロード

▼バージョン２「小テストあり＆戦闘なし」一式ダウンロード

もちろん、この記事の冒頭でもご案内したとおり、以下のWebサーバー版で遊んでいただいても構いません。
こちらは、ダウンロード不要、CSVファイルを選択する必要はなく、すぐにゲームを開始できますよ！

▼バージョン１「小テストなし＆戦闘あり」をWebですぐ遊ぶ

▼バージョン２「小テストあり＆戦闘なし」をWebですぐ遊ぶ

おわりに：STORYEMで何か作ってみよう！

さあ、いかがでしたでしょうか？

STORYEM（ストリーム）・・・
＝Story Tree Of Roleplaying Yourself Entertainment Media
（あなただけの物語を流れるように紡ぐ、シナリオ分岐構造を持つエンターテインメント・メディア）

のとおり、STORYEMは通常のゲームブックにとどまらない、無限の可能性を秘めています。

今回のほかにもまだまだ、無限の活用方法があるでしょう。
みなさん自身の手で、探し出してみてください。

そして、もし本エンジンを使用して作成したゲームを公開された際は、ハッシュタグ「 #STORYEM 」を付けて投稿していただけると、開発者がこっそり遊びに行くかもしれません！（純粋に、皆さんの作品を楽しんでみたいのと、活用事例として、今後のアップデートの参考にさせていただきたいと思います。）

物語を作る喜びを、すべての人に。
AI時代の新しい遊び方。
このゲームブックエンジン『STORYEM（ストリーム）』が、あなたの想像力を形にする一助となれば幸いです。

『STORYEM（ストリーム）』
AIの力を借りて、文章や単語から数分で「遊べる完成品ゲーム」が出来上がる、100KBに満たない超軽量サイズの、驚異のゲームブック制作エンジンです。以下の記事からどなたでもダウンロードでき、商用無料・カスタマイズ自由です。