コールドテスト

バスUIのコールドテスト — 運行管理・配車乗務員・接近案内・高速予約・経路検索・乗車券

バス運行管理、配車と乗務員、消費者向け接近案内、高速バス座席予約、経路検索、ダイヤ編成、営収ダッシュボード、安全管理、モバイル乗車券、運行情報、IC残高──toB5+toC6 で対称完走した11枚。Stringline・Gantt-intraday・SegmentedControl・LineChip・Leaderboard が一気に実装した業界です。

運輸:バス の cold test、11 画面のまとめ。

なぜバスUIは難しいのか

バスは鉄道と多くを共有しながらも、固有の作法を持ちます。運行図表(Stringline)の本場、改善基準告示に基づく拘束時間、IC残高主役ブロック、消費者向け接近案内(まもなく到着/あと○分/○つ前)、高速バス座席表(3列独立/4列)、混雑表示の色非依存。toB の運行図表とダイヤ編成は、鉄道で2回手組みしたあとバスで3回目を踏んで Stringline として実装。toC の乗車券は、航空・鉄道で描き込んだキャンバスが消費者側に綺麗に並びました。

ここで群青に加わったコンポーネント

バス11枚で 3回確認を満たして実装に到達したコンポーネントです。toB / toC 双方が同時にキャンバスを描き上げた回がいくつもあります。

SegmentedControl は #156 モバイル乗車券で「2-3等幅の強制配置」として実装。#157 運行情報・#158 IC でその場で自力発見され、複利の最短距離を改めて証明しました。

運輸:バス の全ラウンド

運輸:バス カテゴリの 11 画面を、ラウンド順に並べています。各カードから cold AI が組んだソース、解説記事、デスクトップ/モバイルのプレビューに飛べます。

AI にバスの運行管理を作らせてみた — 30回ずっと足りなかったコンポーネントが、ついに完成した(やってみた #136) preview
#136スコア 4/5
AI にバスの運行管理を作らせてみた — 30回ずっと足りなかったコンポーネントが、ついに完成した(やってみた #136)
/bus-operations

型チェックも通り、デスクトップ向けの密度で完成。群青を一度も触っていない AI の感想:

AI にバスの配車・乗務員管理を作らせてみた — 土台は3モード目でも揺るがず、欠落は「3つ目の軸」を指した(やってみた #137) preview
#137スコア 4.5/5
AI にバスの配車・乗務員管理を作らせてみた — 土台は3モード目でも揺るがず、欠落は「3つ目の軸」を指した(やってみた #137)
/bus-dispatch

`tsc` 緑・デスクトップ密度。予備知識ゼロの AI(群青を一度も触っていない設定):

AI にバスの接近案内を作らせてみた — モバイル消費者土台が3モード目でも丸ごと効いた(やってみた #138) preview
#138スコア 4/5
AI にバスの接近案内を作らせてみた — モバイル消費者土台が3モード目でも丸ごと効いた(やってみた #138)
/bus-approach

`tsc` 緑・375px mobile-first。予備知識ゼロの AI(群青を一度も触っていない設定):

AI に高速バスの座席予約を作らせてみた — 予約土台は丸ごと業界越え、SeatMap は「グリッドは完璧・属性は航空の形」(やってみた #139) preview
#139スコア 4/5
AI に高速バスの座席予約を作らせてみた — 予約土台は丸ごと業界越え、SeatMap は「グリッドは完璧・属性は航空の形」(やってみた #139)
/highway-bus

`tsc` 緑・375px mobile-first・5ステップ予約フロー。予備知識ゼロの AI(群青を一度も触っていない設定):

AI にバスの経路検索を作らせてみた — #126 で作った Itinerary が、別モードで自力発見された(やってみた #140) preview
#140スコア 4/5
AI にバスの経路検索を作らせてみた — #126 で作った Itinerary が、別モードで自力発見された(やってみた #140)
/bus-route-search

`tsc` 緑・375px mobile-first。予備知識ゼロの AI(群青を一度も触っていない設定):

AI にバスのダイヤ編成コンソールを作らせてみた — 連載最大の「作った検証」、手組みされた運行図表がコンポーネントになって帰ってきた(やってみた #153) preview
#153スコア 4.5/5
AI にバスのダイヤ編成コンソールを作らせてみた — 連載最大の「作った検証」、手組みされた運行図表がコンポーネントになって帰ってきた(やってみた #153)
/bus-planning

`tsc` 緑・デスクトップ情報密度。予備知識ゼロの AI(群青を一度も触っていない設定):

AI にバスの路線収支ダッシュボードを作らせてみた — チャートの土台がバス財務に完全に業種を越えて再利用、Leaderboard が2回目(やってみた #154) preview
#154スコア 4/5
AI にバスの路線収支ダッシュボードを作らせてみた — チャートの土台がバス財務に完全に業種を越えて再利用、Leaderboard が2回目(やってみた #154)
/bus-revenue

`tsc` 緑・デスクトップ情報密度・可変データ駆動のチャート。予備知識ゼロの AI(群青を一度も触っていない設定):

AI にバスの安全・事故管理コンソールを作らせてみた — Leaderboard が3回目でコンポーネント化、その場で作った(やってみた #155) preview
#155スコア 4.5/5
AI にバスの安全・事故管理コンソールを作らせてみた — Leaderboard が3回目でコンポーネント化、その場で作った(やってみた #155)
/bus-safety

`tsc` 緑・デスクトップ情報密度。予備知識ゼロの AI(群青を一度も触っていない設定):

AI にバスのモバイル乗車券を作らせてみた — SegmentedControl がコンポーネント化、2回連続でその場で作成(やってみた #156) preview
#156スコア 4.5/5
AI にバスのモバイル乗車券を作らせてみた — SegmentedControl がコンポーネント化、2回連続でその場で作成(やってみた #156)
/bus-ticket

`tsc` 緑・375px mobile-first。予備知識ゼロの AI(群青を一度も触っていない設定):

AI にバスの運行情報画面を作らせてみた — 作ったものの検証・否定確認・3回確認 が1画面に揃った回(やってみた #157) preview
#157スコア 4.5/5
AI にバスの運行情報画面を作らせてみた — 作ったものの検証・否定確認・3回確認 が1画面に揃った回(やってみた #157)
/bus-service-status

`tsc` 緑・375px mobile-first。予備知識ゼロの AI(群青を一度も触っていない設定):

AI にバスのモバイルIC画面を作らせてみた — バスが完走、4モード目(やってみた #158) preview
#158スコア 4/5
AI にバスのモバイルIC画面を作らせてみた — バスが完走、4モード目(やってみた #158)
/bus-ic

バスの事業者向け(運行#136/配車#137/計画#153/営収#154/安全#155)+ 利用者向け(接近#138/高速予約#139/経路#140/乗車券#156/運行情報#157/IC#158)が **事業者向け5+利用者向け6 で対称**に。航空(事業者向け5+利用者向け6)・鉄道(事業者向け5+利用者向け6)・タクシー(事業者向け6+利用者向け6)に並ぶ**4モード完成**。残るは🚚トラックのみ。

この業界が gunjo に残したもの

バスは、運輸のキャンバスを一気に描き広げた業界として群青に残りました。Stringline(運行図表 SVG ゼロ)・Gantt intraday(resolution="hour" で dayWidth ハック根治)・SegmentedControl・LineChip・Leaderboard──5コンポーネントが同じ arc で実装。これらは鉄道・航空・タクシー・トラックの他モードでもそのまま自宅扱いのコンポーネントになっています。toB5+toC6 の対称完走が、運輸モード間の「ロールモデル」になっている業界です。