原型設(shè)計(jì)是每個(gè)交互設(shè)計(jì)師和產(chǎn)品經(jīng)理的最基本技能，也是理解思路的好方法。

關(guān)于什么是原型

為了便于討論，首先需要做出簡(jiǎn)單的定義。

這里的原型是指最終產(chǎn)品每頁(yè)上的內(nèi)容的簡(jiǎn)單表示，通常沒(méi)有設(shè)置顏色和字體，也沒(méi)有圖像。這里的原型通常也稱為線框，原理圖和藍(lán)圖。在某些極端情況下，原型圖通?？梢猿橄鬄閱为?dú)的模塊組合，然后細(xì)化每個(gè)模塊中的內(nèi)容。

原型的主要作用是傳達(dá)原始產(chǎn)品愿景。原型顯示內(nèi)容和結(jié)構(gòu)的布局和粗線，而不是視覺(jué)設(shè)計(jì)。

在某種程度上，原型是為了說(shuō)明用戶如何與產(chǎn)品進(jìn)行交互，主要受眾是團(tuán)隊(duì)中的工程師和設(shè)計(jì)師。原型圖必須反映用戶期望在每個(gè)頁(yè)面上看到的內(nèi)容以及這些內(nèi)容在頁(yè)面上的相對(duì)優(yōu)先級(jí)。通常，原型在紙上呈現(xiàn)，可以使用某些特定的軟件進(jìn)行制作，包括Axure，Visio等。

所以，基于這個(gè)定義和解釋。我們接下來(lái)討論的問(wèn)題主要圍繞Web 網(wǎng)站和APP的原型設(shè)計(jì)。

關(guān)于原型的精細(xì)程度

業(yè)界普遍認(rèn)為原型可以相對(duì)保真。保真原則是，對(duì)于原型，團(tuán)隊(duì)的設(shè)計(jì)師和工程師可以理解我們將要做什么以及這個(gè)問(wèn)題的重點(diǎn)是什么。

當(dāng)然，還有另一種觀點(diǎn)，原型必須是高保真的。個(gè)人對(duì)這一觀點(diǎn)持保留態(tài)度。高保真原型需要更多的努力并且不那么靈活。

關(guān)于原型繪制工具

在程序員的世界里，最終的問(wèn)題是，什么是最好的語(yǔ)言？在前端工程師的世界里，最終的問(wèn)題是，什么是最好的瀏覽器？在產(chǎn)品經(jīng)理和交互設(shè)計(jì)師的世界中，最終的問(wèn)題是，什么是最好的原型設(shè)計(jì)工具？

基本上，根據(jù)您的愛(ài)好和用途是否容易，沒(méi)有絕對(duì)有用的工具。關(guān)于原型制作工具，網(wǎng)絡(luò)上有很多人總結(jié)了許多不同的工具供您選擇。我個(gè)人使用的是Axure。

哦，是的，實(shí)際上使用了最好的原型制作工具。最后，我發(fā)現(xiàn)它是紙和筆。在Express Hotel Butler的實(shí)際項(xiàng)目操作中，我們使用白板繪制原型，然后采用已討論的原型并使用它來(lái)記錄它。

關(guān)于 Axure 的使用

1、千萬(wàn)不要去學(xué)習(xí)復(fù)雜的交互動(dòng)作！

首先，在Axure中使用復(fù)雜的交互是令人上癮的，這將浪費(fèi)你的時(shí)間。其次，設(shè)計(jì)師和工程師不會(huì)看你復(fù)雜的互動(dòng)。他們只是認(rèn)為這是一個(gè)圖形。第三，如果你真的想學(xué)習(xí)，為什么不學(xué)習(xí)DIV + CSS？

2、如果你確實(shí)需要表達(dá)一個(gè)復(fù)雜的交互，可以考慮將這個(gè)交互拆解了表述

典型值，例如輸入框的不同狀態(tài)?？梢苑磪R編以獲得焦點(diǎn)激活輸入框 - 在輸入中 - 輸入完成激活提交按鈕 - 單擊提交按鈕以完成提交。

這種拆解方式雖然似乎占用空間，但實(shí)際上最容易理解，甚至可以省略流程圖。

3、可以考慮將需求文檔與Axure原型結(jié)合起來(lái)

只是說(shuō)是的，我沒(méi)有說(shuō)我必須這樣做。這是我一直在使用的方式，我認(rèn)為效果并不差，詳情請(qǐng)參考“基于Axure的PRD協(xié)作”，不再重復(fù)。

4、一定要有一套屬于自己的控件庫(kù)

控制庫(kù)，簡(jiǎn)單的理解是將產(chǎn)品拆解成許多小零件，并在需要時(shí)組裝它們。這可以大大提高您的原型制作效率。

關(guān)于原型控件，每個(gè)原型工具都有它，您可以在線搜索。在實(shí)際的應(yīng)用程序中，您可以根據(jù)需要修改這些控件，然后再次使用它們。

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

與實(shí)際產(chǎn)品一樣，原型是迭代的并且經(jīng)常被修改，所以一定要記住存檔。即使您對(duì)同一原型進(jìn)行更改，也必須進(jìn)行記錄，這對(duì)后續(xù)檢查很重要。

（Express Hotel Butler主頁(yè)的早期原型）

最后，原型設(shè)計(jì)是每個(gè)交互設(shè)計(jì)師和產(chǎn)品經(jīng)理的最基本技能，也是理解思路的好方法。