【產品經理知識】一次帶你看懂原型設計 Prototype

Martin
馬汀陪你讀本書
May 30, 2021

身為一個產品經理,原型一定是最基礎的專業技能之一,因為無論從早期的產品雛形、需求確認、開發團隊內部溝通,都會需要用到原型設計 Prototype。

通過原型設計,可以給開發、UI 設計等人員了解產品最終的模樣,可以大大的降低溝通成本,提高開發效率。
而產品原型不單單只是溝通與確認的工具。產品經理可以透過製作原型的過程,更了解產品需求,進行需求彙整、分析、解決與優化。

產品原型大概是什麼模樣?

產品新手開開始接觸原型時,建議先從區分線框圖、原型開始,這二個名詞非常相似,也容易搞混。
但這二者其實是一個演過的過程,通常先有線框圖,第二步才開始製作原型原型,最後再請 UI 設計師出視覺稿給工程師團隊。

線框圖 Wireframe:

線框圖

線框圖又稱低保真設計圖,你可以採用手繪或是用 Axure 這類的工具,繪製出簡單的黑白線條來表達設計 UI 介面,並在旁邊標註一些解釋性的文字。

線框圖的優勢在於製作快速,繪製時不需要注意UI的真實程度,只要繪製出整體排版的架構,重點是讓線框圖傳達出你的產品構想與設計內容。

原型 Prototype:

Source: https://dribbble.com/shots/5438599-Bill-splitting-app

原型可以說是線框圖的進化版本,UI 保真程度大大的提升,畫面看起來很接近最終產品。所以也可以很直觀的傳達出產品的畫面排版與互動邏輯,讓操作原型的人可以快速了解產品的樣貌。

原型設計對於資訊行業來說非常重要,主要的原因為:

  1. 製作成本低,開發、更新速度快
  2. 直觀、準確的傳達產品樣貌與需求
  3. 可以有效率的驗證假設條件與初期的設計構想
  4. 提高團隊溝通的效率

原型依照使用情境,分為實行性原型、用戶原型、即時資料原型、混合原型技術,每一種都有各自的優缺點,以下我會逐一介紹。

用戶原型 ( User Prototype )

用戶原型是產品經理最常用的原型,幾乎每一個新功能都會使用到。
製作重點會放在讓用戶操作以後,可以知道大致的操作流程,同時也可以知道操作後會得到什麼結果,主流的工具大多為 Axure 或 Figma 。

User Prototype 並不局限於使用逼真的 UI ,視情況可以選擇 Low-Fidelity 或 High-Fidelity ,重點會放在讓用戶了解整體操作的過程及步驟上。

👍🏻 優點:製作時間短、可快速了解操作步驟
☠️ 缺點:互動程度有限

實行性原型 ( Feasibility Prototypes )

類似於雛型或是最小可行性產品,用程式打造大致的框架與流程,但不開發太細節的部分,如測試或是例外處理。

開發團隊也常在此階段發現後續可能出現的實行性風險,如擴展性問題、第三方服務等等。

👍🏻 優點:可以讓開發團隊更了解技術上未知的難題,如演算法、新技術等,減少實行性風險
☠️ 缺點:製作時間較長

即時資料原型 ( Live-Data Prototypes )

這個主要用於純資料、效能優化 、第三方介接的模擬,有些功能是不會有 UI 介面的。

所以工程師需要先去嘗試是否可行,例如:自動化測試、第三方支付、國際化、A/B Test 等等。

混合原型技術 ( Hybrid , Wizard of OZ Prototype )

使用高度還原的 UI 來讓用戶體驗真實操作的感覺,系統的背後再由真人去執行比較複雜的商業邏輯或資料處理。

這個方式雖然看起來很像應急,但實際上整體的操作過程會讓用戶覺得這是產品真正的樣貌,可以看到用戶最真實反應。

👍🏻 優點:真實程度高、使用者反饋最貼近真實
️☠️ 缺點:通常無法擴展,限於少量用戶測試體驗

總結

完成原型以後,下一步會是將原型發送給產品專案的重要關係人進行可用性測試,在操作、體驗完原型的過程中,會發現產品設計中的問題並且提出反饋意見。

產品經理會把問題與意見彙整,再回頭調整原型,直到大家對於產品的理解都統一了以後,後續的 UI 設計、程式開發、測試等等都會依照最終的原型進行設計與開發。

所以透過優良的原型,我們可以確保大家認知裡的產品與最終產品盡量一致,減少專案中溝通的成本,提高開發效率,更重要的是可以降低開發出來的產品不符合需求的重大風險。

謝謝你的閱讀! 如果有任何疑問、想聽的主題,歡迎在下面留言給我,我會盡可能回答!如果想給我一點鼓勵,請給我 1–10 個拍手;
如果覺得文章對你有些幫助,請給我 10-30 個拍手;
如果你因為這篇文章讓生活產生了一點改變,請給我 30+ 個拍手讓我知道 👏🏻

--

--