laya UI/UX 実装ガイド — 確率の可視化

解決すべき 3 つの UX 課題

laya はテキスト生成ではなく、較正された確率と信頼度で回答する System 1 意思決定モデルです。この性質を理解したうえで、一般のユーザーが迷わず扱えるインターフェースにするには 3 つの課題があります。いずれも Sandbox で実装を確かめられます。

1. 状態入力の簡素化

メール・チケット・JSON をそのまま貼り付けられる必要があります。構造化データと非構造化データの両方を同じ入力口で受けるため、形式の切り替えはタブで、ファイルはドロップで扱います。

2. 質問設計のガイド

choice / score / noul の型をユーザーが自行して正しく設計するのは難しい。テンプレートギャラリーから選ばせ、個別に編集するのは最後の手段にします。

3. 結果の可視化と信頼の伝達

「答え」だけでなく確率分布と信頼度スコアを見せ、「なぜそう判断したか」を追跡できるようにします。信頼度は色だけでなく 数値とテキストで必ず伝えます。

前提となるモデル仕様

項目	仕様
バックボーン	ModernBERT-large（395M、双方向、完全ファインチューニング）＋ decision head
総パラメータ	421M
入力トークン	1 質問あたり 512（英語）／1024（多言語・typed-decisions）
推論速度	1 問 32.8 ms、10 問バッチ 72.3 ms（T4 GPU）
質問型	choice score noul
較正	温度スケーリング後 ECE 0.081
ライセンス	Apache 2.0（完全オープンソース）

注意ゼロショットの base checkpoint は typed-decisions で 0.362（ランダム 0.318）。Jev に勝つのは同ベンチの学習スプリットで fine-tune した laya-typed-decisions の 0.766 です。UI で過度な期待を持たせないよう、この旨をどこかで明示してください。

なお Jev は第三者の製品名で、上流の記載は Jev 1.13.0 (published) です。引用している数値（ECE 0.246、typed-decisions 0.727、banking77 0.870、順序ローバストネス 0.13）は上流 BENCHMARKS.md の公開値です。TypeSafe API へのアクセスがないため、当方では測定しておらず、サンプル数やプロンプトも異なります。UI に実装する際は「同じ条件で比較した数値ではない」旨を併記してください。

3 つのプリミティブと、その見せ方

choice

選択肢から 1 つ。全選択肢の確率分布を横棒で示します。UI では分布全体を常時表示し、top の 1 本だけアクセント色で区別します。

"type": "choice",
"criteria": {
  "billing": "refunds",
  "technical": "bugs"
}

score

順序付き段階。段階を等間隔のスケールに並べ、マーカー位置で「どの段階とみなされたか」を示します。判断の根拠が伝わりにくい primitive なので、段階ごとの確率分布は必ず併記します。

"type": "score",
"criteria": [
  "low", "medium", "high"
]

noul

P(true) を 0.0–1.0 のゲージで提示。英語 checkpoint では false:/true: ラベルに引かれる既知の issue があるため、本番では中立キー + 2 選択肢の choice に置換するのが安全です。

"type": "noul",
"instructions":
  "Will they leave?"

推奨レイアウト: 3 カラム

入力・質問設計・結果の流れを 1 画面で追える構成にします。1180px 以下では 2 カラム、760px 以下では 1 カラムに畳みます。順序は 入力 → 設計 → 結果 に固定してください。

A. 入力パネル（左）

State Input: タブで Raw / Email / JSON / Ticket を切替。ドラッグ＆ドロップでファイル読み込み。512 トークン制限への近さはバーの色で示し（文字と数値も併記）。

B. 質問設計パネル（中央）

テンプレートギャラリー（メール振り分け・フィッシング検知・サポート優先度・AI ガードレール・請求処理・感情・多言語）と、カスタム質問エディタ。型を選ぶと criteria の入力欄が動的に切り替わります。リアルタイム検証で未入力を指摘。

C. 結果パネル（右）

信頼度メーター（円形ゲージ）、確率分布バー（choice）、スコアスケール（score）、P(true) ゲージ（noul）、信頼度ゲート警告、JSON / CSV エクスポート。生レスポンスは折りたためる領域に。

インタラクションフロー

1 状態テキストを貼り付け（またはファイルをドロップ）

2 テンプレートを選ぶ

3 Analyze を実行

4 結果を確認し、エクスポート

ゲーティング信頼度が 0.85 未満の場合は、自動判定を保留し人手確認を促す警告を明示します。これが laya の「安全な自動化ゲーティング」の強みです。閾値は UI で変更できるようにし、判定理由も併記してください。

実装のポイント

バッチ処理を前提にする: 複数質問は 1 フォワードパスで処理されるため、UI 上も「質問セット」としてまとめて管理します。1 問ずつ送信すると待ち時間だけが増えます。
エラーハンドリング: トークン超過の事前警告、不正な質問型（choice に配列、score にオブジェクト）は送信前に弾きます。サーバーは 422 で理由を返します。
アクセシビリティ: 信頼度は色だけに依存させず、数値とテキストで伝えます。ゲージには aria-label、分布バーには表形式の代替を用意します。
推論元の明示: デモ用の決定論モックと実推論を切り替える場合、選択器の横に常に現在のエンジンと「モックである」旨を出します。
レスポンシブ: 3 カラム → 2 カラム → 1 カラムの畳み込みと、コンソールパネルの開閉を breakpoint ごとに定義します。

まとめ

laya の UI/UX は「推論の透明性」を最大の価値として設計します。ブラックボックスの生成 AI と異なり、確率と信頼度が較正された出力を人間が理解し判断に組み込めるようにすることが、本モデルを容易に使用するための鍵です。3 カラムの直感的なレイアウトと、信頼度を可視化するゲージ・分布バー・スケールを組み合わせることで、誰でも強みを最大限に引き出せるインターフェースが実現できます。

本ガイドは Laya モデルカードおよび BENCHMARKS.md に基づく設計メモです。文中の一部の数値は第三者の公開値を含みます。