一、網站原型設計工具設計的原型有幾種

原型設計工具有在線的網站版和客戶端版，不管是哪種原型設計工具，其設計的(de)原(yuan)(yuan)型(xing)都(dou)是一樣的(de)，原(yuan)(yuan)型(xing)類型(xing)一般(ban)按(an)保(bao)真(zhen)度分為低保(bao)真(zhen)原(yuan)(yuan)型(xing)、中保(bao)真(zhen)原(yuan)(yuan)型(xing)和高(gao)保(bao)真(zhen)原(yuan)(yuan)型(xing)三種：

1、低保真原型

低保真(zhen)原型呈現的(de)是初步的(de)概念和想法(fa)，可以使用不(bu)(bu)同(tong)的(de)媒介，擁有不(bu)(bu)同(tong)尺寸的(de)原型界面。這種原型是最簡單和便宜的(de)，更換成本最低，包括草(cao)圖、紙質(zhi)原型、線(xian)框(kuang)圖等：

（1）草(cao)圖：草(cao)圖是最初(chu)的想(xiang)法(fa)或假(jia)設，基于業務流程的梳理，結合信息架(jia)構，將核心的用(yong)戶操作界面繪制(zhi)出來(lai)，可以是白板(ban)草(cao)圖，紙(zhi)質草(cao)圖等。通過繪制(zhi)大量不同(tong)的版本來(lai)考(kao)慮(lv)解決界面交互的不同(tong)方法(fa)。

（2）線(xian)框(kuang)(kuang)圖(tu)(tu)：信(xin)息架(jia)構(gou)和(he)草圖(tu)(tu)可以快速(su)演變成線(xian)框(kuang)(kuang)圖(tu)(tu)。線(xian)框(kuang)(kuang)圖(tu)(tu)是靜態的(de)頁(ye)面布(bu)局(ju)，讓我(wo)們思(si)考如何在(zai)屏幕(mu)上(shang)放置不同元素，更好的(de)將信(xin)息架(jia)構(gou)可視化。低保真(zhen)的(de)線(xian)框(kuang)(kuang)圖(tu)(tu)沒有視覺設計，交互方面有也(ye)只是簡(jian)單的(de)跳轉(zhuan)事件，大多數都(dou)使用灰色(se)色(se)階和(he)占位符(fu)來指示內容。

該圖片由注冊用戶"荊湖酒徒"提供，版權聲明反饋

2、中保真原型

中(zhong)保真原型在(zai)某些方面看起(qi)來像最終產品，它在(zai)成本(ben)和價值之(zhi)間(jian)取得平衡，將視覺、交互和展示媒介結(jie)合在(zai)一起(qi)。包括可點擊的原型、編碼(ma)原型等，用戶基于中(zhong)保真原型能夠(gou)完(wan)成一個任(ren)務的閉環，也就(jiu)是通過(guo)與原型界面的交互完(wan)成工作任(ren)務。

（1）可點(dian)擊的原型(xing)：一般(ban)使用原型(xing)設計軟件(jian)構建頁(ye)面(mian)，并給每個頁(ye)面(mian)增加交互式(shi)元素，做到(dao)頁(ye)面(mian)之間可進行交互。

（2）編碼原(yuan)(yuan)型：會編碼的(de)產(chan)品，可以選在瀏覽器中創(chuang)建(jian)中保真原(yuan)(yuan)型。這要求產(chan)品懂得HTML，CSS等技術，可以簡單的(de)構建(jian)中保真原(yuan)(yuan)型，這種原(yuan)(yuan)型展(zhan)示(shi)出的(de)效果，就(jiu)跟(gen)真實的(de)界面很逼真。

3、高保真原型

高保(bao)真原(yuan)型(xing)(xing)經過視(shi)覺設計，這些原(yuan)型(xing)(xing)具(ju)有真實界面(mian)的(de)高度一致，數據的(de)高度仿(fang)真，交互和動(dong)畫也具(ju)備，用戶(hu)能(neng)夠與之進行交互。雖然(ran)看起來像真的(de)一樣(yang)，但它仍然(ran)是一個原(yuan)型(xing)(xing)。

二、怎么評估原型設計的保真度

原(yuan)型設計(ji)通常是(shi)從低保(bao)(bao)真開始，并逐(zhu)漸提(ti)高(gao)(gao)到高(gao)(gao)保(bao)(bao)真的水平，一般保(bao)(bao)真度的評估主要是(shi)看五個方面：

1、視覺細化：指在(zai)界面中視覺像素級別設計(ji)的投入。

2、功(gong)能(neng)廣度：指原型中涵蓋了(le)多少大的功(gong)能(neng)點。

3、功(gong)(gong)能(neng)深度(du)：表明(ming)原型(xing)各個功(gong)(gong)能(neng)的詳(xiang)細程(cheng)度(du)如何。

4、交互性：表示(shi)應用程序或產品的交互部分如(ru)何顯(xian)示(shi)給(gei)用戶(hu)。

5、數(shu)據模型：包(bao)含(han)用戶在界(jie)面中交互的內(nei)容(rong)以及產品(pin)前(qian)端和后端使(shi)用的數(shu)據。

三、如何選擇合適的原型類型

原型設計工具設計的原(yuan)型(xing)類型(xing)可分為三類，選(xuan)擇(ze)時(shi)并不(bu)(bu)一定保(bao)真(zhen)(zhen)(zhen)度越(yue)高越(yue)好，如果原(yuan)型(xing)保(bao)真(zhen)(zhen)(zhen)度過高，用戶(hu)就(jiu)會以為設計已經完成，過分關注(zhu)細(xi)節，而(er)忽略(lve)整體方案；但(dan)原(yuan)型(xing)保(bao)真(zhen)(zhen)(zhen)度太低也不(bu)(bu)行，用戶(hu)可能會迷(mi)失方向，不(bu)(bu)理(li)解原(yuan)型(xing)的目的是什么(me)。

一(yi)般來說，設(she)計師需要根據目(mu)標(biao)和產(chan)品所處的階(jie)段(duan)來選擇適(shi)當的保真度原型，在制(zhi)作原型所花費的時(shi)間(jian)和驗證原型帶來價值之間(jian)取得平衡。