網(wǎng)站設(shè)計(jì)前需要制作網(wǎng)站原型圖嗎？那么什么是網(wǎng)站原型圖呢？可以理解為是網(wǎng)站界面的草圖或者框架結(jié)構(gòu)，按照原型圖制作的粗糙程度劃分為高保真原型圖和低保真原型圖，有些高保真原型圖看上去跟真的網(wǎng)頁(yè)一樣，還有各種動(dòng)畫(huà)效果，非常棒。但方維網(wǎng)絡(luò)認(rèn)為，原型圖還是沒(méi)必要做的太精細(xì)，不然就失去了原型圖的意義，因?yàn)榫W(wǎng)站原型圖的最大作用就是試錯(cuò)成本低，通過(guò)低成本的試錯(cuò)功能增加網(wǎng)站真實(shí)設(shè)計(jì)圖的通過(guò)率，那么回歸主題，網(wǎng)站設(shè)計(jì)前需要制作網(wǎng)站原型圖嗎？原型圖如下所示。



根據(jù)筆者了解，網(wǎng)站原型圖最適合的場(chǎng)景就是網(wǎng)站內(nèi)容欄目繁多或者網(wǎng)站邏輯復(fù)雜，需要原型圖為設(shè)計(jì)師理清思路，所以，如果是簡(jiǎn)單的企業(yè)網(wǎng)站，欄目基本就是首頁(yè)、關(guān)于我們、產(chǎn)品展示、新聞中心、人才招聘、聯(lián)系我們。這種就沒(méi)必要花費(fèi)時(shí)間去做原型圖了。對(duì)于門(mén)戶(hù)網(wǎng)站、欄目比較多的集團(tuán)網(wǎng)站、交換類(lèi)型網(wǎng)站、個(gè)性化定制網(wǎng)站，這種欄目結(jié)構(gòu)比較特別，如果沒(méi)有原型圖，設(shè)計(jì)師不知道怎么規(guī)劃內(nèi)容。所以簡(jiǎn)單常規(guī)的網(wǎng)站設(shè)計(jì)可以不用制作原型圖，而稍微復(fù)雜特殊的網(wǎng)站需要制作原型圖。

對(duì)于復(fù)雜網(wǎng)站，網(wǎng)站原型圖的作用還是非常明顯的。首先，通過(guò)原型圖的策劃和制作基本就把整個(gè)網(wǎng)站的邏輯都理清理順了，讓客戶(hù)更加清晰網(wǎng)站制作完成的情景，明確網(wǎng)站的作用功能；其次，再原型圖的制作過(guò)程中，通過(guò)反復(fù)修改和客戶(hù)溝通修改意見(jiàn)，充分利用原型圖低成本試錯(cuò)功能，大大減少網(wǎng)站設(shè)計(jì)階段的修改次數(shù)和工作量，雖然制作原型圖花費(fèi)了時(shí)間，但可以通過(guò)后期節(jié)省的工作時(shí)間補(bǔ)回來(lái)，從整體上還是加快了項(xiàng)目進(jìn)度；最后，網(wǎng)站原型圖可以方便演示，適合演示給投資人或者內(nèi)部演示，非常方便。

目前設(shè)計(jì)網(wǎng)站原型圖的工具有很多，如最年久的Axure RP，目前流行的墨刀、Mockplus。Axure RP是最多人推薦使用的，基本免費(fèi)，而墨刀是采用初級(jí)免費(fèi)高級(jí)收費(fèi)的平臺(tái)方案。如果不從收不收費(fèi)來(lái)看，還是墨刀做的比較好，可以直接上傳到服務(wù)器供客戶(hù)瀏覽，適合PC網(wǎng)站、手機(jī)網(wǎng)站、APP設(shè)計(jì)，而且還內(nèi)置了很多組件、模板等。

網(wǎng)站原型圖一般由誰(shuí)來(lái)做，正常是產(chǎn)品經(jīng)理或者網(wǎng)站策劃師，如果是小網(wǎng)站，可能就直接由設(shè)計(jì)師制作了。那么如何快速做好網(wǎng)站原型圖呢?可不能小覷這方面的工作，正常我會(huì)先大致把網(wǎng)站的整體架構(gòu)和思路理清楚，如果比較復(fù)雜，還會(huì)先用筆畫(huà)一些草圖，然后才開(kāi)始再原型圖工具上工作，開(kāi)始的時(shí)候先把頁(yè)面都建好，然后做一下公用的模板，才開(kāi)始具體頁(yè)面的制作，遵循由主到次的順序，最后再整體修改。