紙の試作を写真に撮って、AIにゲームにしてもらう

何を確かめる実験か

確かめたいのは「AIの性能」ではなく、紙の試作のどの部分が写真に乗り、どの部分が言葉で補う必要があるかです。ここを取り違えると、実験の結果が次の試作に使えなくなります。

比べる条件は、渡す情報の量だけを変えて三つに絞ります。

• A、渡すもの：写真のみ。指示は「この紙のゲームをブラウザゲームにしてください」程度、確かめること：写真だけで伝わる範囲
• B、渡すもの：写真と、ゲームの狙いを書いた一行、確かめること：目的の一言がどこまで効くか
• C、渡すもの：写真と、ルールを文章に書き起こしたもの、確かめること：言葉で補ったときの到達点

条件は一度に一つだけ変えます。撮影の角度や明るさまで同時に変えると、差が出ても原因を特定できません。写真の撮り方の影響を見たい場合は、A〜Cが終わったあとの別の実験として切り離してください。

準備するもの：紙の試作と「意図シート」

用意するのは次の四つです。

• 小さな紙の試作を一つ。盤、カード、メモ、サイコロなど、紙の上で一通り遊べる状態にしたもの
• スマートフォンなど、写真が撮れる機器
• 画像を読めるAI。新しい会話を何度も始められるもの
• 採点用の表。後述の「意図シート」を書き写せる紙かスプレッドシート

紙の試作は、あえて写真に写りにくい要素を3つ仕込みます。たとえば次のような仮定の試作を考えてみます。5×5のマスの盤で、各プレイヤーが伏せたカードを1枚ずつ持ち、サイコロの目で進める歩数を決め、先に中央へ着いたほうが勝ちとします。ここに、次のような要素を足します。

• 非公開情報：伏せカードの中身は相手に見せない
• 色だけで示した制約：赤く塗ったマスには入れない（凡例は紙のどこにも書かない）
• 消した跡のあるルール：鉛筆で書いて消した数字が、一部だけ残っている

これらはあくまで一例です。自分の試作に同じ構造があればそのまま使えますし、なければ似た性質の要素を3つ選んでください。写真から読み取れそうな要素と、読み取りにくそうな要素が両方入っていることが、この実験の条件です。

意図シートを先に書く

AIに見せる前に、この試作がどう動くべきかを項目に分けて書き出します。これが意図シートで、採点の物差しになります。8〜12項目を目安にして、各項目に「必須」か「あれば望ましい」を付けます。

• 盤の大きさと形
• 駒（またはカード）の種類と数
• 1手番でできること
• サイコロの使い方
• 非公開情報の扱い
• 進入できないマスの扱い
• 勝利条件
• 手番の進み方（交代の順序）

シートは書いたら固定します。結果を見たあとで「本当はこうしたかった」と書き換えると、実験の意味がなくなります。

手順：条件を三つに分けて撮る・頼む

撮影

写真は同じ試作を、次の三枚に揃えて用意します。

1. 真上から、盤とカード全体が入る写真
2. 盤の文字や記号が読める距離まで寄った写真
3. メモや書き込みが読める写真

影が文字にかからないよう、明るい場所で撮ります。撮影後に紙を直さないでください。写真を撮り直すときは、紙が変わっていないことを確かめてからにします。

AIへの依頼

各条件を、新しい会話で2回ずつ行います。合計は3条件×2回で6回です。会話を使い回すと、前の指示が効いてしまうためです。

どの条件にも共通で、次の制約を一文で付けます。

単独で動く1つのindex.htmlで、外部ライブラリや外部通信を使わず、スマートフォンでも遊べる形にしてください。

こうしておくと、後でアソバースに投稿するときにそのまま使えます。投稿できる形式は、直下にindex.htmlがあるHTMLまたはZIPで、素材は相対パスで参照し、サーバー用コードやサービスワーカーは対象外です。

条件別の依頼文の違いは次の通りです。

• A：共通の制約と「この写真の紙のゲームをブラウザゲームにしてください」だけ
• B：Aに「狙いは〇〇です」と一行だけ足す。ルールの説明は足さない
• C：Aにルールの文章を足す。ただし意図シートの文面をそのまま貼らず、遊び方の説明として自然に書く

最初の1回目で止める

生成されたものを開いたら、修正の指示を出す前に、最初の状態を記録します。修正を重ねれば意図に近づくのは当然なので、この実験が見るのは「一発目でどこまで届いたか」です。修正にどれだけ手間がかかるかは、別に数えます。

記録の取り方：採点と集計

採点の単位

採点は「意図シートの項目×試行」の単位で行います。各項目に次の点を付けます。

• 0：再現されていない
• 1：部分的に再現されている（形はあるが挙動が違う、など）
• 2：意図通り
• X：意図シートにないものが勝手に追加されている

Xは平均に混ぜず、別に数えます。「余計なものが足される」傾向も、写真から意図を読む場面の大切な情報です。

あわせて、意図通りになるまでに出した修正指示の回数を、試行ごとに記録します。上限は5回に決めておき、そこまでで届かなければ「届かず」と書きます。

集計用の最小ページ

手書きの表でも足りますが、試行が増えるなら次のHTMLをファイルに保存し、ブラウザで開くと使えます。入力欄に「項目,条件,試行,点」の形で1行ずつ貼り付けると、項目と条件ごとの平均を出します。

<!doctype html>
<meta charset="utf-8">
<title>採点集計</title>
<textarea id="in" rows="10" cols="50"
 placeholder="項目,条件,試行,点&#10;(例) 勝利条件,A,1,2"></textarea>
<br><button id="go">集計</button>
<pre id="out"></pre>
<script>
document.getElementById("go").onclick = () => {
  const lines = document.getElementById("in").value.trim().split("\n").slice(1);
  const sum = {};
  for (const line of lines) {
    const [item, cond, , p] = line.split(",").map(s => s.trim());
    const key = item + " / " + cond;
    sum[key] = sum[key] || { total: 0, n: 0, extra: 0 };
    if (p === "X") sum[key].extra++;
    else { sum[key].total += Number(p); sum[key].n++; }
  }
  let text = "";
  for (const key of Object.keys(sum).sort()) {
    const s = sum[key];
    const avg = s.n ? (s.total / s.n).toFixed(1) : "-";
    text += key + "  平均 " + avg + "  追加 " + s.extra + "\n";
  }
  document.getElementById("out").textContent = text;
};
</script>

先頭行は見出しとして読み飛ばします。最初の行を必ず「項目,条件,試行,点」にして、その下に採点を貼り付けてください。

結果の読み方と、起こりやすい誤り

数字をどう読むか

集計が出たら、まず同じ条件の2回の差を見ます。同じ条件なのに点が大きく違う項目は、条件の効果ではなく生成のばらつきの可能性が高く、その項目の比較は保留します。条件間の差が、同条件内のばらつきより小さい場合も同様です。

そのうえで、次のような読み方ができます。

• AとBがほぼ同じなら、一行の目的は生成内容にあまり効いていない、と読めます。目的は別の形で伝える必要がありそうです
• BよりCが明らかに高い項目は、写真と一行では伝わらず、文章で補う必要がある要素です。次の試作から、その要素を紙に文字で書いておく価値があります
• Aの時点で高い項目は、写真だけで伝わる要素です。盤の形や駒の配置のように、視覚で固まる要素が該当するかを確認してみてください
• Cでも低い項目は、文章にしても伝えにくい要素か、AIが苦手な処理です。この項目は自分で実装を直す対象として分けます
• Xが多い条件は、情報が足りない部分をAIが推測で埋めている可能性があります。追加された内容が良ければ、新しい案として拾えます

どの傾向が出るかは、試作の種類やAIによって変わります。この記事は結論を持たないので、自分のデータだけで判断してください。1つの試作の6回だけでは、「写真は〜に弱い」と一般化はできません。別の試作で繰り返して、同じ傾向が出るかを見ると確かになります。

起こりやすい誤り

• 意図シートを後から直す：結果を見て項目を変えると、必ず高得点になります。最初に固定してください
• 会話を使い回す：前の指示が残り、条件の差が消えます。毎回新しい会話にします
• 撮影条件が揃っていない：影で文字が読めない、角度が違う、といった差が条件差に混ざります。三枚は一度に撮ります
• 条件Cの文章に意図シートをそのまま貼る：項目を丸写しすると、採点が答え合わせになってしまいます。遊び方の説明として書き直します
• 修正を重ねたあとの状態を採点する：採点するのは最初の状態です
• 写真に個人情報や他人の絵が入る：名前入りのメモや、他人が描いた絵、市販のゲームの盤面を写すのは避けます。権利が気になる場合は、各AIサービスの利用案内で、画像の扱いとデータの利用範囲を確認してください

次の行動

まず、手元の紙の試作から、写真に写らなさそうな要素を3つ決めて意図シートを書き、条件A〜Cの6回分の写真と依頼文を用意してください。1回目の結果を採点したら、Bの一行を書き換えるのではなく、Cで補った文章のうち「どの文が効いたか」を項目と照らして確かめます。

動くものができたら、アソバースへの投稿で公開できます。20MiB以内で直下にindex.htmlを置いたHTMLまたはZIPを用意してください。投稿画面の「紹介文と遊び方を作成」は、公開済みURLか本人の検証済みアップロードを読み取って下書きを作る機能で、写真は読みません。「この文章を使う」を押したときだけ反映されます。