#113スコア 4/5運輸:航空

AI に航空の運航管理を作らせてみた — 3画面で手組みされた「機材繰りバー」が、ついに Gantt に入った(やってみた #113)

ルート: /flight-operations
デスクトップ表示
モバイル表示

375px のビューポートで撮影。縦長のページはフレーム内をスクロールします。

解説記事

AI に航空の運航管理を作らせてみた — 3画面で手組みされた「機材繰りバー」が、ついに Gantt に入った(やってみた #113)

⁠やってみたシリーズ⁠: 自作のデザインシステム @gunjo/ui群青)を、群青のことを一度も見たことのない AI に、実際の画面で組ませていく連載。⁠航空の事業者側1枚目⁠——⁠運航管理(OCC)/ 機材繰り⁠(運航ボード・機材ローテーション・不正常運航アラート)。

航空の利用者向け(フライト予約 #112)に続く事業者側。観測の本命——⁠機材繰り(各機の1日=便→折返し→整備の連なり)が、Gantt の区切り付きバーの欠落(#354・現在2/3)の3回目になるか。⁠

結果 — 4/5、そして Gantt segments の3回目が発火

tsc/build 緑・375px・0 console error。KPI・運航ボード・機材繰り・不正常運航アラート。予備知識ゼロの AI(群青を一度も触っていない設定)のレポート:

⁠6面のうち5面はそのまま使えた⁠StatGroup(KPI)・ActionQueue(不正常運航=「これがまさにそのコンポーネント・運航整理の選別のために書かれている」)・DataTable(運航ボード・renderCard でモバイル)・Drawer+MetadataList+RouteStops(機材ローテを drawer に)。⁠唯一の本当の欠落=機材繰りタイムライン。⁠ Gantt は正しいコンポーネント族だが、曲げる必要があった。segments[] が無い⁠——GanttItem は単一の {start,end,tone,label} で、1本のバーが 便→折返し→整備 の内部分割を持てない。「⁠各機の1日を複数の隣り合うバーで模した⁠。機材繰りを標準で扱うには、1 item の中に segments:{start,end,tone,label,kind}[] と 折返し(turnaround)の概念が要る」。

⁠3回連続⁠——交番 #107(仕業=出区/乗務/折返し/入区)・検査計画 #108(入場/検修/出場整備)・機材繰り #113(便/折返し/整備)、⁠別々の3人の予備知識ゼロの AI が独立に「1本のバーを分割したい」を手組み⁠。3回ルール発火。⁠Gantt を拡張した。⁠

作る — Ganttsegments[]

{ id, rowId, start, end, label, segments: [
  { start, end, tone: "info", label: "NH055 HND→CTS", kind: "便" },
  { start, end, tone: "muted", kind: "折返し" },        // 隙間はバーの track に
  { start, end, tone: "warning", label: "ライン整備", kind: "整備" },
]}
  • 1本のバーが内部の小区間を tone 別に持つ=⁠機材繰り(便→折返し→便→整備)・乗務員行路(出区→乗務→入区)・入出場(入場→検修→出場)⁠を1 item で表現。隙間(折返し)はバーの土台部分として見える。
  • kindlabel をバーの読み上げ名に畳み込み。⁠後方互換⁠(segments 無し=従来の単一塗り)。
  • #354 の segments 半分を解消(PR#360・実機で3機5/3/3 セグメント・時間計算どおり左→右配置・アクセシビリティに全セグメント畳み込み・0 error)。

⁠残り半分=時間軸(日中の時刻軸)。⁠ #113 は「Gantt の軸が日カラムで、時刻の目盛りが無く、日中の機材繰りには時刻ルーラーを手組みした」とも指摘。axisUnit:"hour" は別の(確信度が一段低い)要望——交番 #107+機材繰り #113 で 2/3。#354 に残して、次の日中の時間軸画面で確認する。

⁠今回 src で作ったもの = Gantt segments[]⁠(3回目)。⁠ActionQueue が不正常運航に5回連続で再発掘⁠

学び — 事業者向けのモード固有の土台も、3回ルールで固まる

全業種共通の土台(StatGroup/AmountBreakdown/ActionQueue/ListCard)は業種をまたいで一気に効く。一方 ⁠Gantt segments は「リソースのタイムラインを持つ業種」のモード固有の土台⁠——鉄道の交番・車両検査、航空の機材繰り、で2業種3画面に渡って同じ「バーを分割したい」が出て、3回目で固まった。SeatMap(座席選択・2/3)・TransitItinerary(区間中心の経路・1/3)・Stringline(運行図表・1/3)と同じ「モードをまたいで証拠が貯まる」パターン。⁠3回ルールは、全業種共通の土台も、モード固有の土台も、同じ閾値で選り分け続けている。⁠ そして予備知識ゼロの AI が「segments[] が要る」と API まで設計してくれるから、コンポーネント化は推測でなく転記。

次回予告(やってみた #114)

  • 航空の事業者向け 2枚目(クルーペアリング・スポット管理)or 次のモード(バス/タクシー/トラック配送の事業者向け/利用者向け)。SeatMap 3回目・Stringline/TransitItinerary 2回目の観測も継続。

試す

3画面で手組みされた機材繰りバーが、その場で Gantt に。モード固有の土台も、3回ルールで固まる。

この連載は、作者が AI(Claude と Codex)と協働で制作しています。実験・検証の設計、判断、公開前の事実確認は人間が行い、実作業と下書き執筆は AI が担っています。

使用した @gunjo/ui コンポーネント

この画面のソースが直接 import しているコンポーネントです。

cold AI が組み上げた実コード

ファイル名をクリックでソースを展開できます。

業界別「AI指示書パック」、先行登録を受付中です。