這學期我在大學兼了 2 學分的選修課，說是設計系大三生的 UI 課，實際上有一半在講使用者經驗研究。沒有講使用者經驗就教學生直接動手畫 UI…我相信視覺設計是他們的強項，不需要我來錦上添花，所以這次準備的課程內容大都在訓練他們的「邏輯」。
（這篇文應該在一個月前跟著上課進度貼出來，但今年下半年度人太忙太累幾乎垮了，看醫生養身體，拖到現在才有力氣開始寫文。）
課程規劃
一學期 18 週的課程規劃如下，看得出來比較偏重使用者測試的部份。我認為軟體操作相關的教學資源非常豐富，身為設計學院多媒體系的大三生還不熟 Photoshop 真該回去重修，不想浪費課堂時間教軟體操作。反倒是湊一組人聚在一起用「研究方法」討論產品設計這件事非常難得，就連在業界搞不好也沒有多少機會可以實際演練…好吧這是我的私人偏見，訓練未來的設計師邏輯能力越早開始越好，不然畢業後和工程師合作會被釘得滿頭包。
- 互動設計、介面設計、使用者體驗是什麼。業界開發流程
- 分析工作角色、工作任務、目標，層級工作分析法
- 使用者測試訪談
- 學生自己實作使用者測試訪談
- 10/10 放假
- 親和圖（上）
- 親和圖（中）
- 親和圖（下）
- 人物誌
- 使用者旅程圖（上）
- 使用者旅程圖（下）
- Wireframe
- 優化之前測試的 App（上）
- 優化之前測試的 App（下）
- Prototype 介紹
- Prototype 自訂任務、實測
- 期末發表 Prototype 實測影片
- 期末發表 Prototype 實測影片
第一週我就遇到問題了，脫離學生時期太久，忘記 2 堂課也不過 100 分鐘，扣掉管秩序、學生問問題…真正能教學的時間可能只有 90 分鐘真的太短，一些研究方法只能拆成數週來講了。
（這邊就當成是上課教材的補充吧，順帶舒發一些個人心情…）
使用者經驗、互動設計、介面設計
使用者經驗
如果使用者體驗存在產品本身，那每個人看到摸到這個產品感覺都應該是一樣的。也就是「這個產品被附與了一個 FU，這個 FU 呢可以灌頂到所有人的腦子裡。」
但現實生活光是一盤義大利麵，有人覺得好吃有人覺得難吃。從上圖可以看得出來，使用者體驗是存在使用者身上，並不是存在「產品本身」，就連摸不到的「服務」、抽象的「品牌印象」都算在使用者體驗範圍內。甚至連企業文化、開發流程、產品策略都和 UX 有關聯。
使用者體驗並不只存在手機或網站裡。我很常舉「迪士尼樂園」當例子。當人們走進迪士尼樂園這個賣夢想的地方時，不管是園區硬體規劃、服務人員、遊樂設施、甚至音樂、食物、紀念品等等，整體氛圍都給人「忘卻煩惱享受玩樂」的印象。這些印象都可以稱為「使用者經驗」。
但只有過去或現在產生的印象才能被稱之為「經驗」，沒有經歷過、未來的狀況沒有辦法被稱為經驗啊！
視覺設計不是 UI 設計，UI 設計不是 UX 設計，可以參考我之前寫過的文章：
UI/UX 相關工作職責參考
網路上對於 UI 和 UX 的謬談
UI/UX 工作的職責劃分
互動設計
互動設計的範圍也非常廣泛，不管是透過螢幕、透過實體產品、甚至是無形的服務體驗都能被稱之為「互動」。
並非只有摸得到的東西才算是「互動」，打電話給銀行的客服人員，你和客服人員進行了什麼樣的對談？客服人員的態度給你產生什麼樣的感覺？
不要跟我說在打電話的過程中你摸得到客服人員啊！但就算摸不到，他們的態度和語氣能影響你的感覺。
很久以前我參加過一個行銷方面的演講，講者說了個非常有趣的故事：
A. 你走在街上，突然聞到一陣咖啡香。繼續往前走看到一間咖啡店，停在店門發現咖啡香更濃郁了。推開店門走進去，不止咖啡香，你還聞到其他食物的香氣。
此時，你對這間咖啡店的印象如何？
B. 你口渴了想找間咖啡店買喝的，當你站在店門口，深吸一口氣，沒有聞到任何咖啡香氣。推開玻璃門走進去，再深吸一口氣，仍然沒有任何咖啡香。
此時，你對這間咖啡店的印象如何？更慘的是推開咖啡店門，聞到漂白水味…是我就轉身離開這間咖啡店了，俺是來買飲料不是來買漂白水的！
香味摸得到嗎？摸不到。但在「去咖啡店買一杯咖啡」這個過程中，香氣能對顧客產生不同的印象，也能讓顧客對這間店有不同的「體驗」。
延伸閱讀：
介面設計
在不要用平面設計的思維做 UI 文中有提到，介面設計包含輸入、輸出、運作規則。
視覺設計師和 UI 設計師的差異，請見：UI/UX 相關工作職責參考
目前台灣把介面設計師當成網頁設計師在用的公司非常多，還要求要包 F2E 的工作。我很常收到訊息問：「當 UI 設計師需不需要學寫 HTML、CSS、JS。」
那不就是「網頁設計師」了嗎？不然 UI 設計師和網頁設計師差在哪？一位要做 App＋網頁、另一位只需要做網頁？
初學者不需要跨去學網頁技術，有點概念就好，你們要學的東西太多，不要把跨度跨得這麼大。
先把重心放在「看懂平台設計規範」、「和不同部門的人怎麼合作」上。
Apple 設計規範
https://developer.apple.com/design/#//apple_ref/doc/uid/TP40013289
Android 設計規範
https://developer.android.com/design/
Material Design
https://material.io/design/
Bootstrap 設計規則
https://getbootstrap.com/
如果視覺設計的技術不錯，把這幾份看完，能把網頁、App 兜個有模有樣的成品出來，找工作不是什麼太難的事。剩下實戰就靠做專案、以及與他人合作時不停出包糾正修改磨合來成長吧。設計師怎麼可能不出包不被 RD 念、也不可能永遠一次過關的啦！
以前寫過讀者來信：UI 設計流程 ，但這篇文完全沒提到 UX 研究怎麼和 UI 設計過程結合。
本次課程雖然會把 UX 研究結果拿去畫 Wireframe 和做 Prototype 進行使用者測試，但不會提到其他 UI 產出，畢竟時間有限。
回家作業
6 個人一組，各組交 60 個難用的 APP 或網頁。請截圖說明為什麼難用。（建議做成簡報，一頁一個 App，轉 PDF 上傳到 Google 硬碟。）
我在規劃作業時都會以 1 小時的工作量當基準。第一週嘛，先來個很簡單的練手，習慣下，之後再慢慢加深難度…想是這樣想，大概是太輕鬆好寫，我收到「新細明體的簡報」這種玩意，是該慶幸他們沒交「標楷體」過來嗎？讓我立刻放棄當個溫柔老師的念頭，兇一點嚴格一點學生才會認真（好幾位大學教授跟我說教學生要兇要嚴他們才聽話，我不信是我的錯）…之後他們交出來的作業果然好很多，還有拿下 10 分滿分的組別。
作業繳交時限是 23:59，我得改 11 組的作業…半夜被新細明體氣到，颱風尾還不小心掃到老公。
R：「要是電腦裡只有新細明體妳也不能怪他們啊～」
A：「哪個設計大三生電腦裡只有新細明體和標楷體的？不會去下思源黑體？」
A：「你以為設計系和資工系一樣嗎？大學 4 年靠新細明體就能畢業？」
（不、資工系靠新細明體也不能畢業。）
系列文章：大學生的 UI 選修課
之前我在實踐大學開了一門 UI 設計課，簡單大略地從 UX 研究開始介紹、怎麼察覺使用者的痛點、到 UI Flow、Wireframe、Prototype。在 Blog 寫點除了課堂教學外的延伸思考。
