專案定位
不是聊天機器人，而是可掃讀的職涯指南
Stratum 被定位為職涯決策輔助產品。介面將 AI 生成建議轉成可比較的模組，協助使用者判斷職涯方向、辨識能力缺口，並決定下一步行動。
角色與範圍
負責 UI 架構、AI 互動狀態與前端原型
我負責定義產品資訊架構、設計視覺系統與互動狀態，並以 Nuxt 3 串接 Gemini API 完成可操作原型，用來驗證真實回覆流程。
問題背景
AI 職涯建議有用，但不容易信任與掃讀
原始 AI 回覆常以長篇、結構不穩的段落出現。使用者即使得到大量內容，仍可能難以判斷優先順序、可信度與下一步行動。
設計目標
讓 AI 建議變得可讀、有節奏、可行動
設計目標是降低生成等待與閱讀理解的認知負擔。頁面以清楚模組、漸進式回饋與視覺錨點取代連續文字牆。
關鍵設計決策
將不可預測的 AI 輸出轉成可預期的 UI 區塊
- 將答案拆成職涯方向、判斷依據、能力缺口與下一步行動，讓使用者能依目的掃讀。
- 設計流式回饋，讓 API 運算期間仍能呈現進度感，降低等待不確定性。
- 運用高對比標籤與卡片層級，讓 AI 建議更容易比較與判讀。
主要畫面展示
從原始 AI 資料到結構化職涯路徑
主要畫面展示原始類 JSON 輸出如何被轉換為具備層級、群組與視覺錨點的可讀介面。
AI 產品案例
為不確定性設計，而不只處理成功狀態
因為 AI 回覆會受 prompt 與模型輸出影響，介面必須提供可預期的容器、進度回饋與明確下一步。
- 結構化輸出模組降低 AI 回覆變成冗長散文的風險。
- 流式動態讓使用者在完整答案生成前就能感知進度。
- 建議卡片讓使用者更容易比較選項，也更容易檢視 AI 建議是否合理。
設計系統案例
以對比與焦點建立深色介面系統
視覺系統以受控的 mesh gradient、高對比強調色與可重複卡片樣式，維持高密度 AI 資訊的可讀性。
小型可用性檢查聚焦於使用者是否能快速理解第一個建議，並在不逐字閱讀所有段落的情況下辨識下一步行動。
- 3 秒
- 核心概念辨識目標
- 4 個模組
- 職涯答案結構
- 1 個原型
- 真實 AI 回覆流程
反思與下一步
下一版應讓 AI 信心與依據更明確
目前原型已改善可讀性，但下一步應把信心程度、依據、重新生成與追問機制做得更透明。
- 補上更清楚的重新生成與條件調整控制，讓使用者能修正自己的職涯脈絡。
- 呈現建議成立的理由，讓 AI 建議更具可追溯性。