鐵人檔案
AI 生成的介面常常看起來漂亮，卻把 Button、Link、Input、Dialog 混在一起，互動狀態也漏了一半。
這個系列用 30 次 UI 驗收實驗，帶你認識常見 UI 元件、適用場景、互動狀態與選型差異，並把「做得像 SaaS」這類模糊需求，改寫成 AI 聽得懂、做完能檢查的規格。
文章搭配網站截圖、錯誤案例、修正版 Prompt 與可操作的繁體中文 UI 元件百科，讓不熟前端的 Vibe Coder 也能清楚說出自己要什麼。
安安～我是ChiYu～ 管理員準備儲存成員角色時，畫面同時冒出三則訊息： 通知管道尚未選擇，設定無法儲存。 系統今晚會維護一小時。 新成員最好先從最小權限開始...
安安～我是ChiYu～ 訊息站對位置後，LumenDesk 接著發生三件事： 成員角色儲存成功。 「八月活動文案」被移除。 有人送來新的專案申請。 我把三件...
安安～我是ChiYu～ 通知中心留下了一筆新工作： 匯入 24 位成員。 這不是一瞬間完成的動作，我最早給 AI 的 Loading 需求卻只有一句： 資...
安安～我是ChiYu～ Loading 跑完後，LumenDesk 的「專案」頁面只剩一句： 目前沒有資料。 我當時給 AI 的需求也差不多簡短： 沒有資...
安安～我是ChiYu～ 專案資料恢復後，AI 很貼心地替每一筆套上圓角、陰影和滑過去會浮起來的效果。三張 Card 排在一起，SaaS 感可以說是相當充足。 我...
安安～我是ChiYu～ 近期專案改成 List 後，名稱、負責人和里程碑終於排整齊了。結果每列旁邊又冒出一整排小膠囊：紅底的「3」、藍底的「設計系統」、可以移除...
安安～我是ChiYu～ 取消「進行中」Filter Chip 後，成員資料從 8 筆回到 24 筆。24 筆本身不會自動把 Table 升級；真正把需求往 Da...
