原型設計，是每個交互設計師和產品經理最基本的技能，也是一個梳理思路很好的方式。

關于什么是原型

為了討論方便，有必要先做一個簡單的定義。

這里的原型指的是對最終產品各頁面上內容的簡單呈現，通常不會設置顏色和字體，也不含圖片。這里的原型，也通常被稱作線框圖、示意圖、藍圖。在一些極端的情況下，原型圖往往可以先被抽象成一個個的模塊組合，然后再去細化每個模塊中的內容極其展示形式。

原型的主要作用是為了溝通最初的產品設想。原型圖展示的是內容和結構及粗線條的布局，而不是視覺設計。

一定程度上，原型圖是為了說明用戶將如何與產品進行交互，其主要受眾是團隊里的工程師與設計師。原型圖一定要體現出用戶在每個頁面上期望看到的內容，以及這些內容在頁面上的相對優(yōu)先級。通常情況下，原型圖在紙上呈現，也可以使用一些特定的軟件進行制作，常見的包括 Axure、Visio 等。

所以，根據這個定義和解釋。我們接下來討論的問題，主要是圍繞著 Web 網站和 APP 的原型設計進行的。

關于原型的精細程度

業(yè)界普遍的認知是，原型做相對中保真即可。中保真的原則是，對照原型，團隊的設計師和工程師能夠明白我們要做的是一件什么事情及這件事的重點就可以了。

當然，還存在另外一個觀點，原型，必須是要高保真的。對于這個觀點，個人持保留意見。高保真的原型需要花費更多的精力，同時，不夠敏捷。

關于原型繪制工具

在程序員的世界里，終極問題是，什么是最好的語言？在前端工程師的世界里，終極問題是，什么是最好的瀏覽器？在產品經理和交互設計師的世界里，終極問題是，什么是最好的原型工具？

基本上，不存在絕對好用的工具，完全取決與自己的愛好與使用是否順手。關于原型繪制工具，網絡上有很多人總結了很多不同的工具，你可自行選擇。我個人使用的比較順手的是 Axure。

哦，對了，實際上最好用的原型設計工具，最后，我發(fā)現，是紙和筆。在快捷酒店管家的實際項目運作中，我們更多的是運用白板來繪制原型，然后將經過討論通過的原型用手機拍下來做記錄存檔。

關于 Axure 的使用

1、千萬不要去學習復雜的交互動作！

首先，在 Axure 里使用復雜的交互會上癮，這將大大的浪費你的時間；其次，設計師和工程師都不會看你的復雜交互動作的，他們只覺得這是個圖形而已；第三，如果你真想學，為什么不去學 DIV+CSS 呢？

2、如果你確實需要表達一個復雜的交互，可以考慮將這個交互拆解了表述

典型的比如一個輸入框的不同狀態(tài)。可以拆解為，獲得焦點激活輸入框 – 正在輸入中 – 輸入完成激活提交按鈕 – 點擊提交按鈕完成提交。

這種拆解的方式，雖然看上去會占篇幅，但是卻實在是最容易被理解的，連流程圖都能省略了。

3、可以考慮將需求文檔與Axure原型結合起來

只是說可以，沒說一定要這么做。這是我一直在使用的一種方式，我自己覺得效果還不錯，詳細的可以參考“基于 Axure 的 PRD 協(xié)作”，不再贅述。

4、一定要有一套屬于自己的控件庫

控件庫，簡單理解就是將產品拆解成很多的小零件，當你需要的時候，將這些零件進行組裝即可。這可以大大的提高你的原型制作效率。

關于原型控件，每個原型工具都有，你可以自己網上搜索。在實際運用的過程中，你可以根據自己的需要對這些控件做修改，之后可以再次使用。

5、原型的版本存檔同樣重要

原型，跟實際產品一樣，是會迭代和不斷被修改的，所以，一定要記得存檔。即使是在同一個原型上做修改，也一定要做記錄，這對后續(xù)回顧很重要。

（快捷酒店管家首頁的早期原型）

最后，原型設計，是每個交互設計師和產品經理最最最基本的技能，也是一個梳理思路很好的方式。