AI
Codex 做 UI/UX 的痛點：會排版不等於會設計，AI coding agent 需要設計參考與分工
CabLate 的 Threads 討論指出 Codex 在 UI/UX 上容易資訊量過大、操作不直覺、很愛列舉；留言補充可用 Claude Design/Claude Code、Gemini/Antigravity、Open Design、先產生參考圖再交給 coding agent。重點是：UI 判斷力不是把元素排整齊，而是知道何時刪減、分層與打破規則。
2026年6月21日3 分鐘閱讀👁 15
AI Coding × UI/UX × Design Workflow
Codex 做 UI/UX 的痛點：會排版不等於會設計，AI coding agent 需要設計參考與分工
這串 Threads 把一個很實用的經驗講清楚：Codex 可以寫程式，但做 UI/UX 時常停留在「把東西排列整齊」；畫面資訊量大、操作不直覺、喜歡列舉。真正的設計需要取捨、層級、節奏與使用者心理，不是純排版。
核心判斷：AI coding agent 做 UI 時，不能期待它自動通靈產品設計。比較穩的流程是：先用設計能力較好的模型/工具產生方向與參考圖，再讓 coding agent 實作與接資料。
Codex 常見問題
資訊量過大、操作不直覺、很愛列舉、把功能都攤在畫面上，像是只完成「整齊」而沒有完成「好用」。
留言共識
設計難點不是知道規則，而是知道何時打破規則；coding agent 目前仍缺少這種判斷力。
替代流程
Claude Design + Claude Code、Gemini / Antigravity、Open Design、AI Studio，或先用 image/model 做參考圖，再交給 Codex 實作。
| 階段 | 建議工具/方法 | 目的 |
|---|---|---|
| 1. 設計方向 | Claude Design、Gemini、Open Design、參考圖 | 先決定資訊層級、視覺風格、互動重點。 |
| 2. 實作 | Codex / Claude Code | 把設計轉成可運作的前端與資料流。 |
| 3. Review | 人工 + 截圖回饋 | 檢查是否過度列舉、是否符合使用者任務、是否有壓迫感。 |
Threads 來源：CabLate：Codex 的 UIUX 有點母湯
保存重點：AI coding agent 的 UI 產出要靠設計參考、模型分工與人工審美回饋，不要把 coding 能力誤認成設計判斷力。
2026-08-06 補充：GPT-5.6 Sol Ultra 課程編輯頁 UIUX 實測
新觀察：CabLate 這次沒有載入 UIUX Skill，只把課程平台的章節編輯頁交給 GPT-5.6 Sol Ultra 調整，並要求 agent 實際開網頁、操作與截圖確認。結論不是「AI 完全不會做 UI」，而是：它能抓到大方向，卻仍常在資訊取捨、重複元件、狀態行為與空間效率上失手。
AI 做對的部分
把章節列表放到左側，讓使用者可直接切換章節；相較原本回上一頁再選章節，這確實改善了主要操作路徑。
AI 做壞的部分