AI 代理人的
透明化駕駛艙
當 AI 從「助理」變成「代理人」,UX 面臨一個新命題—— 如何讓使用者既能放手,又能隨時拉回控制權?
“使用者最害怕的不是 AI 做錯選擇,而是自己沒有機會知道、理解、或阻止。”
三個核心情境
TrustGuard 圍繞 AI Agent 可能進入的三種狀態展開設計。
Before / After · Design Rationale
同樣的情境,兩種 UX 決定
把 TrustGuard 放到「典型錢包介面」旁邊 —— 三組具體對比, 每組背後都有一個可被挑戰的設計決定。
查看三組對比
五個設計原則
每一個元件、每一個畫面,都回到這五條原則。 它們不是規範,而是設計爭議時的仲裁。
01Principle
翻譯,不是展示
不把 API 回來的數字原封不動倒給使用者。把「3.42 USDC」翻譯成「過去 24 小時的質押收益」。
02Principle
Panic 色是神聖的
大面積紅色只為「必須立刻反應」的時刻保留。一旦濫用,使用者的警覺會鈍化。
03Principle
夥伴關係,不是代理
AI 不該假裝無所不知。信心度低就主動求助,把決策權還給使用者。
04Principle
證據優先於承諾
不說「相信我」。說「這是我看到的資料、我的推理步驟、我做了什麼」。每一步都可追溯。
05Principle
透明度要校準
日常不需要攤開所有日誌,緊急時要把所有細節擺到眼前。透明度隨情境調整。
專案進度
Week 1UX Research(訪談 · 競品 · Journey Map)
Day 8Design Tokens 建立
Day 9Design System 展示頁
Day 10核心元件 ①(Confidence · Status · Activity · Dialog)
Day 11核心元件 ②(PanicButton · TraceTimeline)
Day 12-13三大場景組裝(A / B / C)
Day 14首頁完成 + 完整串連
Day 15動畫打磨(entrance stagger · Panic slide-down · Confidence fill)
Day 16Living Spec 升級 · README 重寫
Day 17Before / After 對比頁(三組設計決策對照)
Day 18無障礙細節(focus-visible · skip link · panic 焦點色)
Day 19OG image(1200×630 · 英文版,避開中文字體載入)
Day 20反思頁(trade-offs · 學到什麼 · 下次會改什麼)Now