Codex 做 UI/UX 的痛點：會排版不等於會設計，AI coding agent 需要設計參考與分工

AI Coding × UI/UX × Design Workflow

這串 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	人工 + 截圖回饋	檢查是否過度列舉、是否符合使用者任務、是否有壓迫感。

## Kate 的整理判斷這篇對 Allen 的價值很直接：之後要派 AI 做產品頁、Dashboard、記帳工具、內部系統時，不要只給「做漂亮一點」。要給任務情境、核心動作、資訊優先級、不要出現的東西、參考截圖。尤其既有專案改 UI 時，最好先產生 mock / screenshot reference，再讓 coding agent 改，而不是讓它自己發明設計。

Threads 來源：CabLate：Codex 的 UIUX 有點母湯

保存重點：AI coding agent 的 UI 產出要靠設計參考、模型分工與人工審美回饋，不要把 coding 能力誤認成設計判斷力。