《UX 三刀流》課程筆記+心得整理 Week 10+11

Week 10 為期中報告：

1. 本系列內容為 UX 三刀流 2024 春季班 課程進度內容
2. 本篇依據自身當下手抄筆記再次統整歸納為貼文
3. 心得依照講義影片頁面順序
4. 對課程有興趣者可參考

Week 11：章節進度 2-5 使用者介面設計流程
筆記環節

1. 使用者介面設計的角色

(1) 介面設計師不是美工

 a. UI設計：視覺設計
 b. UI&UX設計共通：資訊設計/介面設計/導覽設計、互動設計/資訊架構
 c. UX設計：功能規格/內容需求、使用者需求/網站目標

(2) 介面設計的流程，從「需求」就已經開始

(3) UI設計師與UX設計師的分工

 a. UI設計師重視「互動細節的安排」：互動設計元素、視覺與感受（美學、主觀偏好）
 b. UX設計師合理「人與系統互動的邏輯」：功能架構與互動流程、滿足目標需求（數據導向）

(4) UX=看起來感覺很好＋用起來感覺很好＋可以達成操作易用性

ISO9241 定義的三個易用性指標：
有用（effectiveness）、效率（efficiency）、滿意（satisfaction）

2. 使用者介面設計流程 —— UX 設計師視角

(1) 使用者目標（User Goal）

情境中擷取問題和需求

(2) 任務流程（Task Flow）

操作任務的拆解（完成任務的需求分析）

(3) 線框流程（Wire Flow）

互動溝通的邏輯

(4) 使用者流程（User Flow）

具體互動的層級，包含互動、回饋、提示等。和線框流程的差別在於「加入了使用者的決策思考判斷等因素」

(5) 任務流程（Task Flow）V.S. 線框圖（Wire Frame）

a. 任務流程「解析互動細節」，但缺少了「介面互動表現」
b. 線框圖有「完整介面考量」，但缺少了「前後關係」

(6) 兼顧 UX 互動邏輯與 UI 互動細節的介面設計方式：

線框流程（Wire Flow）

3. 使用者介面設計流程——UI 設計師視角

(1) 重視各頁的細節，在生成一個頁面前有著一連串的思考

 a. 縮圖（Thumbnail）：單頁面層級
 b. 圖塊（Blockframe）：元件佈局
 c. 線框圖（Wireframe）：用以溝通頁面架構、內容、功能、行為、資訊階層
 d. 介面（Interface）：視覺圖像 Mock Up→靜態視覺稿，最後產品視覺化
 e. 原型（Prototype）：高擬真介面表現
提供完整、實際視覺設計，包含圖形、排版、網頁上大小元素等視覺表現

4. 介面規格書

進入開發流程之前，描述開發者需要的「互動規則和限制」，幫助工程師了解介面如何運作

5. 介面設計中，UI和UX工作者可以有不同關注點

依照大廠的介面設計規範：避免不符合被退件以及使用者更一致的操作體驗

心得環節

這個章節讓我更了解UI和UX設計師的工作範圍，和如何合作。
（UI 設計真的沒有只負責美麗而已😤😤😤）

我知道在很多地方這兩個職位都是合併，看完覺得介面設計這塊沒有UI組UX組（多人）一起切磋討論其實滿可惜滿寂寞的。

最後一段提到要依照大廠的介面設計規範很有道理。
畢竟有多少人就會有多少種介面被設計出來，要是沒有一個規範，整個使用流程就天下大亂啦！

關於我