方格精選
UI / UX 專有名詞 和 工作流程
閱讀時間約 5 分鐘
最近收到了一封學生的信，詢問在職場中設計流程是什麼？想在公司建立一套基本的制度，且附帶圖片如下：
這張圖片應該許多人都看過，裡頭有很多專業的名詞，以及像金字一樣往上堆疊的順序，在討論工作流程前，我們一樣先來了解每個詞彙代表什麼、以及它存在的目的是什麼。
- User Story ：使用者需求 / 用戶故事。
使用目的：透過故事的描述方法，帶出使用者的目的與需求，進而發想產品需要設計的功能。在每一個描述上，都以最小單元來呈現，也就是盡量拆分的越精細越好。
使用方法：可以透過以下公式來描述。
ex：身為＿＿＿＿，我想要_________，以便於我可以達成＿＿＿＿＿＿＿＿。
ex：身為一個使用者，我想要折價券能依照日期新舊排列順序，以便於我可以將快到期的折價券優先用掉。 - Functional Map：功能架構規劃。
使用目的：將產品所需要的功能做分類，並且列出功能之間的主次順序，以便設計時，能夠俯瞰產品會有哪些功能需要設計。
使用方法：可以使用Coggle軟體，以心智圖方式，將功能做延伸與分類。 - Flow Chart：流程圖。
使用目的：針對某一個功能，畫出開始到結束的整體流程，以及需要的判斷條件。(在此時並不需要畫出介面圖，流程僅需要用文字描述即可。)
使用方法：可以使用Draw.io軟體，將流程圖與判斷時間點畫出來。 - UI Flow：介面流程。
在這裡，許多人會問那跟User Flow有什麼不同？網路上查詢的資料也都不盡相同。而我自己的定義是：
UI Flow ：有頁面圖的流程。
User Flow：以文字來形容的流程。
使用目的：畫出頁面之間的操作動線。
使用方法：可以用Wireframe將畫面以線條方式，來做視覺上的連結，表示跳頁的順序。 - Wireframe：畫面線框稿。
使用目的：畫出低保真度的原型設計，在沒有任何視覺設計 (顏色、排版) 的狀態下，確認每一頁的元件構成是否完整，以及能否達到目標功能。
使用方法：利用設計軟體，將每個畫面必有的元件與架構畫出來。 - Mockup：視覺設計稿。
使用目的：設計師必須依照Wireframe的畫面架構，進行視覺設計、畫面特效、版面形式呈現等，以增強產品質感與使用體驗。
使用方法：利用設計軟體，例如：Sketch、Figma、Adobe XD，依照產品Design Guideline產出視覺。 - Prototype：動態原型。
使用目的：確認畫面之間的連接是否正確、功能達成目標、操作體驗，以便在進入開發前可以找出問題點。
使用方法：利用軟體，將畫面上的元件，以動態方式來做點擊跳頁、或是模擬動畫呈現，協助使用者能更深體驗產品。
終於描述完一大堆名詞了～先喘口氣。
接下來，你可能還是會有疑問：我都知道了這些名詞的意思了，那麼實際的工作流程是什麼呢？
以我在業界的經驗來說，並沒有制式的SOP流程，有時候會因為時程很短、或是緊急bug需要修復，會快速討論快速產出，並不會每個流程都會跑過。
但若在一般產品開發流程，我認為會有以下步驟：
- 定義需求（需求可能是從：關係利益者、數據研究、使用者訪談、User Story歸納而來）
- IA (資訊架構)
- Flow Chart
- Wireframe
- Mockup + Spec(標記)
這好像跟一開始的圖差別很大，而且少了很多項目。其實在每個產業、公司的工作流程都不盡相同，以上是我在業界及接案過程中，歸納出的結論。也就是必須最少要有以上五個步驟，才能確保產品在討論、規劃、設計時，能夠足夠嚴謹，符合開發目標，並與各部門同步資訊。
而其他的項目，若有時間，你也可以試試看把它做出來。每個步驟堆疊的目的都是：「洞察真實需求、縝密規劃設計、功能實質落地。」因此沒有必須一定要走完哪一個步驟，有時侯一個bug出現，可能就要直接畫出wireframe確認是否這樣能解決？PM或是RD確認OK後，就出立刻畫出Mockup，快速寫上Spec，交稿！
若你正在思考，要如何在公司建立完整的設計流程，不妨先確認看看各部門在過去是如何溝通與解決問題的，然後從中思考哪裡可以改善，把適當的設計步驟納入組織內跑跑看，如果能提升工作效率、減少溝通落差、加速開發時間，那麼就是值得做的。
但千萬記住，計畫永遠趕不上變化，一定要學習「在什麼時候，要做什麼才是對的事」，固執與講究完美，是很難跟上快速變化的市場哦！
我是Lisa，收收UI / UX 和 Taiwan UI / UX人生設計學創辦人，曾任職平面設計師、網頁前端工程師，最後轉職到自己喜歡職位 - UI / UX Designer，目前也是一位講師，致力於零基礎教學，與協助想轉職的人。
目前有開設零基礎的Photoshop、illustrator課程，歡迎一起來增加職場技能樹！
為什麼會看到廣告
107會員
17內容數
留言0
查看全部
你可能也想看
Google News 追蹤
這個秋，Chill 嗨嗨！穿搭美美去賞楓，裝備款款去露營⋯⋯你的秋天怎麼過？秋日 To Do List 等你分享！
秋季全站徵文，我們準備了五個創作主題，參賽還有機會獲得「火烤兩用鍋」，一起來看看如何參加吧～
美國總統大選只剩下三天， 我們觀察一整週民調與金融市場的變化（包含賭局）， 到本週五下午3:00前為止， 誰是美國總統幾乎大概可以猜到60-70%的機率， 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
當我們學了一身UIUX設計技能，加上在社群等不同場合走跳，蠻容易遇到接案機會的，最少，每個出來接案的人都會遇過親戚朋友跑來問你能不能幫忙做個東西。
事實上最常遇到的下一句是業主問：「能不能先給我報個價？」
在設計經歷上，每個產品的接觸階段會造成並產生的經驗值也有所不同，也會反映在面試跟薪資上，這裡我會把每一個介面設計師會遇到的成長歷程，整理歸納成這幾個階段，可以透過下面的歸類看看自己目前屬於這裡面哪一個階段：
在 UIUX 界有許多專有名詞很常出現卻不知道是什麼意思？查到了也不確定哪一個說法才是正確的？以下整理了一些業界常出現的專有名詞與解釋，並歸納整理為 UX/PM 相關，UI 設計相關，以及業界相關的名詞，並附上這些參考資料與適合製作的工具供參考，之後也會持續更新，保持最新的狀態。
UX/PM 相關
進入 UIUX 領域，會發現其實現在市場上不只有這兩個職位，還有更多相關的職位也出現在名單內，到底這些職稱是什麼意思？實際工作又是做些什麼呢？現今職場上的 UIUX 設計師又有什麼種類呢？市場的需求又是什麼？未來的發展在哪裡？這邊將介紹目前市面上常見的職位，並附上一些實際的市場職缺來分析他們的可
要成為一個專職的 UIUX 設計師，需要設計工具來進行工作。在2021 的今天，UIUX 的設計工具有哪些選擇？又會花費多少錢呢？這篇文章將會介紹電腦的選擇以及設計軟體的選用，讓您能對設計工作的工具有所認識。
而設計工具軟體的會花比較多的篇幅介紹市場主流的設計工具軟體，其他的則是會帶上網站連結跟初步
UIUX設計，應該還蠻多人苦惱工作或是實習機會到底要怎麼找吧？
這些網站上含括了大部分的IT公司（也就是說大部分的ＩＴ公司之類的辦實習或是招募新卒都會在這些平台上面打廣告）
當然，少部分知名度比較大的公司因為本身就具有名氣優勢，可能就不會在上面打廣告，需要找特定大公司的職缺或是實習機會，建議去
日本本來就是平面設計非常成熟的國家，不管是美大還是專門學校基本上上過一陣子學（？）都能產出非常不錯的設計成品。雖然在二年級上學期的成績來說處於班上前段班，但是看著學校的告示欄，45小時的加班費加成後還是不到20萬日圓的薪水，學長姐有血有淚的找工作過程，突然覺得如果能夠掌握並運用其他能力（例如原本就有
這個秋，Chill 嗨嗨！穿搭美美去賞楓，裝備款款去露營⋯⋯你的秋天怎麼過？秋日 To Do List 等你分享！
秋季全站徵文，我們準備了五個創作主題，參賽還有機會獲得「火烤兩用鍋」，一起來看看如何參加吧～
美國總統大選只剩下三天， 我們觀察一整週民調與金融市場的變化（包含賭局）， 到本週五下午3:00前為止， 誰是美國總統幾乎大概可以猜到60-70%的機率， 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
當我們學了一身UIUX設計技能，加上在社群等不同場合走跳，蠻容易遇到接案機會的，最少，每個出來接案的人都會遇過親戚朋友跑來問你能不能幫忙做個東西。
事實上最常遇到的下一句是業主問：「能不能先給我報個價？」
在設計經歷上，每個產品的接觸階段會造成並產生的經驗值也有所不同，也會反映在面試跟薪資上，這裡我會把每一個介面設計師會遇到的成長歷程，整理歸納成這幾個階段，可以透過下面的歸類看看自己目前屬於這裡面哪一個階段：
在 UIUX 界有許多專有名詞很常出現卻不知道是什麼意思？查到了也不確定哪一個說法才是正確的？以下整理了一些業界常出現的專有名詞與解釋，並歸納整理為 UX/PM 相關，UI 設計相關，以及業界相關的名詞，並附上這些參考資料與適合製作的工具供參考，之後也會持續更新，保持最新的狀態。
UX/PM 相關
進入 UIUX 領域，會發現其實現在市場上不只有這兩個職位，還有更多相關的職位也出現在名單內，到底這些職稱是什麼意思？實際工作又是做些什麼呢？現今職場上的 UIUX 設計師又有什麼種類呢？市場的需求又是什麼？未來的發展在哪裡？這邊將介紹目前市面上常見的職位，並附上一些實際的市場職缺來分析他們的可
要成為一個專職的 UIUX 設計師，需要設計工具來進行工作。在2021 的今天，UIUX 的設計工具有哪些選擇？又會花費多少錢呢？這篇文章將會介紹電腦的選擇以及設計軟體的選用，讓您能對設計工作的工具有所認識。
而設計工具軟體的會花比較多的篇幅介紹市場主流的設計工具軟體，其他的則是會帶上網站連結跟初步
UIUX設計，應該還蠻多人苦惱工作或是實習機會到底要怎麼找吧？
這些網站上含括了大部分的IT公司（也就是說大部分的ＩＴ公司之類的辦實習或是招募新卒都會在這些平台上面打廣告）
當然，少部分知名度比較大的公司因為本身就具有名氣優勢，可能就不會在上面打廣告，需要找特定大公司的職缺或是實習機會，建議去
日本本來就是平面設計非常成熟的國家，不管是美大還是專門學校基本上上過一陣子學（？）都能產出非常不錯的設計成品。雖然在二年級上學期的成績來說處於班上前段班，但是看著學校的告示欄，45小時的加班費加成後還是不到20萬日圓的薪水，學長姐有血有淚的找工作過程，突然覺得如果能夠掌握並運用其他能力（例如原本就有