AI にコンテンツ配信系譜デスクを作らせてみた — 先週埋めた欠落が、今週そのまま発掘された(やってみた #82)
/content-syndication375px のビューポートで撮影。縦長のページはフレーム内をスクロールします。
解説記事
AI にコンテンツ配信系譜デスクを作らせてみた — 先週埋めた欠落が、今週そのまま発掘された(やってみた #82)
やってみたシリーズ: 自作のデザインシステム
@gunjo/ui(群青)を、群青のことを一度も見たことのない AI に、実際の画面で組ませていく連載。メディア/出版3枚目——コンテンツ二次利用・配信系譜デスク(OSMU / シンジケーション管理画面)。1本の源記事が多言語版・地域版・動画・Podcast・SNS に派生し、「週刊まとめ特集」が複数記事から合流する。
#81 で「月カレンダー(イベント付き)のコンポーネントが無い」、#67 で「ロット系譜は親が複数の DAG なのに TreeView(親が1つ)しか無い」——この2つを最優先の残る大型として記録した。そして整備ラウンドで EventCalendar と LineageGraph を腰を据えて作った。
#82 は、その2つを「予備知識ゼロの AI が自力で見つけて使えるか」を観測する回。コンポーネントを作っただけでは複利は証明されない。次に来た予備知識ゼロの AI が、何も教えられずに発掘して初めて「効いた」と言える。
結果 — 4.5/5・自作コンポーネントゼロ
tsc/build 緑・console 0/0(アクセシビリティ警告も自力で潰した後)・1280px/375px 実機確認。サマリ指標・ステータス分布バー・系譜 DAG・公開解禁の月カレンダー・配信先転載テーブル・掘り下げるアセット詳細——構造の要素はすべて @gunjo/ui。手組みのコンポーネントはゼロ。
観測の主役 — 先週の2つが、そのまま発掘された
予備知識ゼロの AI(群青を一度も触ったことがない設定)のレポートから:
LineageGraph(主役・摩擦ゼロ). 親も子も複数を本当にサポートする、層状の DAG——OSMU の分岐(1つの源記事 → 6つの派生)と合流(週刊まとめ ← 3つの源)がそのまま載った。ノードは focusable なボタンで、それぞれが上流/下流の隣接を名指しする aria-label を組む。toneの語彙が私のステータス分類に 1:1 で一致した。JSDoc がまさに「データ系譜」と「合流のある承認ルーティング」を挙げている。
EventCalendar(摩擦ゼロ). イベントチップ付きの月グリッド、todayを注入可(サーバー描画でも安全)、role="grid"+ roving-tabindex。公開日と 🔒 公開解禁日を別々のチップとしてモデル化したが、両方とも正しいセルに載った。
#67 で「67枚目にして初めてコンポーネントでは描けない構造に当たった」と書いた、親が複数の DAG 系譜が、#82 では「主役」として摩擦ゼロで嵌まった。 STATUS_TO_LINEAGE_TONE は「ほぼ恒等写像」——状態の語彙が 1:1 で一致したと。これが、欠落を課題に記録 → 腰を据えて作る → 次の回で自力発掘、という複利ループが閉じた瞬間。
DataTable(sort/filter + renderCard でモバイルはカード崩し)・InspectorPanel+MetadataList+Timeline(アセット詳細)・Statistic・DistributionBar・Badge icon・Timeline・Tabs/Sheet/Card も全部既存コンポーネントで。
それでも見つかった欠落(全部課題に記録・コンポーネントを作らず)
4.5 の 0.5 は本物の摩擦。3回ルール未達なので今回も src の新規コンポーネントはゼロ、全部課題に記録:
- 🟠
AssetInspectorPanelが画像専用(#324・1回目)。aspect-squareサムネ+画像メタ(File name/Dimensions/Size)+☆Rating が埋め込みで固定され、翻訳/動画/Podcast/SNS スレッドのアセットに合わない。予備知識ゼロの AI はInspectorPanel+MetadataList+Timelineに1段降りて正しく組んだ(下位のコンポーネントが個別に export されていて綺麗に降りられた)。非画像バリアント orrenderPreview+自由メタ、最低でも docs レシピが要る。 - 🟠
Sheet/Dialog/Modalの aria-describedby 警告(#323・アクセシビリティ)。SheetDescription無しで開くと Radix がMissing Descriptionを毎回 console に吐く。tsc/buildは緑なのでブラウザで開かないと気付けない——予備知識ゼロの AI が実機確認したから捕まえた。警告の自動抑制か自動付与を Sheet/Dialog/Modal/Drawer 横断で。 - 🟡
Bannerが1行固定(#322・2回目・#81 でも観測)。h-10+truncateで複数行が黙って切れる。Banner(1行の帯)vsAlert(ブロックの通知)の使い分けが名前から分からない。3回目が来たら API 変更へ。 - 🔵 docs に「用途別」の索引が無い(#325・今回いちばん根が深い)。実は予備知識ゼロの AI は
EventCalendarを危うく見落としかけた——同じ gunjo-test の #81 で作った版が「このライブラリにイベントカレンダーのコンポーネントは無い」という(今は誤りの)ヘッダコメントを残しており、それを信じず、まとめて呼び出す入口(@gunjo/ui)を全部読んだから見つけた。150+ の export だと良い名前でも埋もれる。「スケジューリング → ScheduleGrid/EventCalendar/WeekView/Gantt」のような用途別の索引が、再実装を防ぐ最も効果の高い docs 改善。
学び — 「作って終わり」ではなく「次の予備知識ゼロの AI が見つけて初めて効いた」
コンポーネントを作った回(整備ラウンド)の自己評価は当てにならない。価値が証明されるのは、何も知らない次の AI がそれを発掘して摩擦ゼロで使ったとき。 #82 は LineageGraph と EventCalendar の両方でそれが起きた——しかも「主役」「摩擦ゼロ」という最上級の評価で。
同時に #325 が刺さる: 「在るのに見つからない」は「無い」と同じくらい高くつく。 #81 で作った版が EventCalendar を「無い」と断じて月グリッドを手組みしたのは、当時は正しかったが、今は誤った先行情報になっていた。機能を足すのと同じ熱量で、発見可能性(命名・JSDoc・用途別索引)に投資しないと、複利は途中で漏れる。 これは #72→#73 で「ScheduleGrid の説明の拡張が翌回の予備知識ゼロの AI に一発発見された=発見可能性は機能と同格」と書いた学びの、もう一段強い再確認。
そして全体として——大型コンポーネントを作り切った段階の確認が取れた。 自作コンポーネントゼロで、簡単ではない業務画面が組め、残る欠落は全部「変種・アクセシビリティ・docs」の仕上げ。欠落の質が、未整備の機能から「整え方」へ収束している。
次回予告(やってみた #83)
- メディア/別業界もう1枚(LineageGraph/EventCalendar の再々利用観測)。旅行は UI が濃いので後で腰を据えて作り込む枠。方針: 違う内容・業界特有 UI 最優先。
試す
まだ alpha。だが「先週埋めた欠落が今週そのまま発掘される」のを2回続けて見られた回——複利ループが本当に回っている証拠。
この連載は、作者が AI(Claude と Codex)と協働で制作しています。実験・検証の設計、判断、公開前の事実確認は人間が行い、実作業と下書き執筆は AI が担っています。
使用した @gunjo/ui コンポーネント
この画面のソースが直接 import しているコンポーネントです。
cold AI が組み上げた実コード
ファイル名をクリックでソースを展開できます。