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

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

1、低保真原型

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

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

（2）線(xian)框圖：信(xin)息架構和(he)草(cao)圖可以快速演變(bian)成線(xian)框圖。線(xian)框圖是(shi)靜態(tai)的頁面布局，讓我們思考如何在屏幕上放置不同元素，更好的將信(xin)息架構可視化。低保真(zhen)的線(xian)框圖沒有視覺設計(ji)，交互方面有也只是(shi)簡單的跳(tiao)轉(zhuan)事(shi)件，大(da)多數(shu)都(dou)使用(yong)灰色色階和(he)占位符(fu)來指(zhi)示(shi)內(nei)容。

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

2、中保真原型

中(zhong)保(bao)真原(yuan)型在某(mou)些方(fang)面看起來(lai)像最終產(chan)品(pin)，它在成(cheng)(cheng)本和價值之間取得平衡，將視(shi)覺、交(jiao)互和展示媒介結合在一(yi)起。包括可(ke)點擊的(de)(de)原(yuan)型、編碼原(yuan)型等(deng)，用戶基(ji)于中(zhong)保(bao)真原(yuan)型能夠(gou)完(wan)成(cheng)(cheng)一(yi)個(ge)任(ren)務的(de)(de)閉環，也就是通過與原(yuan)型界面的(de)(de)交(jiao)互完(wan)成(cheng)(cheng)工作任(ren)務。

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

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

3、高保真原型

高保真原型經過(guo)視覺(jue)設(she)計，這些原型具有真實界面(mian)的(de)高度一(yi)致，數(shu)據的(de)高度仿(fang)真，交互和動畫也(ye)具備，用戶能夠(gou)與之進行交互。雖(sui)然(ran)看起(qi)來像真的(de)一(yi)樣，但它仍然(ran)是一(yi)個原型。

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

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

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

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

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

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

5、數(shu)據模型：包(bao)含用(yong)戶在界(jie)面中(zhong)交互的內容以及(ji)產品前端(duan)和后端(duan)使用(yong)的數(shu)據。

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

原型設計工具設計的(de)原(yuan)型(xing)(xing)類型(xing)(xing)可(ke)分為三(san)類，選(xuan)擇時(shi)并不一定(ding)保真(zhen)度越高越好，如果原(yuan)型(xing)(xing)保真(zhen)度過高，用戶(hu)就會以為設計已經完(wan)成，過分關注細(xi)節，而忽略整體(ti)方案(an)；但(dan)原(yuan)型(xing)(xing)保真(zhen)度太(tai)低也不行(xing)，用戶(hu)可(ke)能(neng)會迷失方向，不理解原(yuan)型(xing)(xing)的(de)目的(de)是什么。

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