手書きのスコア表を画面にする：記録の見せ方の違い

問い：消した跡は「記録」なのか

紙のスコア表には、数字のほかに情報が混ざっています。訂正の跡、書き直した順序、欄外の走り書き、筆圧や字の乱れなどです。これらは記録係が意図して残したものではありません。紙という媒体が勝手に残したものです。

画面にすると、媒体が勝手に残してくれる情報はほぼなくなります。そのかわり、作る側が意図すれば、紙にはなかった情報（書き込んだ時刻など）を足せます。したがって比べる対象は「紙と画面」の二択ではなく、次の3条件になります。

• 条件A：紙のスコア表
• 条件B：画面のスコア表で、訂正すると古い値を上書きして消すもの
• 条件C：画面のスコア表で、訂正しても古い値を取り消し線つきで残すもの

BとCを分けるのは、「画面だから情報が消える」のではなく「消すと決めたから消える」ことを切り分けるためです。もしBとCの差が大きければ、紙との差の多くは媒体ではなく設計の選択だと読めます。

読み手に確かめてもらう情報は、大きく3種類に分けておきます。

• 値の質問：最終的に何点か、誰が何位か。
• 経過の質問：いつ誰が逆転したか、どの値が訂正されたか。
• 状況の質問：どのラウンドで手が止まったか、途中で中断があったか。

紙は経過と状況に強く、画面は値に強い、と予想したくなります。しかし、これはまだ仮説です。実験で確かめるまでは決めつけないでください。

準備するもの

• 記録係2人。一人が紙、もう一人が画面を担当します。同じ人が両方を書くと、後から書くほうの注意が落ちやすくなります。
• 読み上げ係1人。台本を声に出して読みます。
• 読み手3人以上。その試合を見ておらず、記録だけを読みます。条件ごとに別の人を割り当てます。
• 印刷した升目の表（紙用）と筆記具。
• 下のHTMLファイル（画面用）。ブラウザで開くだけで動き、外部ライブラリは使いません。
• ストップウォッチ（読み手の回答時間用）。

画面用の最小構成は次のとおりです。「訂正の跡を残す」のチェックでBとCを切り替えます。時刻は各数字にマウスを重ねると表示されます。これは手元で練習するための簡易版で、本番の作品に組み込むものではありません。

<!doctype html>
<meta charset="utf-8">
<p>名前 <input id="n" size="6"> 得点 <input id="s" type="number" style="width:5em">
<button id="add">記録</button>
<button id="fix">直前の行を訂正</button>
<label><input type="checkbox" id="h"> 訂正の跡を残す</label></p>
<table border="1" id="t"></table>
<script>
const rows = [];
const $ = id => document.getElementById(id);
const esc = s => s.replace(/[&<>"']/g, c => "&#" + c.charCodeAt(0) + ";");
function stamp(v) { return { v: v, at: new Date().toLocaleTimeString() }; }
function draw() {
  $("t").innerHTML = rows.map((r, i) =>
    "<tr><td>" + (i + 1) + "</td><td>" + esc(r.name) + "</td><td>" +
    r.vals.map((x, j) => {
      const s = j < r.vals.length - 1 ? "<s>" + esc(x.v) + "</s>" : esc(x.v);
      return "<span title='" + x.at + "'>" + s + "</span>";
    }).join(" → ") + "</td></tr>").join("");
}
$("add").onclick = () => {
  rows.push({ name: $("n").value, vals: [stamp($("s").value)] });
  draw();
};
$("fix").onclick = () => {
  const r = rows[rows.length - 1];
  if (!r) return;
  const nv = stamp($("s").value);
  if ($("h").checked) r.vals.push(nv); else r.vals = [nv];
  draw();
};
</script>

このコードでは、画面に残る情報は「値・行の順序・訂正前の値（Cのみ）・入力時刻（ポインターを重ねたとき）」です。欄外メモの入力欄は意図して作っていません。紙にあって画面にない情報を、あとで観察しやすくするためです。

手順：台本から採点まで

1. 台本を作る

結果を比べるには、紙と画面に同じ出来事が起きる必要があります。実際の対戦をそのまま記録すると、出来事が毎回変わって比較できません。そこで、3人（A・B・C）の5ラウンド分を、声で読み上げる台本にします。台本には、次の出来事を意図して入れてください。

• 逆転が1回起きる（例：ラウンド3でBがAを抜く）。
• 読み上げた点数の訂正が1回ある（例：「さっきのBは10点でなく12点でした」）。
• 加算ミスの指摘が1回ある（例：Aの合計の足し間違いが後から見つかる）。
• 数字とは別の出来事を1つ入れる（例：ラウンド3の後で休憩が入る、Cが「次は様子を見る」と言う）。

台本の点数は事前に決めて紙に書いておき、正解表として手元に残します。読み上げは、一定の間隔（たとえば1行あたり10秒前後）で行います。間隔は3条件で同じにしてください。

2. 同時に記録する

読み上げ係が台本を読み、2人の記録係が同時に聞いて、それぞれ紙と画面に書きます。画面側は、1回目の試合ではB、2回目ではCというように、条件を試合ごとに切り替えます。記録係の役割（紙・画面）も試合ごとに入れ替えると、個人の癖が条件に混ざりにくくなります。

注意点として、記録係に「あとで誰かが読む」ことは伝えても、「何を聞かれるか」は伝えないでください。訂正を丁寧に残すよう指示すると、条件の差ではなく指示の差が出てしまいます。書き方の指示は「聞こえたとおり、普段どおりに書く」だけにします。

3. 時間を空けて、読み手に質問する

記録を受け取った読み手には、10問程度の質問票に答えてもらいます。試合の直後ではなく、できれば翌日以降にすると、記録しか手がかりがない状況に近づきます。質問は事前に作り、次のように3種類へ振り分けておきます。

• 値、質問の例：ラウンド5終了時点で、Aは何点でしたか。
• 値、質問の例：最終順位を答えてください。
• 経過、質問の例：逆転が起きたのは何ラウンド目でしたか。
• 経過、質問の例：一度書かれてから変更された得点はありますか。あるなら、元の値と新しい値はいくつですか。
• 状況、質問の例：試合の途中で中断はありましたか。
• 状況、質問の例：誰かが迷っていた、または慎重になっていた場面はありますか。

各質問には「記録からは分からない」という選択肢を必ず付けてください。分からないものを推測で埋めた回答と、分からないと答えた回答は、意味が違うからです。

記録の取り方と結果の読み方

何を、どの単位で、何回記録するか

読み手1人につき、次の4つを書き留めます。

1. 質問ごとの正誤（○・×・「分からない」の3値）。
2. 質問ごとの回答時間（秒）。
3. 読み手の自由記述（「ここを見て判断した」など）。
4. 読み手が記録のどこを見ていたか、可能なら観察者のメモ。

条件ごとに最低3人、できれば5人を目安にします。人数が少ない分は、台本を2種類用意して試合回数を増やすことで補えます。ただし、同じ読み手に複数条件の記録を読ませないでください。前に読んだ内容を覚えているため、比較が崩れます。

集計は、条件×質問種類（値・経過・状況）の正答数の表にまとめます。「分からない」は誤答と別に数えます。

結果の読み方

数字が出たら、次の順に見ていきます。結果は人によって変わるので、ここでは判断の基準だけを示します。

• 値の質問で3条件に差がなければ、最終的な得点を伝える力は媒体を問わず足りていると読めます。差が出た場合は、表の見やすさ（行の区切り、文字の大きさ）が原因でないか、まず疑ってください。
• 経過の質問でAとCが近く、Bだけが低ければ、紙と画面の差ではなく、訂正を消す設計が原因だと読めます。
• 経過の質問でAがCより高ければ、台本の出来事のうち、紙に残ったのに画面に残らなかった情報が何だったかを、自由記述から探します。時刻や取り消し線で補えるのか、補えないのかを分けて考えます。
• 状況の質問でAだけが「分からない」を避けていれば、欄外のメモや筆跡が手がかりになっていた可能性があります。その場合、画面側に自由記述欄を足す価値があるかを、次の実験で試せます。
• 回答時間の差が大きければ、正答数が同じでも、探しやすさの違いが出ています。取り消し線の見やすさを疑ってください。
• どの質問でも3条件に差がなければ、台本の出来事が単純すぎたか、質問が易しすぎた可能性があります。訂正の回数や中断の場面を増やして、やり直します。

起こりやすい誤りと、ゲームへの持ち帰り方

実験が崩れやすい点を挙げます。

• 記録係の慣れの差：普段から手書きをしている人は紙に強く、キーボード入力に慣れた人は画面に強くなります。役割の入れ替えで薄めてください。
• 画面側に機能を足しすぎる：時刻表示や色分けを足すと、画面が紙より多くの情報を持ちます。比べたいのが「媒体の差」なのか「設計の差」なのかを、実験の前に決めておきます。
• 質問が条件に有利になっている：「訂正前の値は？」ばかり聞くと、残す設計が必ず有利になります。値・経過・状況の数を揃えてください。
• 正解の基準を後から決める：採点基準は台本と一緒に、実験の前に決めます。
• 読み手を使い回す：一度条件Cを読んだ人は、次の条件Aの記録でも訂正を探すようになります。

ゲームの記録表示に引きつけて考えるなら、アソバースの公式作品の設計に、この論点と重なる部分があります。確認済みの範囲では、「小さな軌道」は予測の点線に加えて前回の軌道を細い実線で表示します。「かたちのあいだ」は、一手戻しても手数が減らない仕様です。どちらも、試行の跡を画面に残す設計と読み取れます。一方で、記録の保存範囲は作品ごとに違います。「月夜の配達」の各夜の最少区間数や「小さな軌道」の最速記録はプレイ中だけの記録で、保存があるのは「余白の庭」「WAVE / WAVE」「かたちのあいだ」の3作品です。画面を閉じても残る紙とは、ここがはっきり違います。それぞれの作品で何が表示され、何が閉じると消えるのかは、実際に作品を開いて確かめてください。

自作の作品で記録を残す場合は、アソバースのクラウドセーブ（作品ごとにJSONで128KiBまで）の容量も考える必要があります。訂正の履歴を全部残すと、データは確実に増えます。何を残すかは、この実験で「読み手が実際に必要とした情報」から決めると、無駄な保存を避けられます。なお、アップロード作品内のlocalStorageは一時メモリーの互換処理なので、記録を長く残したい場合の手段としては頼れません。

次の行動

まず10分で、台本と質問票だけを作ってください。次に、上のHTMLを保存して開き、台本を読み上げながら条件BとCで1回ずつ記録してみます。紙の記録と並べたとき、自分の目でどの出来事が読み取れないかを確認できれば、本番の実験で聞くべき質問も見えてきます。