作為網頁設計師,你的作品就是你專業水平的最好體現方式。所以,無論是參加面試還是個人作品展示,你的網頁模型是否能讓人眼前一亮,是否能在交互設計或視覺設計方面突出任何一點的優勢,是你取得面試機會和贏得客戶的關鍵。
在網頁設計的初始階段,原型/線框/模型設計必然是一個關鍵步驟。如何通過網頁模型呈現設計思路,如何設計出優秀的網頁模型,如何取得設計靈感?
這里,Mockplus為大家整理了一些設計精細并且優質的免費網站設計模型,或許可以為你下一次的網頁模型設計提供一些思路。
在參考階段,免費的網頁模型往往是初學者的首選。毫不猶豫,我們為大家奉上一批免費的網頁模型案例,拿走不謝!
參考點:登陸界面設計
下載地址:http://doc.mockplus.cn/wp-content/uploads/2018/04/Amcharts.zip
該網站模型的原型是Amcharts公司開發的JavaScript Charts,是兼容性好的JavaScript、HTML5 圖表開發工具,能滿足大部分的開發需求。
此模板中有Products,Download,Support,Buy,Demos等 5 個頁面,網站設計采用了懸浮導航欄和footer的效果,可用于訂單購買,登陸,圖標展示等網頁界面設計參考。
參考點:多資源多鏈接頁面布局
下載地址:http://doc.mockplus.cn/wp-content/uploads/2018/04/Dribbble.zip
Dribbble是一個面向創作家、藝術工作者、設計師等創意類作品的人群的社區網站。作為設計平臺類的佼佼者,此網頁設計模板很好的展示了如何處理多資源多鏈接,圖文結合,圖文鏈接的網頁排版模式,是一個非常值得學習和參考的優秀模板?梢詤⒖嫉捻撁嬗校褐黜、設計師頁面、找工作頁面等。
參考點:信息排版布局
下載地址:http://doc.mockplus.cn/wp-content/uploads/2018/04/BBC.zip
BBC是英國最大的新聞廣播機構,屬于新聞類的網站,所以網站沒有過多花哨的內容,網站布局以信息排版為主?梢詤⒖嫉捻撁嬗校褐黜摗⑿侣勴撁妗⑻鞖忭撁妗⒁曨l頁面等。
參考點:電子商務信息布局
下載地址:http://doc.mockplus.cn/wp-content/uploads/2016/12/Shopify.zip
作為一個典型的在線電子商務平臺,Shopify不僅僅只是提供專業的電子商務網站建設服務,同時也開展基于社交網絡的電子商務,即賣家通過Shopify在Facebook、Pinterest、Twitter等幾個主流社交網絡平臺上就可以開店。
此網頁模型主要展示了登錄頁面、主頁、銷售方法頁面、價格頁面、博客頁面等。是制作電子商務類網站必看的模板之一。