摹客
產(chǎn)品
下載
當我們在瀏覽Facebook、知乎、Twitter等網(wǎng)站時，大家一定發(fā)現(xiàn)了這些網(wǎng)站的共同點，就是在頁面元素的設(shè)計上都以藍色調(diào)為主。為什么在網(wǎng)頁設(shè)計中，藍色會這么受歡迎呢？
心理學(xué)研究證明，藍色通?？梢越o人帶來大氣、愜意、平和的感覺，能夠傳遞強烈的信任感。不僅如此，藍色深沉的色調(diào)也可以讓人更快進入平靜、專注的狀態(tài)，在長時間瀏覽網(wǎng)頁時也不會產(chǎn)生強烈的視覺刺激。因此許多設(shè)計師在進行網(wǎng)頁設(shè)計時，都十分青睞藍色調(diào)。
今天摹客團隊為大家?guī)硪唤M以藍色為主色調(diào)的創(chuàng)意網(wǎng)頁設(shè)計，希望可以帶給大家不一樣的創(chuàng)作靈感。
Whale Synth是一個專為音樂人打造的非常有趣的網(wǎng)站，可以將不同種類鯨魚的聲音進行合成，變成音樂。網(wǎng)站背景由其中深淺不一的藍色組成，顏色深淺代表了不同的音高，隨著鼠標的移動，網(wǎng)站會變成層層疊疊的波浪，各種各樣的鯨魚音也會隨之產(chǎn)生，讓人仿佛徜徉在海洋中，享受著被鯨魚包圍的幸福感。
作為哈利波特的官方網(wǎng)站，WizardingWorld可以帶領(lǐng)每一個哈利波特愛好者進入神奇的魔法世界。在這里你可以創(chuàng)建個人檔案，進行分帽院測試。深藍色星空背景為網(wǎng)站增加了幾分神秘色彩，也能讓用戶產(chǎn)生更強烈的代入感。
日本NPO就業(yè)支援事業(yè)所網(wǎng)站，在設(shè)計上采用了較高飽和度和明度的藍色進行了搭配，借助卡通風(fēng)格的插畫設(shè)計和手寫風(fēng)格字體，配合適量的動態(tài)效果，使整個網(wǎng)站設(shè)計在契合主題的前提下，顯得生動有趣，別具一格。
韓國MICT網(wǎng)站整體風(fēng)格偏冷，充滿冷靜、理智的情感色彩，符合醫(yī)療機構(gòu)網(wǎng)站的定位。同時，為了中和網(wǎng)站色調(diào)，在輪播圖片的選取時，加入了暖色系的圖片，整體搭配和諧，降低了設(shè)計上的距離感。
Ondaparts是一家專門生產(chǎn)管道連接組件的日本公司。其網(wǎng)站設(shè)計風(fēng)格干凈清爽，除了充滿藍色元素的導(dǎo)航、功能按鈕等部分，在選擇背景輪播圖時，也以藍色調(diào)圖片為主。同時網(wǎng)站設(shè)計了大面積的留白空間，提升整個頁面的呼吸感，降低訪客視覺壓力。
Wonder是著名編劇帕拉西奧處女作《Wonder》的官方網(wǎng)站，該書自出版以來，就長期占據(jù)《紐約時報》的暢銷書榜單。書中講述了一個頭戴太空頭盔的男孩戰(zhàn)勝自己，融入社會的溫暖故事。在Wonder 的官方網(wǎng)站中，也采用了溫暖的手繪小插畫形式，將書中的故事通過簡單的線條呈現(xiàn)在天藍色的背景布中，極具趣味性。
Fontstore是一家風(fēng)格獨特的字體設(shè)計公司，旗下包含多種可付費使用的獨家字體。該公司官方網(wǎng)站在設(shè)計上也別出心裁，通過用藍白線條在黑色背景上逐漸繪制出主題圖案，來呈現(xiàn)歡迎頁、字體瀏覽、價格信息、安裝方式、訂閱五個部分。整體設(shè)計獨具一格，趣味性十足，很容易給人留下深刻的印象。
Peekabeat是一款有趣的音樂播放軟件，用戶只需拍照，該軟件就能根據(jù)用戶的臉自動推薦播放列表。Peekabeat的官網(wǎng)延續(xù)了APP的趣味性，背景色彩還會隨機在藍色到紫色之間發(fā)生漸變，極具魅力。背景人物隨著色彩的變化，也表現(xiàn)出了不同的情緒，突出了軟件可以“根據(jù)心情推薦歌曲”的特色。整體設(shè)計很好地凸顯出了Peekabeat的與眾不同。
Radio Canada是加拿大廣播電臺的官方網(wǎng)站，該網(wǎng)站采用了抽象主義設(shè)計風(fēng)格，通過棱角分明的圖案和豐富的色彩碰撞，創(chuàng)造出強烈的視覺沖擊感。同時網(wǎng)站采用了視差滾動的交互效果，增加了其互動性，也讓加拿大廣播電臺的形象變得豐富了起來。
Spectral是由Production Type設(shè)計的參數(shù)化Google字體，在該字體官網(wǎng)，可以實現(xiàn)在線快速生成新風(fēng)格字體，提高了字體設(shè)計的創(chuàng)造力。該網(wǎng)站風(fēng)格簡潔，藍色背景布上，使用白色線條將主要工作區(qū)進行了劃分，讓用戶對各功能區(qū)可以一目了然，為用戶提供了很不錯的字體在線設(shè)計體驗。
Womanhood是一個互動式紀錄片的官方網(wǎng)站，網(wǎng)站導(dǎo)航以萬花筒的方式呈現(xiàn)。選擇一個字母后，點擊對應(yīng)單詞即可進入相關(guān)紀錄片的頁面。網(wǎng)站的交互方式簡單，但通過巧妙的色彩搭配和風(fēng)格突出的導(dǎo)航呈現(xiàn)方式，整體互動感極強。
這是捷克Fotonaut攝影工作室的官方網(wǎng)站。網(wǎng)站背景使用了紫藍色，在頁面的重要元素設(shè)計上，使用了大量紅色，配色顯得非常大膽，創(chuàng)意十足，與攝影工作室現(xiàn)代時尚的風(fēng)格相符合。
作為近兩年極具話題性和爭議性的品牌，Luckin Coffee（瑞幸咖啡）可謂是賺足了眼球。在官方網(wǎng)站的設(shè)計上，毫無意外地選擇了藍色作為其主色調(diào)，在輪播背景圖的正中心，固定展示Luckin Coffee的Logo。網(wǎng)站整體畫風(fēng)一致，強化了小藍杯的形象，使品牌推廣更加深入人心。
Mozaik是一家位于雅典的綜合性的數(shù)字營銷機構(gòu)，其官方網(wǎng)站每個頁面均采用了藍色作為背景色，無論是背景視頻還是背景圖片，均進行了色彩處理。單個頁面的關(guān)鍵信息使用白色字體呈現(xiàn)在頁面正中，主次分明，重點突出。
這是立陶宛攝影師、作家Benediktas的個人網(wǎng)站。網(wǎng)站設(shè)計非常簡單，通過簡單的線條將信息呈現(xiàn)在深色背景中，干練的設(shè)計很好地表達出了Benediktas的處事風(fēng)格。UI動效是該網(wǎng)站的一大特色。
該網(wǎng)站采用了扁平的設(shè)計風(fēng)格，去除了冗余、厚重和繁雜的裝飾效果，突出了網(wǎng)站的重點信息。為了符合網(wǎng)站的主題，設(shè)計師從頁面動態(tài)元素和字體的排版上進行了創(chuàng)新，讓整個UI界面變得靈活跳脫，充滿創(chuàng)意。相信對于許多設(shè)計師來說，這個網(wǎng)站無論是內(nèi)容還是設(shè)計風(fēng)格，都能帶來豐富的創(chuàng)作靈感。
Bay Street Biergarten是查爾斯頓的第一座當代啤酒花園，致力于為啤酒愛好者提供市場上最好的精釀產(chǎn)品。其官方網(wǎng)站為用戶提供預(yù)約、通訊、活動促銷信息發(fā)布等服務(wù)。網(wǎng)站整體色調(diào)為深藍色，導(dǎo)航和背景圖選擇使用燙金色，搭配雙線條圖標的使用，在突出了網(wǎng)站重要信息的同時，也讓網(wǎng)站看起來更有質(zhì)感和格調(diào)。
Molamil是一間為客戶提供品牌打造、網(wǎng)站搭建、APP設(shè)計、廣告設(shè)計等服務(wù)的工作室。網(wǎng)站背景采用2.5d的等距元素排列，表達出了團隊多元化的服務(wù)理念。嚴謹整齊的背景元素，搭配淺藍色的色調(diào)，讓整個網(wǎng)頁看起來清新簡潔。
這是創(chuàng)意團隊Supremo推出的字母排版術(shù)語網(wǎng)站，深藍色背景上陳列了“Terminology”一詞，通過對該單詞字母的各部分進行單獨剖析講解，讓瀏覽者可以對字母排版的術(shù)語進行生動地理解。
Animal是一支有趣的藝術(shù)家團隊，涉及領(lǐng)域包含平面海報設(shè)計、游戲研發(fā)、視頻制作、動畫設(shè)計、網(wǎng)站設(shè)計、品牌設(shè)計等方面。其團隊的官方網(wǎng)站風(fēng)格與日常創(chuàng)作風(fēng)格相似，壓抑的深藍色背景上陳列著造型怪異的動物與粗獷的文字，配色大膽有趣，充滿狂野的創(chuàng)造力和想象力。
以上就是本期摹客團隊為大家分享的內(nèi)容。在摹客官網(wǎng)， 也有許多設(shè)計精美的原型模板可以直接下載使用。除了藍色系網(wǎng)頁設(shè)計，我們還會分享更多各具特色的網(wǎng)頁設(shè)計風(fēng)格，為各位小伙伴帶來更多的創(chuàng)意和靈感。敬請期待吧~
摹客協(xié)作
摹客RP
摹客DT
摹客超級版