2014-12-10 藍(lán)藍(lán)設(shè)計(jì)的小編
藍(lán)藍(lán)設(shè)計(jì)( ssll180.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供有效的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
來源:http://yidianzixun.com/home?page=article&id=076vfghA&up=1
如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點(diǎn)這里
就要同2014年說再見了,是時候回顧一下這一年里的偉大設(shè)計(jì)了!著名的設(shè)計(jì)博客Designmodo評選出了年度最佳的20個優(yōu)秀網(wǎng)站,這些優(yōu)秀的網(wǎng)頁不僅設(shè)計(jì)精心,而且緊跟時下流行的設(shè)計(jì)趨勢。
網(wǎng)頁設(shè)計(jì)師們總會熱衷于追隨的設(shè)計(jì)趨勢,所以你能在這些優(yōu)秀的網(wǎng)頁中看到這些趨勢——扁平化設(shè)計(jì)、極簡風(fēng)、視差滾動、視屏背景,等等。這些設(shè)計(jì)優(yōu)秀的網(wǎng)站的另一個共同的特性,就是對移動端的良好支持——響應(yīng)式設(shè)計(jì)。真正優(yōu)秀的網(wǎng)站,總會支持盡可能多的設(shè)備。
那么接下來我們就一起來看看2014年最佳的20個優(yōu)秀網(wǎng)站,了解一下為什么它們會吸引如此之多的關(guān)注。這20個網(wǎng)站都已經(jīng)被Awwwards所收錄其中,值得你每天瀏覽獲取靈感。
The Capitol
這個網(wǎng)站完全是基于近年比較火爆的《饑餓游戲》系列來制作的,網(wǎng)站風(fēng)格冷峻,與網(wǎng)站殘酷的調(diào)性非常一致。網(wǎng)站整體設(shè)計(jì)并不復(fù)雜,配色簡單,但是風(fēng)格簡單而大膽,并且使用了視差滾動的設(shè)計(jì)。網(wǎng)站使用大量的信息、視頻和其他內(nèi)容讓用戶與之互動,讓他們仿佛置身于電影當(dāng)中。
Grovemade
這 可能是今年最潮的網(wǎng)站之一,不僅內(nèi)容精心制作,而且結(jié)合了諸多流行的設(shè)計(jì)趨勢。網(wǎng)站使用了大量的大圖為背景,視覺上非常賞心悅目。網(wǎng)站使用白色的文字和幽 靈按鈕,在深色背景下看起來相得益彰。主屏之外的部分,設(shè)計(jì)師使用了精致的圖片和文字,與白色的背景形成令人愉悅的對比。
Sokruta
Sokruta使用醒目的大圖背景配合簡單直觀的導(dǎo)航,而拼圖式滑塊的運(yùn)用讓整個網(wǎng)站都充滿了個性。這些個性化的設(shè)計(jì)都是在視覺上吸引人的招數(shù),并且確實(shí)有效。除此之外,還有許多額外的效果,比如懸停在按鈕上的時候會出現(xiàn)動效,令人樂此不疲。
Huge Inc.
這個網(wǎng)站設(shè)計(jì)的簡約,也設(shè)計(jì)的恰到好處。不論是品牌設(shè)計(jì)還是空間和版式設(shè)計(jì),Huge公司的網(wǎng)站都做的非常不錯。網(wǎng)站借助視差滾動完美地創(chuàng)造出“頁面”的感覺,不同的頁面呈現(xiàn)不同的元素,整飭而清晰。
I Remember
網(wǎng)站是為一個項(xiàng)目而建立,旨在提高人們對于阿爾茨海默氏癥的了解,網(wǎng)站視覺設(shè)計(jì)非常獨(dú)特,用戶可以同這個網(wǎng)站進(jìn)行許多有趣的交互。網(wǎng)站深沉的色調(diào)正象征這種令人失去記憶的病癥給患者的壓力,其中的微光則象征著“希望的微光”。
今年可能相對少見一點(diǎn)的設(shè)計(jì)趨勢,就是通過網(wǎng)站來向你講述故事。這種展現(xiàn)方式是創(chuàng)建品牌故事的好方法。這種類型的網(wǎng)站里,圖片和排版的組合通常非常有趣,并且具有獨(dú)特的設(shè)計(jì)風(fēng)格。
在 這里,極簡設(shè)計(jì)從未如此美麗。Quay餐廳的網(wǎng)站使用漂亮的大圖背景吸引用戶,全屏式的幻燈片式展示堪稱完美,加載迅速,并且切換的節(jié)奏都控制得非常好, 網(wǎng)站導(dǎo)航欄被挪到屏幕底部,這使得網(wǎng)站的瀏覽體驗(yàn)更好。隨著頁面滾動,導(dǎo)航欄會自然得移動到頁面頂部。網(wǎng)站設(shè)計(jì)層次清晰,也保持著一定的復(fù)雜度。
Sorte En Mer
使用視屏背景是2014年最重要的設(shè)計(jì)趨勢之一,而 Sorte En Mer 則是其中的佼佼者。打開網(wǎng)站的時候你仿佛打開一部電影,并且你可以通過鼠標(biāo)來操控背景視頻的播放。網(wǎng)站的效果頗為驚艷,并且很少有同類網(wǎng)站能做到這個層次。
A Spacecraft for All
這個網(wǎng)站可以帶你了解ISEE-3航天器。你可以通過網(wǎng)站查看ISEE-3的當(dāng)前的實(shí)時圖像,查看它經(jīng)過的地方和執(zhí)行過的任務(wù)。網(wǎng)站擁有簡約而現(xiàn)代的外觀設(shè)計(jì),并且鼓勵用戶與網(wǎng)站進(jìn)行互動。
Super Looper
這是個有趣的游戲,你可以在此創(chuàng)建音樂并且可視化地展現(xiàn)出來,整個使用體驗(yàn)令人上癮。鮮艷的色彩與黑色的背景令網(wǎng)站在視覺上更富有魅力。
這也是一個充滿動畫和視頻的網(wǎng)站,Jam3 擁有一個簡約的首頁,網(wǎng)站其他的元素都可點(diǎn)擊并且具有經(jīng)驗(yàn)的視覺效果。
A Journey Through Middle-Earth
這是一個令人印象深刻的網(wǎng)站,一方面是因?yàn)榫W(wǎng)站是以近2年特別火爆的電影《霍比特人》為主題,另一方面是因?yàn)榫W(wǎng)站借助大量的靜態(tài)圖片和動態(tài)圖像來創(chuàng)建出游戲般的交互體驗(yàn)。
MashVP
這個網(wǎng)站設(shè)計(jì)得極為簡約,但是一點(diǎn)都不簡單。當(dāng)你滾動頁面的時候,圖片之間的切換效果頗為有趣,當(dāng)你點(diǎn)擊頂端的按鈕導(dǎo)航的時候,能讓你看到更多有趣的展示。
Over the Hills
這個網(wǎng)站擁有如此之多的功能,以至于你可以整天整天地鉆研,從動效設(shè)計(jì)到視頻背景,從優(yōu)質(zhì)的音樂體驗(yàn)到復(fù)古的視覺體驗(yàn),這個網(wǎng)站會讓你欲罷不能。
Twofold
雖然這個站點(diǎn)使用極簡風(fēng),但是網(wǎng)站并不簡單。首頁使用了金色的色調(diào)和閃爍的光芒,滾動的時候漂亮的動效設(shè)計(jì)賦予網(wǎng)頁以自然的一面。其實(shí)這樣的網(wǎng)站最好,看似簡單,但是當(dāng)你與之互動的時候卻能給你帶來驚喜。
這個網(wǎng)站深得扁平化設(shè)計(jì)理念的精髓,幾乎上升到一個全新的境界。漂亮的圖片被置于簡約的排版中,引人入勝。令網(wǎng)站真正與眾不同的是它的配色,強(qiáng)烈的對比令網(wǎng)站的色彩不再“扁平”,這種錯落令人著迷。
Valerie Martinez Agency
乍一看這個網(wǎng)站感覺非常簡單,但是簡單之下隱藏著寶藏。標(biāo)題中的幽靈按鈕會帶你去前進(jìn),每一個點(diǎn)擊都能帶來各種動效。加載界面上的開場動畫同樣令人印象深刻,如果你仔細(xì)看的話。
Volkswagen
網(wǎng)站仿佛被設(shè)計(jì)成為一部電影預(yù)告片,除了帥氣的頁面之外,用戶還可以與網(wǎng)站宣傳的運(yùn)動型轎車進(jìn)行交互。真正讓這個網(wǎng)站令人過目不忘的,還是源自于網(wǎng)站所使用的背景紋理和驚艷的圖片。設(shè)計(jì)團(tuán)隊(duì)還使用了簡單的字體確保網(wǎng)站可讀性,還令整個站點(diǎn)的設(shè)計(jì)更加統(tǒng)一。
Your Local Studio
極簡風(fēng)、簡約的照片以及用戶相關(guān)的視覺元素混合在一起構(gòu)成了網(wǎng)站獨(dú)特的韻味。
Ba Ba Dum
網(wǎng)站游戲化依然是非常靠譜的手段,這個網(wǎng)站就是明證。游戲能帶來樂趣,同時也能為用戶傳遞一些知識。網(wǎng)站使用了色彩明艷的插畫教你來自各種語言的單詞。
掃一掃,案例分享帶回家(藍(lán)藍(lán)設(shè)計(jì)微信公眾平臺)
藍(lán)藍(lán)設(shè)計(jì)的小編 http://ssll180.com