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

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

1、低保真原型

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

（1）草圖：草圖是最(zui)初的(de)想法(fa)或(huo)假設，基于(yu)業務流(liu)程的(de)梳理，結合信息(xi)架構，將核(he)心的(de)用戶操作界(jie)面繪制(zhi)出來(lai)，可以是白(bai)板草圖，紙(zhi)質草圖等。通過繪制(zhi)大量不同的(de)版本來(lai)考慮解決界(jie)面交互的(de)不同方法(fa)。

（2）線(xian)(xian)框圖(tu)：信息架(jia)構和草圖(tu)可(ke)以快速(su)演變成(cheng)線(xian)(xian)框圖(tu)。線(xian)(xian)框圖(tu)是(shi)(shi)靜態的(de)頁面(mian)布局，讓我們(men)思考如(ru)何在屏幕(mu)上放置(zhi)不同元素，更好的(de)將信息架(jia)構可(ke)視(shi)化(hua)。低保真的(de)線(xian)(xian)框圖(tu)沒有(you)視(shi)覺設計，交互方面(mian)有(you)也只是(shi)(shi)簡單的(de)跳轉事件，大多(duo)數都使用灰色色階和占位符來指示內容。

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

2、中保真原型

中保真原(yuan)型在某(mou)些(xie)方面看起(qi)來(lai)像最(zui)終產品，它(ta)在成本和(he)價值之間取(qu)得(de)平衡(heng)，將視覺(jue)、交(jiao)互(hu)和(he)展示媒(mei)介結合在一起(qi)。包括可點擊的(de)原(yuan)型、編碼原(yuan)型等，用戶基于中保真原(yuan)型能夠完成一個(ge)任(ren)務的(de)閉環，也就(jiu)是通過與原(yuan)型界面的(de)交(jiao)互(hu)完成工作任(ren)務。

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

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

3、高保真原型

高(gao)保(bao)真(zhen)原(yuan)型經(jing)過(guo)視覺設(she)計，這些原(yuan)型具有真(zhen)實界面的高(gao)度一(yi)致，數(shu)據(ju)的高(gao)度仿(fang)真(zhen)，交互和(he)動(dong)畫也具備，用(yong)戶能夠與之進行交互。雖然看起來(lai)像真(zhen)的一(yi)樣(yang)，但(dan)它(ta)仍然是(shi)一(yi)個原(yuan)型。

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

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

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

2、功能(neng)(neng)廣度(du)：指原(yuan)型中涵(han)蓋了多少大的功能(neng)(neng)點(dian)。

3、功能(neng)深度(du)：表(biao)明原型各個功能(neng)的(de)詳細程度(du)如何(he)。

4、交互性：表示應(ying)用(yong)程序或產品的交互部(bu)分如何顯(xian)示給用(yong)戶。

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

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

原型設計工具設計的原(yuan)型(xing)(xing)類型(xing)(xing)可(ke)分為三(san)類，選擇(ze)時并(bing)不(bu)一定保真度(du)越高越好，如果(guo)原(yuan)型(xing)(xing)保真度(du)過高，用戶就會以為設計已經完(wan)成，過分關注細(xi)節(jie)，而(er)忽(hu)略(lve)整體方案；但原(yuan)型(xing)(xing)保真度(du)太低(di)也不(bu)行，用戶可(ke)能會迷失方向(xiang)，不(bu)理解(jie)原(yuan)型(xing)(xing)的目的是什么。

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