原型設計
當今快速成長的產品行業中，用戶體驗(UX)設計變得越來越重要。很明顯，以設計為導向的公司相對於其他公司更有競爭力。“原型”對創造成功的用戶體驗至關重要。但是對許多產品團隊來說，原型仍然是UX設計過程中最令人困惑的部分之一。毫無疑問，原型可以是任何東西，從一系列代表app的不同界面或狀態的紙質草圖，到功能齊全、像素完美的app。
一、什么是“原型”
我們經常在不同的背景里看到“原型”這個詞。 由此，我們很可能已經混淆它的真正含義。
它最基本的含義：原型是設計想法的表達。原型讓設計師們得以展現他們的設計，以及模擬真實的使用場景。在數字化的背景下，原型能夠模擬用戶與界面之間的最終交互行為。根據產品團隊的需求，原型可以模擬整個app或僅單個交互行為。原型可以模擬最終產品的運作方式。它支持產品團隊測試其設計的可用性和可行性。也有很多人將原型與草圖，線框圖和模型混淆，實際上它們不同於原型。“交互性”這個概念是原型的根本，因此這就是為什么草圖，線框圖和模型不能被視為“原型”的理由。
二、原型設計工具
墨刀
墨刀是一款在線原型設計與協同工具，借助墨刀，產品經理、設計師、開發、銷售、運營及創業者等用戶群體，能夠搭建為產品原型，演示項目效果。墨刀同時也是協作平台，項目成員可以協作編輯、審閱，不管是產品想法展示，還是向客戶收集產品反饋，向投資人進行Demo展示，或是在團隊內部協作溝通、項目管理 。
適用范圍：為企業級用戶高保真原型圖，多為移動端app。
優點：組件功能豐富；交互簡單快捷；有PC，網頁，手機多個客戶端；可以使用手機預覽原型。
缺點：只能在線操作；免費版內容受限；自由度一般，不是特別靈活。
Axure
Axure RP是美國Axure Software Solution公司旗艦產品，是一個專業的快速原型設計工具，讓負責定義需求和規格、設計功能和界面的專家能夠快速創建應用軟件或Web網站的線框圖、流程圖、原型和規格說明文檔。作為專業的原型設計工具，它能快速、高效的創建原型，同時支持多人協作設計和版本控制管理。
適用范圍：為企業級用戶高保真原型圖，多為網頁端原型設計，並可以直接導出HTML文件。
優點：自制素材功能強大；交互功能豐富；有較為完備的團隊管理功能；制作網頁簡單，能導出HTML。
缺點：上手難度大，學習成本高；正版軟件價格高昂；長期使用容易卡頓；移動端原型設計不如另外兩種。
Mockplus
摹客（Mockplus）是成都摹客科技有限公司旗下設計協作品牌，專注於一站式的產品設計和協作平台，為產品開發團隊提供全流程協作、高保真設計和設計規范管理支持。摹客可以自產出高保真設計，支持多款主流設計工具（Sketch/PS/XD/Axure等）的設計稿交付，團隊成員在產品、設計到開發的各個工作環節，利用多種設計工具，都能使用摹客平台協同工作。
適用范圍：為企業級用戶高保真原型圖。
優點：操作簡單，上手容易；組件豐富，預覽方式多樣。
缺點：不支持手勢交互；不支持鼠標懸停。
三、保真度
什么是”保真度“？
原型不一定要看起來像最終產品——它們可以有不同保真度。 原型的保真度指的是它如何傳達最終產品的外觀（也就是指它的細節和真實感級別）。
保真度可以在以下方面有所不同：
-
視覺設計
-
內容
-
交互性
原型的類型有很多，基本介於這兩種類型之間。 -
低保真
-
高保真
產品團隊根據原型設計的目的、設計完整性和可用資源來選擇原型的保真度。
低保真原型
低保真（lo-fi）原型設計是將高級設計概念轉換為有形的、可測試物的簡便快捷方法。它首要的也是最重要的作用是——檢查和測試產品功能，而不是產品的視覺外觀。
以下是低保真原型的基本特征：
- 視覺設計：僅呈現最終產品的一部分視覺屬性（例如元素的形狀，基本視覺層次等）。
- 內容：僅包含內容的關鍵元素。
- 交互性：原型可以由真人模擬。 在測試期間，熟悉頁面流程的設計師就相當於一個“計算機”，實時手動呈現設計頁面。此外，也可以給線框圖制作交互效果，這種稱為“交互線框圖”。
優點:
- 便宜。 低保真原型制作的明顯優勢在於其極低的成本。
- 快速。 可以在五到十分鍾內創建一個低保真紙原型。 讓產品團隊可以毫不費力地探索不同的想法。
- 協作。 這種原型設計刺激了小組協作。它的設計不需要什么特殊技能，因此更多人可以參與到設計過程。 即使是非設計師也可以在創意過程中發揮積極作用。
- 清晰。 團隊成員和利益相關者對將來的項目有了更清晰的期望。
缺點:
-
測試期間的不確定性。 使用低保真原型，對於測試者來說，容易不清楚到底什么本來是有效的，什么不是。另外，低保真原型需要用戶充分的想象力，也限制了用戶測試的效果。
-
有限的交互性。 使用這種類型的原型想要傳達復雜的動畫或轉場效果是不可能的。
高保真原型
高保真 (Hi-fi) 原型的呈現和功能，盡可能類似於發布的實際產品。 當團隊能深入了解產品的預期，需要與真實用戶一起測試，或獲得利益相關者的最終設計批准時，通常會創建高保真原型。
高保真原型的基本特征包括:
- 視覺設計：逼真細致的設計 – 所有界面元素、間距和圖形看起來就像一個真正的app或網站。
- 內容：設計人員使用真實或類似於真實內容。原型包括最終設計中顯示的大部分或全部內容。
- 交互性：原型在交互層面非常逼真。
優點:
- 可用性測試期間獲取有意義的反饋。對於用戶來說，高保真原型通常看起來像真正的產品。這意味着，在可用性測試會話中，測試參與者將更有可能自然地表現——就好像他們正在與真實產品交互一樣。
- 對特定 UI 元素或交互的測試。借助高保真交互性，可以測試平面元素，或特定交互, 比如動畫過渡和微交互。
- 輕松獲得客戶和利益相關者的認同。這種類型的原型也適合向利益相關者演示。它使客戶和潛在投資者清楚地了解產品應該如何工作。一個優秀的高保真原型讓人們對你的設計感到興奮，但低保真的原型則不然。
缺點:
- 成本較高。 與低保真原型相比，創建高保真原型意味着更高的時間成本和財務成本。
四、 原型設計實戰—在線蒸汽波播放器
近年來，亞文化越來越流行，甚至已經成為了一種主流。其中的一種文化——蒸汽波是一種由藝術運動延伸出的音樂形式，其多從20世紀80—90年代的歌曲中采樣，復古動感，舒緩流暢，有水汽彌蒙之感。對於大多數音樂平台，蒸汽波這種小眾曲風十分難以尋找。因此，我設計了在線蒸汽波播放器，它將實現蒸汽波的播放，下載，保存喜歡的歌曲、歌單，根據喜歡的歌曲智能推薦蒸汽波歌曲。該原型使用墨刀來制作，包括四個界面：
主頁
主頁可以看到所有功能並且能推薦一些蒸汽波歌曲，可以進入其他頁面。
私人FM（推薦）
該功能會智能的為用戶推薦蒸汽波歌曲，可以對歌曲進行下載或收藏等功能。
我的喜歡
該界面為記錄我的喜歡的界面，可以實現播放歌曲，添加或刪除歌單中喜歡的音樂。
播放界面
播放界面有基礎音樂功能的同時，可以查看歌詞，勾選音樂為我的喜歡，下載，收藏，分享等功能。
