作為網(wǎng)頁(yè)設(shè)計(jì)師，你的作品就是你專業(yè)水平的最好體現(xiàn)方式。所以，無(wú)論是參加面試還是個(gè)人作品展示，你的網(wǎng)頁(yè)模型是否能讓人眼前一亮，是否能在交互設(shè)計(jì)或視覺(jué)設(shè)計(jì)方面突出任何一點(diǎn)的優(yōu)勢(shì)，是你取得面試機(jī)會(huì)和贏得客戶的關(guān)鍵。
在網(wǎng)頁(yè)設(shè)計(jì)的初始階段，原型/線框/模型設(shè)計(jì)必然是一個(gè)關(guān)鍵步驟。如何通過(guò)網(wǎng)頁(yè)模型呈現(xiàn)設(shè)計(jì)思路，如何設(shè)計(jì)出優(yōu)秀的網(wǎng)頁(yè)模型，如何取得設(shè)計(jì)靈感？
這里，Mockplus為大家整理了一些設(shè)計(jì)精細(xì)并且優(yōu)質(zhì)的免費(fèi)網(wǎng)站設(shè)計(jì)模型，或許可以為你下一次的網(wǎng)頁(yè)模型設(shè)計(jì)提供一些思路。
在參考階段，免費(fèi)的網(wǎng)頁(yè)模型往往是初學(xué)者的首選。毫不猶豫，我們?yōu)榇蠹曳钌弦慌赓M(fèi)的網(wǎng)頁(yè)模型案例，拿走不謝！
參考點(diǎn)：登陸界面設(shè)計(jì)
下載地址：http://doc.mockplus.cn/wp-content/uploads/2018/04/Amcharts.zip
該網(wǎng)站模型的原型是Amcharts公司開(kāi)發(fā)的JavaScript Charts，是兼容性好的JavaScript、HTML5 圖表開(kāi)發(fā)工具，能滿足大部分的開(kāi)發(fā)需求。
此模板中有Products，Download，Support，Buy，Demos等 5 個(gè)頁(yè)面，網(wǎng)站設(shè)計(jì)采用了懸浮導(dǎo)航欄和footer的效果，可用于訂單購(gòu)買(mǎi)，登陸，圖標(biāo)展示等網(wǎng)頁(yè)界面設(shè)計(jì)參考。
參考點(diǎn)：多資源多鏈接頁(yè)面布局
下載地址：http://doc.mockplus.cn/wp-content/uploads/2018/04/Dribbble.zip
Dribbble是一個(gè)面向創(chuàng)作家、藝術(shù)工作者、設(shè)計(jì)師等創(chuàng)意類(lèi)作品的人群的社區(qū)網(wǎng)站。作為設(shè)計(jì)平臺(tái)類(lèi)的佼佼者，此網(wǎng)頁(yè)設(shè)計(jì)模板很好的展示了如何處理多資源多鏈接，圖文結(jié)合，圖文鏈接的網(wǎng)頁(yè)排版模式，是一個(gè)非常值得學(xué)習(xí)和參考的優(yōu)秀模板�？梢詤⒖嫉捻�(yè)面有：主頁(yè)、設(shè)計(jì)師頁(yè)面、找工作頁(yè)面等。
參考點(diǎn)：信息排版布局
下載地址：http://doc.mockplus.cn/wp-content/uploads/2018/04/BBC.zip
BBC是英國(guó)最大的新聞廣播機(jī)構(gòu)，屬于新聞?lì)惖木W(wǎng)站，所以網(wǎng)站沒(méi)有過(guò)多花哨的內(nèi)容，網(wǎng)站布局以信息排版為主�？梢詤⒖嫉捻�(yè)面有：主頁(yè)、新聞頁(yè)面、天氣頁(yè)面、視頻頁(yè)面等。
參考點(diǎn)：電子商務(wù)信息布局
下載地址：http://doc.mockplus.cn/wp-content/uploads/2016/12/Shopify.zip
作為一個(gè)典型的在線電子商務(wù)平臺(tái)，Shopify不僅僅只是提供專業(yè)的電子商務(wù)網(wǎng)站建設(shè)服務(wù)，同時(shí)也開(kāi)展基于社交網(wǎng)絡(luò)的電子商務(wù)，即賣(mài)家通過(guò)Shopify在Facebook、Pinterest、Twitter等幾個(gè)主流社交網(wǎng)絡(luò)平臺(tái)上就可以開(kāi)店。
此網(wǎng)頁(yè)模型主要展示了登錄頁(yè)面、主頁(yè)、銷(xiāo)售方法頁(yè)面、價(jià)格頁(yè)面、博客頁(yè)面等。是制作電子商務(wù)類(lèi)網(wǎng)站必看的模板之一。
QQ客服