「言語化できるものは、全て作る。」——これは私たち電脳技巧集団(AI職人ギルド)のモットーだが、言葉で終わらせては意味がない。今回は、その一例として作ったMLB(メジャーリーグ)速報オーバーレイの制作過程を、設計判断と一緒に開示する。実験的なプロジェクトだが、私たちのAI駆動開発の進め方が、そのまま出ている。
01何を作ったか
作ったのは、野球中継に重ねるリアルタイム速報オーバーレイだ。スコア・カウント・走者・打者成績を、ゲーム実況風のグラフィックで描き、試合の動きに合わせて更新する。配信ソフト OBS の Browser Source(1920×1080 / 30fps)にそのまま読み込める。第一形態は YouTube Live 向けの横 16:9、将来は TikTok / Instagram 向けの縦 9:16 へ。
逆転、サヨナラ、ホームラン、161km/hの剛速球——試合の見せ場では割り込みポップが走る。走者は背番号でなく実名で出る。延長戦にも追従する。「ただ数字を出す」ではなく、観ていて気持ちのいい速報を目指した。
02一日で完走できた理由:データ層と表示層を分ける
速いだけのプロジェクトは、たいてい後で崩れる。今回が一日で破綻なく完走できたのは、最初にアーキテクチャを固定したからだ。具体的には、データ層と表示層をはっきり分けた。
外部APIから試合データを取り、poller が拾い、normalize が画面比率にも媒体にも依存しない正規化State(GameState)に整える。そこから試合・選手のイベントを判定するトピックスエンジンを通し、WebSocket でオーバーレイに流す。オーバーレイは、ただ render(state) するだけ。
この「表示層は正規化Stateだけを受けて描く」という一線を最初に引いたことが、後のすべてを楽にした。見た目とロジックが、最初から絡まっていない。
03縦も横も、同じデータから
分離設計の配当は、すぐに返ってきた。16:9(YouTube)と 9:16(TikTok/IG)は、同じ GameState を別レイアウトで描くだけでいい。縦型対応は「表示層を新規で足す」だけで済み、データ層はまるごと流用できた。ロジックの二重化はゼロ。
さらに、State契約はadditive(追加方式)で拡張した。既存の bases を残したまま、走者の実名を持つ runners を足す。古い配線を壊さず、新しい配線を後追いできる。手戻りゼロは、運ではなく設計の結果だ。
04実試合を待たない「replayモード」
配信オーバーレイの開発には、地味だが大きな壁がある。実際の試合がないと、動きを確認できない。深夜に試合がなければ、UIの作り込みは止まる。
そこで、poller に live と replay の2モードを持たせた。保存した試合データを、野球の最小進行単位である投球ごとに再生する。開発用フィクスチャに選んだのは、大谷翔平の試合(gamePk 777657、10回裏サヨナラの6-5)。実試合がない時間でも、逆転やサヨナラの瞬間を何度でも再現してUIを詰められる。
「試合を待つ」から「試合を呼び出す」へ。開発のボトルネックを、設計で消した。
05「動いてるはず」を、許さない
AIに実装を任せると、最後に効いてくるのは検証だ。コードが通っても、画面が崩れていたら意味がない。だから今回は、「動いてるはず」で終わらせず、実画像で確認するループを回した。
自前の WebSocket クライアントでデータの受信を確かめ、さらにヘッドレスChrome(playwright)で実際のCSS描画をスクリーンショットする。逆転・サヨナラ・本塁打・剛速球の割り込みポップ、走者の実名表示、延長回、デモが壊れていないこと——ぜんぶ実画像で目視した。テストは normalize 20本・topics 9本・replay 8本の計37本がパス。
06司令塔と、つくり手を分ける
この一日を支えたのは、技術設計だけではない。進め方そのものだ。CAGでは、役割をはっきり分けている。
- 司令塔:方針を整理し、設計し、タスクを分解し、「そのまま渡せる指示文」に落とし、結果を検証する。
- つくり手:ターミナル・Git・コードを動かし、実装とテストを回す。
考える主体と、手を動かす主体を分ける。すると、それぞれが自分の仕事に集中でき、引き継ぎは曖昧な口頭でなく、構造化された指示文になる。AIを一台で抱え込むのではなく、役割で束ねて、チームとして動かす。これがCAGのAI駆動開発の芯だ。
07従来の人月なら、どうなるか
ここまでの設計・実装・検証を、もし従来の専門職が人月方式で受けたら——どれだけの工数と費用になるだろう。あくまで想定・概算だが、目安を置いてみる。
規模を分解すると、要件定義・設計、バックエンド(poller/正規化/トピックス/WebSocket)、フロント(オーバーレイ描画を 16:9 と 9:16 の二系統)、replay、テストと検証、そしてPM。控えめに見ても2〜3人月はかかる構成だ。システム実装の人月単価(60〜300万円/人月)の中位で積むと概算200〜400万円、納期は設計の往復と分業の待ちを含めて2〜3ヶ月。しかも見積りは「設計一式」「開発一式」と"一式"に丸められがちで、修正のたびに追加請求になりやすい。
電脳技巧集団(AI職人ギルド)は、同じものをAI駆動で実働1日級に畳んだ。司令塔が設計と分解と検証を担い、つくり手が実装を回す。価格をつけるなら成果物 × 定価 + AI実費パススルー——内訳はすべて開示し、"一式"は使わない。速さも、安さも、透明さも、同時に成り立つ。
| 観点 | 従来(人月方式) | 電脳技巧集団(AI職人ギルド) |
|---|---|---|
| 想定工数 | 2〜3人月 | AI駆動で実働1日級 |
| 納期 | 2〜3ヶ月(設計往復・分業の待ち) | 最短 |
| 概算金額 | 200〜400万円(“一式”になりがち) | 成果物×定価 + AI実費パススルー |
| 見積りの透明性 | 内訳が見えにくい | “一式”表記ゼロ・内訳を開示 |
| 体制 | 多重下請け・分業 | 司令塔 × つくり手の一気通貫 |
| 修正対応 | 追加工数=追加請求 | 高速サイクルで都度反映 |
※ 従来側は本制作物の規模(要件定義〜実装〜テスト〜PMで2〜3人月想定)と公開相場の人月単価から置いた概算。CAG側は本事例の実働を基にした目安。
08これは、CAGの“動く証拠”
MLB速報オーバーレイは、実験的なプロジェクトだ。だが、ここに出ているものは実験ではない。データと表示を分ける設計、手戻りを生まない契約、実試合を待たないreplay、実画像で詰める検証、司令塔とつくり手の分業——どれも、私たちが受注案件で使っている作法そのものだ。
「言語化できるものは、全て作る。」私たちは、それを言葉でなく、動くもので示したい。次にあなたが言語化したいものは、何だろう。


