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

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

Week 13：章節進度 2–7 原型設計
筆記環節

1. 原型在 UX 中扮演的角色：更具體地「溝通產品設計」

(1) 設計暫時樣貌來驗證設計是否符合需求

不需太過細節，但要有助於溝通效率

(2) 設計圍繞使用者需求

 a. 概念驗證 — — 草圖（Sketch）┬┬┬┬┬┐
 b. 互動驗證 — — 線框圖（Wireframe）靜態
 c. 介面驗證 — — 模型（Mockup）┴┴┴┴┘
 d. 操作驗證 — — 互動原型（Prototype／Development）├動態
 e. 需求：草圖、故事板表達使用情境／互動：介面原型驗證認知模型

(3) 透過「付出成本」驗證設計「不確定性」

用戶流與商業流之間取捨：擬真度越高，成本越高。

a. 低擬真 — — 草圖（Sketch）
 • 「快速建立」可溝通介面
 • 傳遞產品的「概念核心」

b. 中擬真 — — 線框圖（Wireframe）
 • 介面元件佈局、動線
 • 更精準「概念、功能、操作」層次的需求驗證溝通

c. 高擬真 — — 模型（Mockup）
 • 介面「真實圖文」傳達
 • 產品「更完整的長相」

d. 更高擬真 — — 原型（Prototype）、互動原型（Interactive Prototype）
 • 「可操作的」測試以驗證使用者需求

2. 常見原型方法和工具

(1) UI 設計三劍客：Sketch、Adobe XD、Figma

(2) 原型工具優勢：介面模版市集

設計師不需再學習底層元件製作，介面安排也有模板→介面設計技術門檻降低。因此設計師「更要學習介面設計原則」，且在介面表現上擁有自己獨到的創意，甚至擁有體驗設計的心法。

(3) Acadeck.com 原型方法

 a. 草圖（Sketch） — — 快速大量設計概念視覺化
 b. 紙模型（Paper Prototype） — — 無軟體實作門檻，加速概念溝通
 c. 使用案例（Use Cases） — — 理解設計與互動概念細節
 d. 流程圖（Flow Chart） — — 設計師和工程師溝通的好工具
 e. 線框圖（Wireframe） — — 元件細節＋操作互動流程
 f. 行動建模工具（Mobile UI Prototype Tool） — — 模擬軟體

心得環節

🙌本篇最大重點：原型的目的在於「溝通」🙌

每個人的想像與認知不盡相同，若只有口說或是文字表達難免會雞同鴨講起爭議（？）因此「具象化（不論使用何種原型）」是很重要的。很像是「對齊心智模型」的概念。確定大家認知是一樣的，溝通才能順利且有效地進行。

回答共學講義上的問題：
你覺得原型設計需要考慮哪些要素呢？ 哪最重要？

我覺得需要考慮：使用者需求、產品概念、資料架構、介面操作互動流程

至於哪個最重要，畢竟設計最根本就是為了解決（使用者的）問題，才會衍生後續的產品概念、資料架構、介面操作互動流程……等，
因此我認為最重要的果然還是使用者需求 吧！

關於我