医療UIのコールドテスト — 予備知識ゼロの AI に gunjo/ui で 7 画面を組ませた記録
与薬・バイタル・処方・手術記録・退院サマリまで、医療現場の7画面を予備知識ゼロの AI に組ませました。3点認証・ハイアラート薬・2人確認・署名ロック——「間違いが命に届く」UI の作法から、ScanGate / ReferenceValue / SafetyBanner / CoSign / SignedRecord の5つの汎用コンポーネントがコンポーネント化していった過程。
医療・ヘルスケア の cold test、7 画面のまとめ。
なぜ医療 UI は難しいのか
医療画面の難しさは、画面の派手さではなく「一文字の取り違えが患者に届く」という構造そのものにあります。正しい患者・薬剤・時間を機械的に保証する3点認証、ハイアラート薬(インスリン・ヘパリン・抗がん剤)に対する専用の警告、ダブルチェックを画面の上にきちんと残す仕組み、署名すれば追記しか許されない法的記録、基準値や用量レンジで「数の意味」を読むレポート——どれも「綺麗に並んでいる」だけでは成立しません。一般的なフォームコンポーネントが、医療では「足りない」のではなく「危ない」のです。
ここで群青に加わったコンポーネント
医療7画面(#53〜#59)の コールドテスト で、3回確認を満たして実装まで到達した汎用コンポーネントです。どれも医療専用ではなく、業界を越えて再利用できる形でデザインシステムに組み込まれています。
- ScanGate#53
バーコードを読んで「正しい3点」が揃わない限り次に進めない安全ゲート。倉庫の受け入れから医療の与薬まで横断。
- ReferenceValue#56
数値とその「基準値・用量レンジ・H/L フラグ」をひと組で扱う表示コンポーネント。検査値・処方・バイタルの共通キャンバス。
- SafetyBanner#56
アレルギー・相互作用・ハイアラート薬といった「画面に残し続けるべき警告」専用の常駐バナー。Alert より重い責務。
- CoSign#58
2人確認(ダブルチェック)を UI 上で形式化するコンポーネント。手術記録の器械カウントや麻薬・輸血のように、独立した2人の合意が要る操作に使う。
- SignedRecord#59
署名するとロックされ、以降は追記しかできない法的記録の枠。看護記録・手術記録・退院サマリで3回確認を満たして実装に到達した。
Textarea / Input は同じ医療シリーズ内で fix が land しました。「数の意味を持つフィールド」というパターンが、ここで初めて視野に入っています。
医療・ヘルスケア の全ラウンド
医療・ヘルスケア カテゴリの 7 画面を、ラウンド順に並べています。各カードから cold AI が組んだソース、解説記事、デスクトップ/モバイルのプレビューに飛べます。

/medication「違う業界」は、同じコンポーネントに違う要求を突きつける。倉庫用に作った ScanGate が、医療の患者と薬の照合でそのまま使われた。

/vitals「軸」が違うコンポーネントは、別のコンポーネント。「基準値による異常フラグ」が無い。

/lab-results「待つ」のは、形が安定するのを見るため。医療の3つの欠落が「2回目」に揃った。

/prescription複利は「作ったコンポーネント」だけでなく「待つ規律」にも乗る。「3回待った」2つの欠落を、まとめて作る。

/nursing-record深掘りは「大きな欠落」だけでなく「小さな抜け」も出す。でも2つ出た。

/surgery業界の「安全の文法」が、コンポーネントに出揃った。1画面で4回出た「2人確認」を作る。

/discharge-summary直前に作った2つが、退院サマリでも効いた。安全と記録の文法が出揃った。
この業界が gunjo に残したもの
医療は、5つの新しいコンポーネントと「責任の重い操作」の作法を群青に残しました。ScanGate は元は倉庫の受け入れ画面から来たコンポーネントが、患者リストバンドの3点認証で再発見されたもの。CoSign は手術記録の2人確認で固まりましたが、契約承認や高額決裁にもそのまま使えます。SignedRecord(署名→ロック→追記)も、看護記録・手術記録・退院サマリの3画面で独立に手組みされ、3回確認を満たして実装に至りました。「医療っぽいコンポーネント」ではなく、「重い操作を扱うすべての画面」のキャンバスになっています。