「先週問い合わせたときと回答が違う」というクレームが、AIチャットを入れたサポートページに届く。レコメンド枠が的外れな商品を出した瞬間、ユーザーはタブを閉じて二度と戻らない。検索ボックスに自然文を打ち込んだら、それらしいが微妙にズレた結果が「正解」の顔をして並ぶ。これらはモデルの精度が低いから起きるわけではありません。確率的に揺れる出力を、確定的な答えのように見せてしまうUIの作り方そのものが原因です。
生成AIや検索・レコメンド・チャットを自社サイトやアプリに組み込む案件が増えていますが、発注者も受託側も「AIを呼べば動く」で止まりがちです。実際に運用に乗せると、出力が毎回ブレるという当たり前の事実に画面が対応できておらず、クレームと離脱が積み上がります。本記事は、その不確実性をどうUI/UXに落とし込むかを実務的に解説します。
確率的な中身を確定的な見た目で包むと事故る
従来のWebは確定的（deterministic）でした。ボタンを押せば同じ画面が出る、同じ入力には同じ出力が返る。これに対してAI機能は確率的（probabilistic）です。同じ質問でも返答は揺れ、レコメンドは確率の高い順に候補を並べているだけで、1位が常に正解とは限りません。
問題は、この確率的な中身を確定的な見た目のUIで包んでしまうことにあります。Smashing Magazine の「Designing With Uncertainty」が引くカナダの航空会社の事例が象徴的です。サポートチャットが存在しない払い戻し規定を堂々と案内し、それを信じた利用者との間でトラブルになりました。チャットは「決めた」のではなく、学習データのパターンから「それらしい答えを予測した」だけ。にもかかわらずUIは断定的に表示したため、推測が事実として受け取られたわけです。
ここで、当メディアのAIエージェントの透明性UX設計ガイドとの違いを整理しておきます。透明性UXは「AIがいま何をしているか（どの情報源を見て、どう考えているか）を見せる」話です。本記事が扱うのは一歩手前――「AIの出力はそもそも毎回ブレる」という前提を画面に織り込む設計です。何をしているかを見せても、出力が確率的に揺れる事実を吸収する仕掛けがなければ、ユーザーは1回の外れで信頼を失います。透明性が「過程の可視化」なら、確率的UI設計は「結果の揺れの吸収」。両輪で初めてAI機能は運用に耐えます。
確からしさをどう見せるか ― 信頼度表示の設計
まず取り組むべきは、出力に「確からしさ」を添えることです。断定的に1つの答えだけを出すUIは、外れたときのダメージが最大になります。
実装で迷うのが、信頼度を数値で出すか、二値・三段階で出すかです。2026年に各所で共有された知見では、「85%」のような数値パーセンテージより、「確信あり/自信なし」のような二値表示のほうがユーザーは速く判断できたと報告されています。数値は精密に見えますが、85%と82%の差をユーザーは解釈できず、かえって迷わせます。色分けラベル（高信頼=鮮やかな色、低信頼=くすんだ色）にテキストやアイコンを併記する方式が、技術的な詳細で圧倒せずに信頼度を伝える定番です。
| 信頼度の見せ方 | 向く場面 | 注意点 |
|---|---|---|
| 数値パーセンテージ | 社内ツール・専門家向け（医療・与信など根拠が要る場面） | 一般ユーザーは差を解釈できず判断が遅くなる |
| 二値／三段階＋色ラベル | 一般向けチャット・レコメンド・検索 | 「自信なし」の場合のフォールバック導線が必須 |
| 信頼度を出さない | 確定的処理に置き換えられる箇所 | そもそもAIに任せるべきか線引きを再検討 |
重要なのは、信頼度ラベルは単独では機能しないことです。「自信なし」と表示したなら、その先にユーザーが取れる行動――別候補を見る、人間に繋ぐ、自分で訂正する――をセットで用意して初めて意味を持ちます。
1つに賭けない ― 複数候補・フォールバック・訂正導線
確率的な出力を扱うUIの肝は、「1つの答えにユーザーを固定しない」ことです。設計の打ち手は大きく3つあります。
第一に、複数候補の提示です。信頼度が揺れる領域では、最有力候補だけを断定的に出すのではなく、評価を促す代替案を並べます。チャットなら「こちらの可能性が高いですが、関連してこちらも」といった形で2〜3案を出し、ユーザー自身に選ばせる。レコメンドなら「これが外れならこちら」という再提案の余地を残す。これは透明性の話ではなく、確率分布をそのままUIに開く設計です。
第二に、失敗時のフォールバックです。AI機能で最も軽視されがちなのが「何も返せなかったとき」の画面です。レコメンドが該当なしのときに枠が空白になる、検索が0件で素っ気ないメッセージだけ出す――この瞬間に離脱が起きます。再試行ボタン、人気順や定番への切り替え、有人サポートへの導線、インライン編集といったフォールバックを用意すれば、失敗を「離脱の引き金」から「立て直せる場面」に変えられます。本サイト自体も、ビルド時にGA4から人気記事を取得するウィジェットが認証失敗で空配列になった際、自動で最新記事一覧へ切り替えるフォールバックを組み込んでいます。AIや外部API由来の不確実性は「失敗したときに何を出すか」まで決めて初めて設計が完結します。
第三に、ユーザーが訂正できる導線です。AIの誤りを前提に、その場で直せる経路を残します。回答へのフィードバックボタン、生成結果のインライン編集、検索条件の絞り込み再入力など。訂正導線は単なる親切ではなく、AIの可謬性をユーザーと共有し、信頼を維持するための装置です。
| 状況 | 悪い例（確定的UI） | 良い例（確率的UI） |
|---|---|---|
| チャットが曖昧 | 1つの回答を断定表示 | 複数候補＋有人導線＋「自信なし」ラベル |
| レコメンド該当なし | 枠が空白 | 定番・人気への切り替え＋再提案 |
| 生成結果が微妙 | 出しっぱなし | インライン編集＋再生成＋フィードバック |
確定的処理と確率的処理の線引き
すべてをAIに任せる必要はありません。むしろ設計の質は、「どこをAI（確率的）に委ね、どこを従来ロジック（確定的）で固めるか」の線引きで決まります。
料金計算、在庫数、予約の空き状況、本人確認、決済といった「間違えてはいけない事実」は確定的処理の領域です。ここをAIに生成させると、冒頭の払い戻し規定のような事故が起きます。一方、自然文の意図解釈、関連コンテンツの推薦、文章の下書き、曖昧な検索クエリの補完といった「揺れても致命傷にならず、むしろ幅が価値になる」領域は確率的処理が活きます。
実務では、AIの出力を確定的なバックエンドで検証してから表示する構成が有効です。たとえばチャットが料金を答えるとき、AIには「どの料金プランの話か」の意図解釈だけ任せ、実際の金額は料金マスタから確定的に引いて表示する。この線引きを設計初期に図に起こしておくと、後段のUI（信頼度をどこに出すか、フォールバックがどこに要るか）が自然に決まります。AIの確からしさを評価・検証する仕組みづくりについてはAIの精度評価（Evals）と計算リソースの壁も参考になります。
ある受託案件（BtoB向けSaaSのサポートサイト、社名は伏せます）では、当初「全質問にAIチャットが答える」仕様で進んでいました。これを「料金・契約・解約といった確定情報はFAQの確定回答へ誘導、使い方の相談はAIが複数候補で答える」と線引きし直し、AI回答には三段階の信頼度ラベルと有人エスカレーション導線を付けたところ、誤案内のクレームが解消し、有人問い合わせの一次対応もAIが捌けるようになりました。AIを増やしたのではなく、AIに任せる範囲を確率的領域へ絞り込んだのが効いた事例です。
なお、AIが生成したコンテンツであることを来歴として明示する設計も、不確実性を扱ううえで関連します。表示の信頼性という観点ではAI生成コンテンツの来歴・透かし管理も合わせて検討に値します。
次の一手
AI機能を組み込んだサイトやアプリで離脱・クレームが出ているなら、まず手を付けるべきは精度向上ではなく、「外れたときに画面がどう振る舞うか」の点検です。具体的には2つ。1つ目は、AI出力の各箇所で信頼度（二値か三段階＋色ラベル）を出し、低信頼時のフォールバックと訂正導線が揃っているかを洗い出すこと。2つ目は、いまAIに任せている処理のうち「間違えてはいけない事実」を確定的処理へ戻し、確率的領域だけをAIに残す線引きを引き直すことです。
この線引きとUI設計は、組み込み後では作り直しのコストが大きくなります。生成AI・検索・レコメンド・チャットをサイトやアプリに組み込みたい、あるいは既に組み込んだ機能のクレームや離脱に悩んでいる段階で、設計から相談いただくのが結局いちばん早道です。グリームハブでは確率的UIの設計から実装・運用までご支援しています。ご相談はお問い合わせフォームからお気軽にどうぞ。Web制作の受託全般についてはWebMCPでエージェント対応サイトを作るもあわせてご覧ください。
Sources
- Designing With Uncertainty: How AI Supercharges Probabilistic Thinking — Smashing Magazine
- Embrace AI’s Uncertainty in UX — Jakob Nielsen on UX
- Designing for Agentic AI: Practical UX Patterns For Control, Consent, And Accountability — Smashing Magazine
- Designing Interfaces Around Uncertain AI Outputs — AlterSquare (Medium)
