マガジン

カバーの中の文字と作品名が違うとき

遊びをつくる

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

丸や四角の色紙と色見本を使ってゲームの画面を検討する机。
記事のテーマをもとに制作したAI生成イメージ。実際のゲーム画面ではありません。

カバー画像に「月影ロード」と大きく描いてあるのに、投稿画面の作品名は「Moonlit Road」になっている場面を考えてみます。制作中は「どちらも同じゲームのことだ」と分かっているので、食い違いに気づきません。けれども、初めて作品一覧でそのカードを見た人は、画像の文字と名前欄の文字、二つの名前を同時に目にします。 この記事で確かめるのは、画像内の文字と登録名が食い違うと、見た人がどこで迷うのかです。結果を先に断言することはしません。代わりに、自分の作品で行える小さな実験の設計書を用意しました。必要なのは、カバー画像を3枚と、協力してくれる人を数人、それに記録用のメモだけです。 実験の目的は、食い違いを「悪いこと」と決めつけることではありません。食い違いがあるときに人が何を頼りに名前を覚えるのかを知り、自分の作品ではどちらかに揃えるべきかを判断する材料を得ることです。

この記事の目次
  1. 何を確かめるのか:問いと仮説
  2. 準備するもの:3種類のカバーと共通の名前
  3. 手順:3つの課題を順に行う
  4. 記録の取り方:何を、どの単位で、何回
  5. 結果の読み方:どうなればどう判断するか
  6. 誤りやすい点
  7. 次の行動

何を確かめるのか:問いと仮説

問いは一つに絞ります。「カバー画像の文字と登録名が違うとき、見た人は作品の名前をどちらで覚え、どちらで探そうとするのか」です。

この問いは、次の三つに分けると測りやすくなります。

  • 想起:カバーを見たあと、少し時間を置いて「さっきのゲームの名前は?」と聞くと、どちらの文字列が出てくるか。
  • 探索:覚えた名前で、作品一覧や検索から目的の作品にたどり着けるか。
  • 迷い:カバーと名前を同時に見たとき、同じ作品だと分かるまでにどれだけ時間がかかるか。

実験の前に、仮説を紙に書いておきます。たとえば「表記が違うと、カバーの大きな文字を答える人が多いはず」といった程度で構いません。仮説を先に書いておくと、結果を見たあとに「最初からそう思っていた」と後付けで解釈してしまうのを防げます。当たったかどうかより、外れたときに驚けるかどうかが大切です。

準備するもの:3種類のカバーと共通の名前

作品名(登録名)は固定します。ここでは仮に「月影ロード」とします。変えるのはカバー画像の中の文字だけです。

  • A、カバー内の文字:月影ロード、登録名との関係:完全に一致
  • B、カバー内の文字:つきかげロード、または Moonlit Road、登録名との関係:読みや言語が違う(意味は同じ)
  • C、カバー内の文字:文字なし、登録名との関係:画像に文字がない

条件Bは、実際に起こりやすい食い違いを再現するためのものです。表記の揺れには、ひらがなと漢字の違い、副題の有無、日本語と英語の違いなどがあります。可能なら、Bを2種類(読みの違いと言語の違い)に分けて、条件を4つにしても構いません。ただし、最初は3条件にとどめたほうが記録が散らかりません。

画像づくりでは、次の点を揃えます。

  1. 絵柄・色・構図は3枚とも同じにします。文字の有無と中身だけを変えます。違いが複数あると、何が原因か分からなくなります。
  2. 文字の大きさ、位置、フォントも条件AとBで揃えます。
  3. 同じ画像から書き出し、文字だけを差し替えます。

絵に文字を重ねる手間を減らしたいなら、文字なしの画像を土台にして、画像編集ソフトで文字レイヤーだけを入れ替える方法が確実です。

縮小プレビューで読めるかを先に確認する

一覧では、カバーは小さく表示されます。大きな画像では読めた文字が、縮小すると潰れて読めなくなることがあります。協力者に見せる前に、自分で縮小表示を確認します。次の最小のHTMLをファイルとして保存して開き、画像を選ぶと、3つの幅で並べて表示します。

html
<!doctype html>
<meta charset="utf-8">
<input type="file" id="f" accept="image/*" multiple>
<div id="out"></div>
<script>
const sizes=[320,160,96];
document.getElementById('f').onchange=e=>{
  const out=document.getElementById('out'); out.innerHTML='';
  for(const file of e.target.files){
    const url=URL.createObjectURL(file);
    const row=document.createElement('div');
    row.style.cssText='display:flex;gap:12px;align-items:flex-end;margin:12px 0';
    for(const w of sizes){
      const img=new Image(); img.src=url; img.width=w; row.append(img);
    }
    const cap=document.createElement('span'); cap.textContent=file.name; row.append(cap);
    out.append(row);
  }
};
</script>

数値はCSSピクセル(画面上の表示幅)の目安です。実際の一覧でのカードの大きさは、作品一覧を自分で開いて確かめてください。この段階で文字が読めなかった画像は、実験の前に文字を大きくするか太くします。「読めない文字」は、食い違い以前の問題だからです。

手順:3つの課題を順に行う

協力者は、条件ごとに5人以上を目安に集めます。統計的な保証が得られる人数ではありません。傾向を見るための最低ラインと考えてください。家族、友人、同じ制作仲間など、この作品を事前に知らない人を選びます。

重要な前提として、同じ人に複数の条件を見せると、前の画像の記憶が次に影響します。可能なら、1人には1条件だけを割り当てます。人数が足りないときは、条件の順番を人ごとに入れ替えます(Aから始める人、Bから始める人、Cから始める人を同数にします)。

課題1:名前を答える(想起)

  1. 協力者にカバー画像を10秒間だけ見せます。「ゲームのカバーです」とだけ伝え、作品名は教えません。
  2. 画像を隠し、別の簡単な質問(好きな色など)を挟んで1〜2分置きます。
  3. 「さっきのゲームの名前は何でしたか。覚えている通りに言ってください」と聞き、答えをそのまま書き取ります。

言い直しや、「えっと、たしか…」といった迷いの言葉も記録します。

課題2:一覧から探す(探索)

  1. 作品名だけを書いた紙(または画面)を用意します。名前は登録名の「月影ロード」で統一します。
  2. 6〜8枚のカードを並べた一覧を用意します。カードは、カバー画像と登録名を並べた形にします。実際のアソバースの一覧に近い配置が望ましいです。自作のモックでも、他の作品のカバーを混ぜた簡単な一覧でも構いません。
  3. 「この名前のゲームを探してください」と頼み、見つけるまでの秒数を計ります。

ここで見せるカバーは、協力者に割り当てた条件(A・B・C)のものです。課題1で見せた画像と同じものにします。

課題3:同時に見て感じること(迷い)

  1. カバーと登録名を並べて見せ、「この二つは同じゲームのことだと思いますか」と聞きます。
  2. 「はい」「いいえ」「分からない」のどれかを選んでもらい、答えるまでの秒数を計ります。
  3. 最後に自由回答で、「少しでも引っかかった点はありましたか」と聞きます。

課題3は、Aの条件では「迷い」がほぼ出ないはずです。Aを置く意味は、迷いの基準線をつくることにあります。

記録の取り方:何を、どの単位で、何回

記録は、1人1行の表にします。

  • 1、条件:A、課題1で答えた名前:、課題2の秒数:、課題3の回答:、課題3の秒数:、自由回答:

記録のルールは次のとおりです。

  • 秒数は、スマートフォンのストップウォッチで0.1秒単位まで測ります。同じ道具を全員に使います。
  • 課題1の答えは、言い直しも含めて原文のまま残します。要約すると、判断が後でぶれます。
  • 課題2で見つけられなかった場合は、「未達」と書き、秒数の欄には打ち切った時間(たとえば60秒)を記します。
  • 記録は、実験の最中に書きます。あとで思い出して書くと、自分の仮説に寄った記憶になりがちです。

課題1の答えは、次の4つに分類して集計します。

  1. 登録名と一致する答え
  2. カバー内の文字と一致する答え
  3. 両者の混ざった答え
  4. 覚えていない

結果の読み方:どうなればどう判断するか

ここでは結果を書きません。結果が出たときの読み方の目安だけを示します。

課題1の分類を見るとき

  • 条件Bで「カバー内の文字と一致する答え」が多い場合は、見た人の記憶がカバーの文字に引きずられているということです。登録名を同じ表記に寄せる、またはカバーの文字を登録名に合わせる検討に値します。
  • 条件Cで「覚えていない」が多く、条件Aでは少ない場合は、カバー内の文字が名前の記憶を支えていると読めます。文字なしを選ぶなら、名前を目にする別の機会が必要になります。
  • 条件AとBに大きな差が見えない場合は、少なくとも今回の画像と人数では、食い違いが名前の記憶にそれほど影響しなかったということです。ただし、人数が少ないので、断定は避けます。

課題2の秒数を見るとき

  • 条件Bの秒数が条件Aより明らかに長く、未達も増える場合は、探す手がかりとしてカバーの文字が強く働いているということです。登録名で探す人にとって、カバーの文字は邪魔になっている可能性があります。
  • 秒数の差が小さく、ばらつきの範囲に収まる場合は、一覧の他の要素(絵柄、色)で見つけている可能性があります。この場合、カバーの文字の一致よりも、絵柄の目立ちやすさを見直す価値があります。

課題3の回答を見るとき

  • 条件Bで「分からない」「いいえ」が出る場合は、そもそも同じ作品と認識されていません。表記の食い違いが、読みや言語の違いにとどまっていても起こるかどうかが、ここで分かります。
  • 自由回答に「どちらが正式な名前か気になった」といった言葉が出た場合は、数値に表れない迷いの証拠です。数値が同程度でも、こうした言葉が複数出たなら、揃えておくほうが無難です。

最終的な判断は、「どちらを正とするか」を一つ決めることです。目安として、登録名を変えにくい事情があるなら、カバーの文字を合わせます。カバーの絵を作り直しにくいなら、登録名を合わせます。

誤りやすい点

実験を始める前に、起こりやすい失敗を確認しておきます。

  • 条件が複数同時に変わっている:文字の中身だけでなく、色や配置まで変わると、原因を特定できません。
  • 協力者がこの作品の名前を事前に聞いている:制作仲間や、普段から作品の話をしている人は避けます。名前を知っている人は、食い違いを補って読んでしまいます。
  • 質問が誘導的になっている:「カバーの文字と名前が違いますが、気になりますか」と聞くと、気づいていなかった人にも気づかせてしまいます。課題3以外では、食い違いに触れないでください。
  • 言語設定を見落とす:アソバースは日本語と英語の表示切り替えに対応していますが、作者が入力した作品名や紹介文は書き換えません。つまり、カバー内の文字が英語で、登録名が日本語のままだと、表示言語を切り替えても食い違いは残ります。英語表示の人に向けた作品なら、どちらの言語で名前を登録するかを、カバーの文字とあわせて決める必要があります。
  • 縮小時に読めない文字を評価に含める:先ほどの縮小プレビューで読めなかった画像を使うと、「文字が読めない」ことの影響と「食い違い」の影響が混ざります。

公式作品のカバー画像は生成したアートワークで、ゲーム画面のスクリーンショットではないと案内されています。また、作品ごとにタイトルの文字組み(縦組みの明朝、手描き文字、郵便ラベル、夜の標識、光の幾何学、メニュー風など)が異なります。ここから読み取れるのは、文字組みが作品の雰囲気を伝える役割を担っているということです。雰囲気を優先して文字を装飾するほど、読みやすさや登録名との一致をどう保つかが設計上の課題になります。各作品のカバー内の文字と作品名がどう対応しているかは、作品一覧を開いて自分の目で確かめてください。

次の行動

まず、自分の作品のカバー画像と登録名を並べ、文字が一致しているかを確認してください。食い違いがあるなら、条件A・B・Cの3枚を作り、縮小プレビューで読めることを確かめたうえで、身近な5人から始めてみましょう。結果の表ができたら、読み方の目安に照らして、カバーか登録名のどちらを直すかを一つ決めてください。