誰にでも、あのフォルダはある。中途半端なチュートリアルや、放置されたサイドプロジェクト、そして期待ばかりが膨らんだREADMEファイルが詰め込まれたフォルダだ。それは「善意の墓場」であり、そこから抜け出す唯一の方法は、実際に動作するもの——何でもいいから——を形にすることだ。
「完成させたい」というあの衝動が、LIARの誕生を突き動かした。これは、わずか28KBのHTMLファイル1つに収まるほど小さく、そして容赦のないブラウザゲームだ。フレームワークなし。画像ファイルなし。サウンドアセットなし。あるのは生のHTML5 Canvas、Web Audio API、そして意地悪な性格だけだ。
アンチ・チュートリアル
多くの学習プロジェクトが失敗するのは、プロジェクトが肥大化してしまうからだ。キャンバスのチュートリアルから始まり、移動スクリプトを追加し、次にタイルエディタが必要だと判断し、さらにエンティティ・コンポーネント・システムを導入し、最終的にはコンパイルに11秒もかかるWebpackの設定にまで手を広げてしまう。6週間後には、ビルドパイプラインは完成しているが、ゲームは一つもできていない。
LIARはその罠を拒絶する。これはリアクションゲームだ。ボタンが「TAP（叩く）」、「HOLD（長押し）」、あるいは「DON'T（何もしない）」と指示してくる。タイマーが切れる前にアクションを起こすのだ。序盤のラウンドは信頼を築くためのものだ。テキストに「TAP」とあれば叩く。「HOLD」とあれば指を押し続ける。シンプルでリズムが良く、ほとんど瞑想に近い。
そして、第6ラウンドがやってくる。
裏切りのメカニクス
第6ラウンドあたりから、ゲームは嘘をつき始める。画面にコマンドが点滅する。例えば、激しく赤く震える「TAP」といった具合だ。準備段階で培った反射神経が、ボタンを押せと叫び声を上げる。もしそれに従えば、負けだ。あの赤い震えはグリッチ（不具合）ではない。それは「サイン」なのだ。誠実な嘘つきはヒントを与えてくれるものだが、このゲームはまさにそれ、つまり「欺瞞の視覚的文法」をプレイヤーに提示している。
この仕掛けが機能するのは、土台が誠実だからだ。序盤のラウンドを通じて、プレイヤーは色や動きが意味を持つことを学習する。パレットが突然変化し、テキストが震え始めたとき、ゲームはズルをしているのではない。シグナルを送っているのだ。情報は提示されていた。それを読み取ったか、読み取らなかったか、それだけのことだ。
失敗すると、ゲームはプレイヤーを侮辱する。その痛みは意図的なものだ。リーダーボードも永続的な進行要素もないマイクロゲームにおいて、屈辱こそがリプレイ性を生み出す通貨なのだ。それがフィードバックループを完結させる。ラグのせいでも、当たり判定（hitbox）のせいでもない。震える赤い文字を信じてしまったから負けるのだ。そしてゲームは、プレイヤーにそのミスをしっかりと噛み締めさせる。
28KBが真に意味するもの
単一の28KBのHTMLファイル内に構築することを選択したのは、単なる目新しさのためではない。それは、困難な決断を強いる設計上の制約なのだ。背後に隠れるための数メガバイトものスプライトシートはない。トリガーすべきオーディオファイルもない。目に見えるものすべては、HTML5 Canvas上にフレーム単位で描画される。耳に聞こえるものすべては、Web Audio APIのオシレーターから生成される。
もしWeb Audio APIを直接扱ったことがないのであれば、それが何を意味するかを説明しよう。事前に録音されたWAVやMP3を読み込む代わりに、コード内でAudioContextを作成し、オシレーターノードをアタッチし、波形（サイン波、矩形波、のこぎり波）を選択して周波数を設定する。正解なら短いビープ音、失敗なら耳障りなバズ音。これらの音はブラウザによってリアルタイムで計算される。ファイルサイズを消費せず、外部へのネットワークリクエストも発生しない。
同じ論理がビジュアルにも適用される。Canvasは即時モード（immediate-mode）の描画サーフェスを提供する。矩形をクリアし、テキストを塗りつぶし、震えのエフェクトのために変形（transform）やシャドウブラーを設定する。Virtual DOMの差分比較も、Reactの再構築（reconciliation）も、デバッグすべき依存関係配列（dependency array）もない。ブラウザがコードを実行し、ピクセルが現れる。これほど特化したゲームにおいて、その直接性は制限ではなく、一つの特徴なのだ。
ペイロードを28KBに抑えることは、モバイルブラウザにおいて、たとえ不安定な接続環境であっても、ゲームがほぼ瞬時にロードされることも意味する。ホスティングコストは実質ゼロだ。アプリケーション全体が、ほとんどのウェブサイトのファビコンよりも小さい。共有リンクで配布したり、フォーラムに埋め込んだりする場合、この差は大きい。インストールの摩擦（手間）は一切ない。URLにアクセスした瞬間、嘘の準備は整っている。
公平な欺瞞
嘘をつくメカニクスに時間をかけることで、ゲームデザインに関する微妙な真実が見えてくる。不公平さが「楽しさ」に変わるのは、それが「読み取れる」ときだけだ。警告なしにプレイヤーを殺すランダムな罠は、悪いデザインだ。しかし、振動し、色を変え、確立された視覚的リズムを崩す罠は、待ち伏せの姿をしたパズルなのだ。
赤く震えるテキストには、複数の目的がある。それは、プレイヤーが第1ラウンドから第5ラウンドにかけて身につけた習慣的な反応を上書きする。そして、それまで反射神経のテストであったものに、疑念、躊躇、パニックといった感情的な拍動をもたらす。そして最も重要なのは、失敗を「自分の責任」と感じさせることだ。赤いコマンドを叩いて侮辱が表示されたとき、プレイヤーは自分の過ちだと理解する。ゲームはサインを出していた。それを読み取れなかったのは、自分自身なのだ。
これは卑怯な一撃と公平な戦いの違いだ。LIARはあなたの顔を殴りに来るが、そのスイングにはまずしっかりと体重を乗せてくる。
磨き上げよりも、まずはリリースを
このゲームは粗削りだ。作者自身もそう認めている。これは彼にとって初めて完成させたゲームであり、シンプルさは完成させるための代償だった。開発者が、製品化されることのないシステムについてブログを書くことが多いエコシステムにおいて、その正直さは新鮮だ。LIARはライブURL上に存在する。今すぐプレイできる。モノレポを解きほぐす手間もなく、単一のファイルでソースコードを確認できる。
開発者は、勇気を持って挑戦してくれる人々に2つのことを知りたいと考えている。第一に、どれくらい生き残れるか？第二に、第6ラウンドで最初の嘘が突きつけられたとき、それは公平に感じられるか、それとも卑怯に感じられるか？これこそが問うべき正しい質問だ。彼らは「嘘」をバグとしてではなく、調整が必要なメカニクスとして扱っている。
もし関心があるなら、彼らはCanvasの描画ループ、Web Audioオシレーターの背後にあるロジック、そして嘘のメカニクスがコード内でどのように構成されているかを詳しく解説するガイドを書くことを申し出ている。単一のHTMLファイル内にゲーム全体が収まっている例は極めて稀であることを考えると、そのガイドは「チュートリアルの煉獄（tutorial purgatory）」に陥っている誰にとっても、真に有用なものになるだろう。
真の教訓
ゲームを作るのにゲームエンジンは必要ない。アセットのためのCDNも、20ページに及ぶ設計書も、フレームワークのメンテナーからの許可も必要ない。必要なのは境界線——ここでは28KBと単一のファイル——、そして完成させるための理由だ。制約は明快さを強制する。土台となるメカニクスが堅実であれば、震える赤い文字は、インポートされた千ものスプライトよりも記憶に残るものとなる。
ぜひ自身でLIARをプレイしてみてください: https://playliar.netlify.app/.
開発者による元の解説とソースのコンテキストは、こちらから読むことができます: https://dev.to/shabbir_sesaifee_8fdc587/i-built-a-game-that-lies-to-you-in-a-single-28kb-html-file-no-framework-no-assets-4hnh.