回作品列表 AI 協作

TrustGuard

當 AI 代理能自己下單,使用者如何既放手、又保有信任與控制權

角色
UX 研究、互動原型、前端實作
期間
2026.03 – 2026.04
範疇
UX 研究、Agentic AI、互動原型
TrustGuard 首頁:AI 代理人的透明化駕駛艙標題與深色暖調介面
3
信任設計原則
3
互動情境 Demo
60%
信心警示閾值
5
研究洞察

背景與挑戰

當 AI 從「助理」變成「代理人」,能在你睡覺時自動再平衡投資組合,UX 出現新命題:使用者要怎麼放手讓 AI 行動,又能隨時拉回控制權?Web3 × Agentic AI 把矛盾推到極致:AI 要夠自主才有價值,但大多數錢包只給一個 Approve 按鈕,就要你把資產簽出去。

這個案例的研究方法本身就是實驗。受限於單人 side project 的時間與管道,我沒有招募真實受訪者,而是用 AI 模擬三位輪廓迥異的使用者——不碰 Web3 的行銷經理、玩了三年 DeFi 的工程師、零投資經驗的自由工作者——進行訪談並交叉綜合洞見,再搭配 Tenderly、Rabby、LangSmith 三個真實競品分析。必須誠實標註:這是模擬研究,不能取代真實訪談;但它讓我在一週內收斂出五條洞察,其中一條成為設計的出發點:

使用者最害怕的不是 AI 做錯選擇,而是自己沒有機會知道、理解、或阻止。

研究與設計決策

順著這條洞察,我把信任拆成三個能被介面承接的原則,每條都落到具體元件。

TrustGuard 儀表板情境 Demo,上方可切換日常、低信心、緊急三種情境
三個情境 Demo 對應 AI 代理的三種狀態:Happy Path、Low Confidence、Panic,圖為 Happy Path 儀表板與情境切換列

貫穿所有畫面的還有「Translate, Don’t Display」:把 approve(0x1234..., uint256.max) 翻譯成「AI 獲得了 USDC 的永久授權」這種人話。模擬訪談中三種輪廓的使用者反應一致:看不懂就想關掉,翻譯層因此成為產品的差異化核心。

TrustGuard Design System 頁的 Colors 色彩 token 與 Why 說明區塊
Design System 頁:每個 token 與元件旁都有 Why 區塊,記錄決策理由與成本

成果與反思

最終成果是部署上線的互動網站:六個頁面、19 個自製元件,包含把每個決策的「為什麼」攤開的 Living Design System,以及 skip link、focus-visible 等無障礙細節,由我主導設計與研究方向、與 AI 協作完成前端實作。

反思也要誠實。第一,模擬研究有限制:AI 模擬的受訪者太「配合」,不會像真人那樣前後矛盾,洞察方向可信、細節仍需真實訪談驗證——這點寫進了網站的 Reflection 頁,下一步是用真實使用者檢驗三原則。第二,Demo 是 mock 資料,信心分數來自劇本而非真實模型輸出。第三,過程也有失敗修正:OG 圖因產圖工具不支援 oklch 色彩而失敗,改用 hex 才解決。

這個案例的意義不在做出 AI 投顧產品,而在示範:設計師可以把「信任」這種抽象議題,拆成可被互動驗證、也可被反駁的介面決策。