AI に与薬・3点認証の画面を作らせてみた — 倉庫用に作った「スキャンして確認するしくみ」が、患者の取り違え防止にそのまま効いた（やってみた #53）

⁠やってみたシリーズ⁠: 自作のデザインシステム @gunjo/ui（群青）を、群青を一度も見たことのない AI に実際の画面で組ませていく連載。今回は⁠新しい業界・医療の1枚目⁠——⁠与薬（配薬）の3点認証⁠（患者バナー × アレルギー警告 × 「患者→薬剤→指示」の照合 × 要注意薬の2人確認 × 与薬記録）。

物流を6枚やり切って、まったく別の業界＝医療へ。1枚目は与薬（ベッドサイドで看護師が薬を渡す画面）です。医療で最も大事な「取り違えを防ぐしくみ」＝⁠3点認証⁠（患者リストバンド→薬剤→指示を順に照合し、「正しい患者・薬・時間」を機械的に確かめる作法）を組んでもらいました。

結果 — 4/5

型チェックもビルドも通り、エラーはゼロ。スマホ幅（375px・ベッドサイドのハンディ端末を想定）で、患者バナー＋アレルギー警告、3点認証（患者→薬剤→照合）、患者不一致・指示にない薬剤・中止済み・時間外はブロック、要注意薬の2人確認、与薬記録まで、ひととおり動きました。

今回の見どころ — 倉庫用に作った ScanGate が、医療の患者と薬の照合でそのまま使われた

この連載の一番の問いは「⁠作ったコンポーネントが、まったく別の分野でも見つけて使われるか⁠」です。#47〜52 で倉庫のピッキング用に作った ScanGate（順番にスキャンして確認するコンポーネント）を、⁠医療の AI が3点認証にそのまま採用しました⁠：

AI「ScanGate は物流から医療へそのまま使えた（捨てずに使った）。スキャンの流れが『患者→薬剤→照合』の形にぴったり合う。確定した患者の情報が次の薬剤ステップに引き継がれて照合でき、4種類のブロック（患者不一致／指示にない薬剤／中止済み／時間外）も、やり直しも、①患者→②薬剤 の手順表示も、そのまま機能した。」

⁠倉庫で商品を確認するしくみが、病棟で患者と薬を確認するしくみにそのまま効いた⁠。倉庫と病棟はまるで畑違いなのに、「スキャンして確定 → 次がその値を読んで照合する」という骨組みは同じだったのです。作ったコンポーネントが、業界どころか"仕事の種類"（物流の作業と医療の取り違え防止）まで越えて使われた——汎用性の最も強い証拠でした。

コードで直した課題 — 業界を越えて初めて見えた ScanGate の2つの欠陥

別の分野で使われたことで、ScanGate の設計上の欠陥が2つ見えました（#237・PR #240）：

• 🟠 ⁠確認が終わると状態がリセットされる⁠: ScanGate は倉庫の「次の商品へ」を想定して、最後まで進むと自動で最初に戻り、確認済みの情報を消していました。でも3点認証のような「一度照合したら終わり」のゲートでは、確認済みの状態を黙って消してしまう。→ ⁠最後で止まって情報を保持する設定を追加⁠（循環する作業＝梱包などは今までどおり、終わりのある作業＝照合はちゃんと終われるように）。
• 🟠 ⁠安全の警告が控えめすぎた⁠: アレルギーや患者不一致のような安全上の警告は、スクリーンリーダーで"割り込んで"伝えるべきなのに、控えめな読み上げに固定されていました。→ ⁠強く割り込む設定を追加⁠。

⁠倉庫では出なかった欠陥が、医療で出た⁠——「できるだけ違う業界」を回す意味そのものです。同じコンポーネントでも、安全が最優先の分野は違う要求を突きつけてきます。

使い回しも効いた

• ⁠Badge（#51 で修正）⁠ — どの状態のバッジも、文章の中に置いても表示の崩れゼロ。前回の修正が医療画面でも効きました。
• Alert・Checkbox/Switch/Select/NumberInput（バイタル）・Dialog・Statistic・Button（実施/保留/中止の色分け）・CardTitle も、そのまま使えています。

まだ作らず、課題として記録した「足りないコンポーネント」（医療特有・1回目。3回出たら作る）

医療は、これまでライブラリを育ててきた商業・金融・物流とは違う⁠安全特化の作法⁠を持つので、新しく「足りないコンポーネント」が出てきました：

• 🟠 ⁠SafetyBanner（承認できる重要アラート）⁠（#238・1回目）。患者バナー＋アレルギー警告は⁠常に表示・割り込み・確認必須⁠が要る。既存の Banner は高さ固定・1行しか出せず構造的に無理、Alert は「確認しました」を受け取る仕組みがない。→ 確認ボタン付きの安全バナーが理想。
• 🟠 ⁠CoSignField（2人確認）⁠（#239・1回目）。要注意薬は2人目の看護師の照合が必須——2人目のID＋確認チェック＋「主担当と別人」チェック。金融の承認や規制物質でも再び出てきそう。

学び — 「違う業界」は、同じコンポーネントに違う要求を突きつける

物流6枚: ScanGate を作った（倉庫の順番確認）
医療1枚: ScanGate が医療の患者と薬の照合でそのまま使われた → でも「終わると状態が消える」「警告が控えめ」の欠陥が見えた

コンポーネントの本当の丈夫さは、⁠作った分野の外で使われて初めて分かります⁠。ScanGate は物流では完璧に見えましたが、医療の「一度照合して終わる安全ゲート」という新しい使われ方が、終わり際の欠陥を炙り出しました。業界を散らして回すのは、使い回しを観測するためだけでなく、⁠コンポーネントを未知の要求に晒して鍛える⁠ためでもあります。医療はまだ1枚目——安全バナーや2人確認という、医療特有のコンポーネントの芽も出てきました。

次回予告（やってみた #54）

• ⁠医療をもう数枚⁠（バイタル/温度板・電子カルテ・検査結果＋基準値・処方/相互作用 など）。医療は業界特有の画面が濃いので、5枚に縛らず深掘りします。SafetyBanner・CoSignField の2回目を狙います。

試す

• ⁠gunjo.jp⁠ ／ npm @gunjo/ui ／ ⁠GitHub⁠
• ⁠GunjoUI by UIXHERO⁠

まだ開発中。倉庫用に作った「スキャンして確認するしくみ」が医療の患者と薬の照合に業界を越えて効き、その業界を越えたことで初めて「終わり際の欠陥」が見えた回でした。