SECTION 9創作的アーティファクト · サイバーパンク HUD · 低リスク
攻殻機動隊、The Matrix、Metal Gear Solid、新世紀エヴァンゲリオンに着想を得た、シングルページのオペレータ・ダッシュボード。プロダクトとしてではなく、個人的なアーティファクトとして作られた。トラッキングなし、アナリティクスなし、バックエンドなし — ただ HTML、CSS、JS、それに少しの CDN フォントだけ。眺めて、歩き回って、イースターエッグを打ち込んで、終わったら閉じてくれればいい。
01 これは何か
オペレータの HUD：存在しない架空のユニットのためのシミュレートされたコマンドインターフェイス。スカッド・ロースタは、作者のマシン上で実際に動いているサービス（Hermes、Batou、Watchdog、MCPs）を、公安9課の人員として再スタイル化したもの。思考戦車たちは実際の Model Context Protocol サーバである。MAGI の投票は象徴的。コーデックの周波数は冗談。
これはラブレターである。とりわけ 公安9課 という美学とドクトリン — ネットワーク上の異常を見張る、専門家による小さなユニットというアイデア — に対して、そして、その視覚文法を我々に与えた 4 作品に対して。
02 クレジット — 出典
士郎正宗（漫画）、押井守（1995 年映画）、神山健治（STAND ALONE COMPLEX）。出典：公安9課、タチコマ、草薙少佐、バトー、ゴーストラインの対話、「ネットは広大無辺」、作品全体の中心的な問いを与えた人形使いのアーク。
ウォシャウスキー姉妹。出典：緑のデジタル雨、「目を覚ませ」、白うさぎ、カンフー、赤／青の薬、ザイオン、トリニティ、モーフィアス、コンストラクト、そしてオペレータがスクリーンの前でネット内のアバターを見るという中心イメージ。
小島秀夫。出典：FOXHOUND、コーデック周波数、ダンボール箱、「待たせたな、え？」、CQC、警告モードの感嘆符、ナノマシン、戦術諜報作戦、Patriots と La-li-lu-le-lo、そしてステルスゲームの内部に政治的思考実験を配置するという伝統まるごと。
庵野秀明（Studio Gainax / Khara）。出典：NERV、橙と黒の色彩論理、A.T.フィールド、MAGI システム（バルタザール／メルキオール／カスパー）、SEELE の十二の石碑、pattern blue、ロンギヌスの槍、そしてオペレータ UI を実存的恐怖への窓として扱うという発想まるごと。
03 スタック
- HTML / CSS / JS
- vanilla、フレームワークなし、ビルド・ステップなし
- フォント
- Orbitron · JetBrains Mono · Noto Sans JP（Google Fonts CDN）
- 3d dive
- three.js v0.160（呼び出されたときのみ遅延読み込み）
- オーディオ
- Web Audio API · 二オシレータのドローン · OscillatorNode によるビープ
- 永続化
- localStorage（訪問回数、最終訪問のタイムスタンプ）— それだけ
- フィンガープリント
- canvas 由来のハッシュ · 楽しみのために表示 · 保存はしない
- アクセシビリティ
- WCAG 配慮 · スキップリンク · prefers-reduced-motion を尊重
- pwa
- マニフェストは inline · インストール可能
- パフォーマンス
- requestAnimationFrame をスロットリング · idle モード · オーバーレイ時は一時停止
- バックエンド
- なし
- アナリティクス
- なし
- トラッキング
- なし
04 ソース
ソースコード、issue、議論は GitHub で。タイポを見つけたり、使徒を追加したかったり、もっと良いダンボール箱の ASCII を持っていたら、Pull Request を歓迎します。
B が、Claude Code（Anthropic の CLI）と反復的なペアプログラミングをして構築した。半島スペイン語、ゴーストライン安定、戦術目標：余暇のサイクルで創作的なアーティファクトを構築すること。
05 イースターエッグ — 動かし方
COMMAND // INPUT ボックス（HUD の右上）にコマンドを入力して Enter を押す。だいたい 70 個ある。ヒントは 6.5 秒ごとにローテーションする。フルリストは [ ? ] HELP で。
最初に試す好きなものたち：ramiel、tabris、dive、foxhound、kojima、seele、kept you waiting（snake でも可）、follow the white rabbit（rabbit でも可）、それに nanomachines。さらにコナミコード（↑↑↓↓←→←→ B A）。
NETWORK TOPOLOGY パネルの 7 つのノードのいずれかをクリックして、資料を開く。5 つのスカッド・カードはクリック可能。6 つのタチコマもクリック可能。右カラムの 5 つのアクション・ボタン（[PING]、[QUERY]、[DEPLOY]、[INCOMING?]、[REFRESH]）はすべて何かをする。左上のオーディオ・トグルは本物の Web Audio。
06 ライセンス / 免責
コードは MIT ライセンス（GitHub リポジトリを参照）。視覚的な参照と引用は、それぞれの作者と権利者に対するトリビュートであり、フェア・ユース／変容的な作品の原則のもとで使用されている。これはファン・アートであって、商業ではない。金銭は誰の手にも渡らない。データは収集されない。上記でクレジットされた 4 つの源流作品の根幹となる権利について、いかなる主張もしない。
「我々が見聞きするものは、我々の記憶によって形作られる — そして我々の記憶は、見聞きするものによって形作られる。」 — 草薙少佐 // 攻殻機動隊（1995、言い換え）