網路上對於 UI 和 UX 的謬談 這篇留言數量頗多，其中一則留言我另開這篇文來回答。
這張圖是 Dan Saffer 畫的，指的是 UX 包含那些範圍，可以看到並沒有「UI」的圓圈。
他說：「UX 包含產品或服務的整體經驗，而且也包含UI。UI 由視覺設計（外觀和感覺）和互動設計（如何運作）組成。」
可以得知 UI 在互動設計和視覺設計交錯的那個區塊。
既然 UI 設計由視覺設計和互動設計組成。組成代表的是兩者必需同時存在。你不會說「水是 H2O 組成，所以 H2 是水，O 也是水。」
介面必須包含輸入、輸出、運作內容，可以互動才可被稱為 UI，也就是說不能動的通通不能被當成 UI。就像你不會說電影海報是 UI、大潤發 DM 是 UI 一樣，它們是視覺設計或平面設計。
動畫是不是 UI？ 當然不是，使用者怎麼操作動畫？一定要包含輸入、輸出、運作內容這三點，才可被稱為 UI。(會動不是指畫面元素會動這件事，而且能不能和使用者互動。）
例子
留言中提到 10 個情況，問決策過程，依本文的概念該由誰來處理。
（先假設一切完美、沒有 GGYY 的客戶或主管、沒有時程壓力、沒有技術限制、沒有外在干擾。開發團隊至少包含 PM、RD、UX Researcher、Interaction Designer、Visual Designer 等等，且所有人都有一定程度的實務經驗、知道如何跨領域相互支援、團隊合作和溝通上無問題。)
有個大前提：團隊合作並不是某人說了算，而是某個職務上的人做了這樣的提議後，專案成員皆同意、共同負責。當在大家都同意的情況下，產品失敗不會是其中一個人的責任。
關於 UI 設計的職責劃分可以參考：What are the differences between UX, Interaction, UI and graphic/visual designers? Are these distinctions helpful or damaging to our field?
- 滑鼠移過購物車圖示，要滑出一個迷你購物車，誰來決定迷你購物車內是否要放產品照片、應付金額的文字尺寸要不要加大?
要不要放產品照片這件事，得先看客戶資料端有沒有照片資料。可能 RD 可能 PM 要去把資料找出來。
畫 Wireframe 的是誰？他要決定畫面包含哪些內容、各種頁面狀態，Interaction Designer。
應付金額的文字尺寸要不要加大?
Interaction Designer 只會處理內容（文字、圖片、聲音、影片）和使用者之間的互動關係，至於內容長什麼樣是 VD 的工作。
PS. 內容：就是文字、圖片、聲音、影片。和文字(是不是今天寒流來)、圖片(是貓還是狗)、影片(是卡通還是電影)無關。
為什麼要加大呢？可能是 UX Researcher 發現目前版本能有改善的空間，找 VD 處理。
UX Researcher 做的是「發現」，他只能告訴你問題出在哪，但沒辦法直接告訴你問題要怎麼解決。解決問題是「創造」，歸設計師思考。思考出解法再交給 UX Researcher 驗證。
- 承上，誰來決定迷你購物車是整塊從上往下滑入，還是裡面的項目是一條一條從畫面外淡入飛入?
Interaction Designer 必須考慮所有和使用者有關的互動行為，產出 Wireframe 給 RD 和 VD 。
補充：有專門處理動畫的職務。Motion Designer - Jobs - Google Design
- 滑鼠點擊選擇折價券，會跳出一個「會員現有的折價券清單」的 modal，決定這個 modal 是要選擇折價券之後自動關掉，還是要點選「我已選擇完成」之後才關掉的人是誰?
畫 Wireframe 的那個人決定，Interaction Designer 。
UX Researcher 驗證這個作法會不會讓使用者跑光。
- 承上，決定這個 modal 在電腦上要多寬，「我已選擇完成」的按鈕要在 modal 的右下角、左下角還是中間的 是?
在電腦上要多寬和按鈕位置是是 VD 的工作。但決定這個畫面上要不要有 modal 、有按鈕，是 Interaction Designer 。
Do Visual Design and Interface Design have a similar job objective?
- 會員購物明細中，地址、收件人、電話、手機、備註、商品明細、折扣明細……等各種項目的顯示順序。
Interaction Designer 畫 Wireframe 時提出，但不代表 VD 不能改。改完會不會被 UX Researcher 測一測說有問題…不知道。
- 某按鈕上的文字常常被使用者誤解點錯，讓客服電話接不完，決定按鈕上的文字要怎麼寫的人是?
PM 或 Planner。
不，我開玩笑的。
常常被誤點就是 UX Researcher 的工作，既然他已經知道問題出在文字上，就得提出建議給實作人員。可能兩者會配合多測幾組文字，看看使用者的反應以找出較好的那組文字。
可能另外有專人負責文案，如果沒有特定的人，只好看 Wireframe 誰畫誰處理了。（Interaction Designer：「又是我！？」）
補充：Google 有專門寫文案的職務。 UX Writer - Jobs - Google Design
- 承上，要改善系統流程，避免誤點了之後發生無法挽回的事，提出新流程規畫的人是?
提出新流程規劃＝舊有問題待解決，UX Researcher 必須找出舊版的問題出在哪，給 Interaction Designer 建議，共同討論新作法。
UX Researcher 會告訴 Interaction Designer 使用者的操作習慣、容易出錯的部份、為什麼出錯。至於怎麼修改是 Interaction Designer 的工作。
改完再給 UX Researcher 驗證…
- 某一線上型錄頁面中有一個 Download 按鈕，點擊之後會把檔案下載到本機。決定按鈕上的圖示要用一朵雲+向下的箭頭，還是磁片的人是?
VD。
如果被 UX Researcher 測出使用者看不明白就會被打回重做。
- 某一線上型錄頁面中已經有一紅、一黃、一藍的按鈕，現在要再增加一個功能與其他顆完全相異的按鈕，決定新的按鈕要用什麼顏色的人是?
和視覺有關的都找 VD。
至於新的顏色能不能讓使用者看得懂，UX Researcher 要去測。
- 執行某動作之前有一段說明文字，「避免有人沒看說明，要先等待 5 秒才會跑出執行按鈕」，決定「」內操作流程的人是?
Interaction Designer。至於 5 秒會不會太久、或這樣作法會不會讓使用者抓狂…UX 要去測。
.
.
.
上線前會有 UX Researcher 把關品質的，不然沒辦法證明這樣子的設計能給使用者良好的體驗。上線前先測一下，總比上線後被使用者罵來得好。（快和頭皮屑一樣多的研究方法就是為了各種情況、階段的測試和驗證而生，種類繁複應有盡有…）
但一個產品或服務給人使用的體驗不好，絕對不只是 UX 的錯，整個團隊都有份。程式寫太爛常常崩潰會失去使用者的信用啊！程式穩定和與設計師們無關對吧。要知道整個專案成員都在執行「讓產品給使用者更好的體驗」這項任務。
團隊合作不是把自己手上的事情做完扔出去就沒事了。要去看看其他專案成員在做什麼，拿到自己給出的檔案後接下來會怎麼處理，自己有沒有可能配合對方做微調讓雙方都好做事。
先不管是不是我亂嘴砲胡扯，起碼跨領域多懂一點、讓工作順利，多學一點總是好的。
補充：
Google 分工的很細，有些職務如 Filmmaker、Industrial Designer，我就不熟悉這個領域的工作內容了。
