翻譯自書《The Ultimate Guide to Prototyping》鹦牛，翻譯的較為倉促，有不恰當(dāng)之處還望指正能岩。轉(zhuǎn)載請注明出處。

原型設(shè)計(jì)可以將最終產(chǎn)品的功能近距離的展示給你辈赋「嘌啵框架勾勒出產(chǎn)品的藍(lán)圖，樣機(jī)展示的是展品的感覺和材質(zhì)坝辫，而原型讓用戶體驗(yàn)背后的“體驗(yàn)”生活起來。美妙的點(diǎn)擊響應(yīng)在屏幕上看起來可能很好竭业，但是必須在可觸擊的原型實(shí)現(xiàn)之后，你才知道這個效果在用戶端可不可用未辆。原型，不僅可以提供概念上的證明兼蜈，更重要的是拙友，他們可以提供產(chǎn)品框架和樣機(jī)無法提供的可用性檢測。

原型可以當(dāng)做一個安全防御工程遗契，用來抵抗那些股權(quán)持有者的緊急會議要求、無盡的修改和在開發(fā)階段的痛苦的加班涉瘾。那么捷兰，我們?nèi)绻\(yùn)用它呢负敏？之前在Guide To UX Design Process & DOcumentation當(dāng)中，我們曾接觸過正確的原型設(shè)計(jì)其做，那么現(xiàn)在，我們將用整整一本書來解釋原型設(shè)計(jì)如何可以成就或毀掉一個產(chǎn)品驹沿。

需要原型設(shè)計(jì)的5大理由

盡管在設(shè)計(jì)過程中跳過原型設(shè)計(jì)可能會節(jié)約一些時間蹈胡，但是在開發(fā)過程中很可能會浪費(fèi)更多的時間。如果人們在買褲子之前習(xí)慣試一試罚渐，在買車之前習(xí)慣試試車，那么在開發(fā)階段之前測試一下你的設(shè)計(jì)交互也就有跡可循了合砂。畢竟源织，交互是用戶遇到問題后解決問題的途徑微猖。

為了更好的解釋我們?yōu)槭裁葱枰驮O(shè)計(jì)幻工，讓我們一起來看一看曾經(jīng)寫過一本原型設(shè)計(jì)書的Todd Zaki Warfel怎么說的。Warfel在一個幻燈片演示中總結(jié)了他書中的觀點(diǎn)囊颅，在這個幻燈片中我們可以看到所有相關(guān)的原因。盡管盲憎，原型設(shè)計(jì)的好處可能因?yàn)樵O(shè)計(jì)師和他們的需求不同而改變胳挎，但是，一些普遍的好處還是存在的：

1. 交流與合作——討論需求文檔是一回事慕爬，而如果合作雙方都可以利用原型設(shè)計(jì)來共同探究產(chǎn)品的限制和可能性，則會給合作帶來另外一種好的體驗(yàn)磅甩。文檔可能會產(chǎn)生誤解姥卢，而經(jīng)驗(yàn)卻可以共同分享。

2. 討論可能性的同時減少損耗——框架独榴、樣機(jī)、需求文檔都存活于紙上瓶堕，并不真實(shí)存在症歇。原型則讓團(tuán)隊(duì)成員可以共同體驗(yàn)，即使失敗也不會浪費(fèi)太多精力当船，同時還可以學(xué)的更多。我們只需要看一看原型是如何幫助團(tuán)隊(duì)提升50%的精確性苍息，同時降低80%的解釋需求。

3. 推廣你的想法——如果你正和挑剔的客戶一起工作竞思，那么原型是一個很好的解救方法盖喷。體驗(yàn)真正的網(wǎng)頁或者APP比文字描述或者帶著備注符號的樣本更能展現(xiàn)你的視角爆办。

4. 更早測試可用性——通過用戶測試原型课梳，你可以盡早發(fā)現(xiàn)問題并解決他們，這幫你避免了一個很大的麻煩跨算，你不用在當(dāng)他們變成代碼之后再去解決椭懊。上面提到的同個案例分析發(fā)現(xiàn)，原型可以在產(chǎn)品發(fā)布之前幫助解決25%的BUG背犯。

5. 設(shè)置你的設(shè)計(jì)優(yōu)先級——我們推薦盡早的使用原型盅抚，大部分時候是因?yàn)楸M早的交互設(shè)計(jì)可以讓你在做靜態(tài)設(shè)計(jì)決定的時候，保證你的設(shè)計(jì)盡可能的實(shí)用泉哈。視覺必須去滿足體驗(yàn)破讨，而不是滿足其他東西。

不是每一個原型都需要非常的精細(xì)和耗費(fèi)精力的烫沙，事實(shí)上隙笆，一些人更推崇快速、低成本的原型設(shè)計(jì)方式撑柔。這個想法的核心在于，在原型設(shè)計(jì)過程中剪决，投入一些資源嘗嘗是有好處的。但是具體投入多少柑潦，是要根據(jù)你具體的需求來決定的。

原型如何提升交流與合作览露？

展示永遠(yuǎn)比說好譬胎，體驗(yàn)才是王道。如果人們可以和你的想法交流堰乔，那么你最好保證他們能夠懂你的想法。這對內(nèi)對外都有好處夹孔。對外析孽，你可以和客戶和股東們周旋，對內(nèi)袜瞬，你可以和你的團(tuán)隊(duì)更好的合作，或者是說服他們支持一個全新的想法（或者至少是不那么快的反對）拍鲤。

原型設(shè)計(jì)從幾個方面幫你解決內(nèi)部交流問題汞扎。

首先，它幫你盡早的建立起設(shè)計(jì)師和開發(fā)人員的聯(lián)系澈魄，讓他們擁有相同的工作目標(biāo)。不同的部分使用的是不同的術(shù)語铛漓，但是原型卻打破了這些障礙鲫构。原型是設(shè)計(jì)的玩具。當(dāng)一個東西很有趣的時候结笨，人們更容易卸下他們的防御，開始嘗試那些可能起作用的瘋狂想法杜窄。就像Emmet實(shí)驗(yàn)室的創(chuàng)始人兼CEO（David Yerba）所說：原型讓對的人以對的方式交流。

第二蚀腿，Yerba在同一篇文章中提到了原型在正式演講中的好處扫外。客戶和股東很容易誤解文字描述筛谚，即使這些描述中帶有令人信服的調(diào)查或者像素完美的原型。另一方面蚊伞，交互原型需要很少的描述吮铭。原型讓股東們思考用戶體驗(yàn)，而不是去挑剔那些正好出現(xiàn)在他們面前的視覺元素谓晌。還有一點(diǎn)，原型讓你的項(xiàng)目展示更有吸引力——人們可以真正體驗(yàn)設(shè)計(jì)的奇妙之處：看產(chǎn)品草圖和探索交互模型還是很不同的溺欧。

原型對任何一個項(xiàng)目展示都是一個利器柏肪。David和Tom Kelley， IDEO的創(chuàng)始人和合作者预吆，將之成為“Boyle’s定律”胳泉。Boyle定律很簡單，但是也很有效：參加會議永遠(yuǎn)都帶著原型凤瘦。原型所擁有的交流優(yōu)勢和說服力經(jīng)常案铺，會讓你的展示結(jié)果有“是”和“不是”的區(qū)別。

原型如何為設(shè)計(jì)帶來平衡笔诵？

原型設(shè)計(jì)讓概念成為現(xiàn)實(shí)，所以它不僅需要創(chuàng)造力乎婿，也需要實(shí)用性，不僅需要理性捍靠，也需要沖動森逮。

Art Center College of Design的教授和設(shè)計(jì)師Philip van Allen認(rèn)為，原型可以幫助人們做出無法用參數(shù)表達(dá)的決定褒侧。對于設(shè)計(jì)師來說，原型設(shè)計(jì)主要有三個好處：

1. 幫助做出決策——關(guān)于人機(jī)工程學(xué)拖吼、形狀这吻、功能、產(chǎn)出等的重要設(shè)計(jì)選擇往往可以在原型設(shè)計(jì)過程中決定下來唾糯。一個起作用的原型可以給你及時的反饋移怯，讓你做出一個有根據(jù)的決定（而不僅是一個探索式的決定）。

2. 幫助集中注意力——有了全方位的具體反饋（而不是一個對最終產(chǎn)品簡單的猜測）舟误，原型讓你處于用戶現(xiàn)實(shí)中。當(dāng)你可以體驗(yàn)就在你面前的東西時眯牧，UX優(yōu)先級也會非常明顯赖草。

3. 保證平行性——設(shè)計(jì)過程不必是線性的。手機(jī)反饋秧骑，設(shè)定需求扣囊，頭腦風(fēng)暴新的概念和交互可以和原型設(shè)計(jì)同時進(jìn)行绒疗。當(dāng)單一任務(wù)完成時，會互相補(bǔ)充其他任務(wù)盒至。

我們怎么知道這個的呢士修？當(dāng)我們在改進(jìn)Telp網(wǎng)站的時候，我們首先建立了一個低保真原型棋嘲，然后是一個高保真原型沸移。最初，交互是很簡單的雹锣，但是當(dāng)我們漸漸開始設(shè)計(jì)時，我們會遇到不同的決策和困難辉哥，但是他們通常是無法通過靜態(tài)設(shè)計(jì)完成的攒射。通過原型設(shè)計(jì)，我們發(fā)現(xiàn)和解決了UX問題会放，例如我們?nèi)绾螐闹黜撎D(zhuǎn)到搜索結(jié)果，而不會產(chǎn)生過多的信息干擾用戶捂人。

長話短說矢沿，原型設(shè)計(jì)就是我們可以將概念目標(biāo)和實(shí)用的現(xiàn)實(shí)結(jié)合起來。它讓視覺設(shè)計(jì)和交互設(shè)計(jì)得到了平衡论熙。

原型如何讓可用性測試更簡單摄狱？

為什么我們要將任務(wù)分成框架、草圖媒役、原型？那是因?yàn)樗麄兏髯該碛胁煌哪康摹?br>

比如交惯，通過僅僅集中在構(gòu)建框架時穿仪，我們可以構(gòu)造一個堅(jiān)實(shí)的結(jié)構(gòu)，而不必分心去設(shè)計(jì)草圖的美觀和原型功能性啊片∽瞎龋框架和草圖更多的是創(chuàng)造力和抽象里，而原型設(shè)計(jì)則是關(guān)于分解笤昨，并將想法帶入現(xiàn)實(shí)——而這需要可用性測試來支持。

讓我們來做個類比捺僻，原型對于最終產(chǎn)品崇裁，就像草圖對于框架/原型。原型設(shè)計(jì)就是帶有交互的畫草圖寇壳，來構(gòu)造一個可用性模型，然后再慢慢重塑和修改它泞歉。對此匿辩，可用性測試就顯得非常重要。我們建議在原型設(shè)計(jì)的每一個階段都設(shè)計(jì)可用性測試并相應(yīng)地進(jìn)行迭代挺庞，以此保證它的穩(wěn)健性和功能性朝著正確的方向發(fā)展稼病。因?yàn)榭捎眯詼y試的內(nèi)容非常的多掖鱼，我們在這里有一些基礎(chǔ)知識來幫助大家掌握它：

1. 了解你的產(chǎn)品——詳細(xì)地了解你的產(chǎn)品援制，在你開始之前就了解你需要測試的東西。如果你要對一個表現(xiàn)異常的產(chǎn)品進(jìn)行可用性測試晨仑，或者你不確定需要測試什么洪己，那么你測試的結(jié)果就會無效。

2. 雇傭?qū)Φ臏y試者——如果你的產(chǎn)品是有目標(biāo)用戶群體的答捕，那么請確保你的測試者可以代表那個群體。定型分析最少可以5人晌缘，而定量分析因?yàn)閿?shù)量重要性則最少需要20人痢站。對于如何招募用戶，請查看akob Nielsen’s 的可用性測試雇傭的234條方法和技巧岳枷。

3. 建立正確的測試——可用性測試的方法有很多種呜叫，實(shí)施的方法也很多。請選擇符合你的預(yù)算朱庆、時間和項(xiàng)目需求的。

4. 分析結(jié)果——這一步讓你的可用性數(shù)據(jù)變成設(shè)計(jì)靈感傲诵。請盡可能的將你的分析結(jié)果作用到你的產(chǎn)品迭代中箱硕。

如果你需要知道更多的關(guān)于可用性測試的方法和實(shí)施方法的話，可以下載我們的免費(fèi)電子書“可用性測試導(dǎo)論”栓拜。我們從Apple、DirectTV幕与、Microsoft等公司的實(shí)施方案中總結(jié)了超過30種方法。

為何原型設(shè)計(jì)對移動端設(shè)計(jì)很重要薛耻？

對于電腦產(chǎn)品赏陵，原型設(shè)計(jì)可能很少被推薦饲漾。但是對于移動端設(shè)計(jì)，原型設(shè)計(jì)卻必不可少吃型。移動設(shè)備的使用環(huán)境比桌面設(shè)備更廣僚楞，這帶來了更多的用戶場景和用例。這就意味著泉褐，也許設(shè)計(jì)桌面產(chǎn)品時你可以跳過原型設(shè)計(jì)，但是對于移動端設(shè)計(jì)挺邀，你就沒有這樣的運(yùn)氣了跳座。

Nokia研究中心的高級用戶體驗(yàn)研究院Rachel Hinman認(rèn)為，原型設(shè)計(jì)在移動端的需求已經(jīng)遠(yuǎn)遠(yuǎn)超出了它在桌面產(chǎn)品設(shè)計(jì)中的需求了禾蚕。下面這張圖是基于Hinman的幻燈片的狂丝，這當(dāng)中對比了兩者的穩(wěn)定度：

Greatnorthelectric的產(chǎn)品專家Donna Lichaw也這樣認(rèn)為，并比較了原型設(shè)計(jì)的理由和針對移動端設(shè)計(jì)的理由产舞。手勢的出現(xiàn)帶來交互的全新維度菠剩，在這之前的桌面軟件從來不曾有過。所以原型設(shè)計(jì)是幾乎可以合并手勢和動畫的唯一方式具壮。

以下是我們找到的最有力的移動端原型設(shè)計(jì)理由：

1. 創(chuàng)建或打斷移動端用戶體驗(yàn)流程——由于移動端用戶體驗(yàn)往往跨越數(shù)個頁面，所以使用流程需要專注于設(shè)計(jì)優(yōu)先級上攘已。大家可以訪問UXArchive來查看頂級公司如Snapchat, Google Maps等公司是如何架構(gòu)他們的移動端使用流程的。

2. 動畫讓用戶體驗(yàn)更有趣吠勘、更吸引人——動畫是移動端微交互設(shè)計(jì)的核心元素峡眶，它通常伴隨著手勢出發(fā)的各類效果，比如時間峭拘、速度狮暑、彈跳等，這些效果提供了視覺的反饋和功能的可見性搬男，也增加了不少趣味。

3. UX失誤成本更高——移動APP的成本大概在6000刀到20萬刀不等瞎惫，平均成本大約在6400刀左右译株。和App Store打交道同樣很頭疼，所以預(yù)先的原型設(shè)計(jì)可以很大程度的節(jié)約時間乘寒、成本匪补、精力。

UXPin包含了響應(yīng)式動畫原型以及內(nèi)置的可用性測試夯缺。創(chuàng)建你的任務(wù)，然后你就可以看著你的用戶們的屏幕以及當(dāng)他們和你的設(shè)計(jì)交互時的面部反應(yīng)竿滨。每一個測試之后，你都可以生成一個捕捉到每一個字毁葱、每一個反饋和每一次點(diǎn)擊的視頻贰剥。

總結(jié)與回顧

我們UXPin自身總是會設(shè)計(jì)原型，我們也建議其他人設(shè)計(jì)原型蚌成。我們理解對某些公司來說前痘，設(shè)計(jì)原型會碰到一些限制，但是我們強(qiáng)烈建議仍舊這樣做笑陈，即使成果只是一個受限的原型际度。你會得到的收獲將遠(yuǎn)遠(yuǎn)大于你的投入：團(tuán)隊(duì)更好的合作葵袭，更早的問題發(fā)現(xiàn)與解決涵妥，改進(jìn)現(xiàn)有的設(shè)計(jì)，用行為說話而不是語言坡锡。這些優(yōu)點(diǎn)完全值得你投入額外的時間與精力蓬网。

這一章更多的是一個介紹性的總覽，在下一章節(jié)中鹉勒，我們詳細(xì)談一談如何將原型設(shè)計(jì)帶入你的設(shè)計(jì)過程中，并介紹哪一種保真度更適合你禽额。