你以為「介面好看」就等於「設計做得好」嗎？很多人卡在這裡：花了三小時調顏色，結果使用者連按鈕在哪都找不到。
今天你會學到什麼：徹底搞懂 UI 與 UX 到底差在哪、為什麼分得清楚這件事是學設計的第一塊地基，並完成一個可以自我檢查的小練習。
📖 學（核心）
UI 與 UX，到底差在哪？
先給最白話的定義：UI（User Interface，使用者介面）管的是「看得到、摸得到」的東西——按鈕、顏色、字級、圖示、排版、間距。UX（User Experience，使用者體驗）管的是「用起來順不順」——使用者從打開 App 到完成任務的整段感受，包括流程順不順、找不找得到、會不會卡住、會不會焦慮。
一句話總結：UI 是「介面長什麼樣」，UX 是「用起來什麼感覺」。 它們是一體兩面，不是對立的兩派。
為什麼一定要分清楚？
因為新手最常犯的錯，就是把所有時間花在 UI（把畫面弄漂亮），卻完全沒想過 UX（這個流程合不合理）。結果做出一個「美麗但難用」的東西。
反過來說，介面再樸素，只要流程清晰、該點的地方一眼就找得到，使用者就會覺得「好順」。設計界有句經典原則叫「Don’t Make Me Think」（別讓我思考）——好的設計應該讓人不用動腦就知道下一步該做什麼。這條法則管的正是 UX。
所以當你看到一個設計，請養成拆成兩層來看的習慣：
- UI 層：顏色搭不搭？字級對比夠不夠？間距整不整齊？
- UX 層：我知道現在在哪一步嗎？我找得到下一步嗎？出錯時系統有告訴我嗎？
一個具體例子：餐廳訂位
想像一個訂位 App。
- UI 做得好、UX 做不好：畫面精美、動畫流暢，但「選日期」藏在一個不起眼的小圖示裡，使用者點了三次才找到，訂完位還不確定有沒有成功。漂亮，但讓人焦慮。
- UI 普通、UX 做得好：畫面樸素，但「選日期 → 選時段 → 確認人數 → 送出」一步一步清楚標好，每步都顯示「你在第幾步」，送出後跳出大大的「訂位成功！」。不華麗，但讓人安心。
理想當然是兩者兼具，但如果只能先顧一個，先把 UX 顧好——因為再美的介面，讓人用不下去就是失敗。這也是為什麼我們學設計要從「分得清這兩件事」開始：分得清，你才知道自己每一個決定是在改「外觀」還是在改「體驗」。
🧠 記
- UI = Interface = 介面長相（看得到、摸得到：顏色／字級／按鈕／間距）。
- UX = Experience = 使用感受（用起來順不順：流程／找得到／不卡住）。
- 口訣：「UI 是臉，UX 是路」——臉要好看，但路更要好走。
- 看任何設計都拆兩層：先問「美不美」，再問「順不順」。
- 黃金法則：Don’t Make Me Think——好設計不該讓人動腦猜下一步。
✍️ 實踐
打開你手機裡任一個常用 App（外送、銀行、社群都行），選一個具體流程（例如「下一筆訂單」或「轉一次帳」），完成下面這份可檢查的清單：
- 寫下這個流程的步驟數（例如：搜尋 → 加入購物車 → 結帳 → 付款，共 4 步）。
- 標出 1 個 UI 觀察（哪個按鈕／顏色／字級做得好或不好，一句話說明）。
- 標出 1 個 UX 觀察（哪一步讓你覺得順，或哪一步讓你卡住、猶豫、不確定，一句話說明原因）。
- 寫下 1 句「我會怎麼改」，並註明你改的是 UI 還是 UX。
完成標準：四項全部寫完、總字數約 100～150 字、存成今天的筆記。能清楚分辨自己每條觀察屬於 UI 還是 UX，就達標了。
🔗 延伸學習
- UI、UX差在哪？零基礎也能入門，UI/UX自學３步驟（Cheers 快樂工作人） — 用最白話的方式釐清 UI 與 UX 的差別，適合第一天閱讀。
- Don’t Make Me Think（Steve Krug） — 可用性入門聖經，提出「別讓我思考」第一法則，薄而實用。
- 10 Usability Heuristics for User Interface Design（Nielsen Norman Group） — 設計界經典的十大可用性原則，是檢視任何介面的萬用清單，務必讀熟。
💬 想深入？複製下面這段到 AI（ChatGPT、Claude…），再打上你的問題
你是我的「UI/UX 設計」學習教練。我今天在學的主題是「UI 與 UX 的差別」，重點包括：UI 是介面長相、UX 是使用感受、口訣「UI 是臉、UX 是路」、好設計不該讓人動腦猜下一步（Don’t Make Me Think）。請用淺白、可操作的方式回答我接下來的問題，需要時給例子和步驟。我的問題是：
↑ 複製整段，貼到 AI，最後接上你的問題即可。