设计之家 > 靈感 > 網頁UI > 網頁設計 >

寧靜深沉的藍!藍色係網頁設計欣賞

作者:佚名 來源:設計之家 時間:2020-05-30

當我們在瀏覽Facebook、知乎、Twitter等網站時,大家一定發現了這些網站的共同點,就是在頁面元素的設計上都以藍色調為主。為什麼在網頁設計中,藍色會這麼受歡迎呢?

心理學研究證明,藍色通常可以給人帶來大氣、愜意、平和的感覺,能夠傳遞強烈的信任感。不僅如此,藍色深沉的色調也可以讓人更快進入平靜、專注的狀態,在長時間瀏覽網頁時也不會產生強烈的視覺刺激。因此許多設計師在進行網頁設計時,都十分青睞藍色調。

今天為大家帶來一組以藍色為主色調的創意網頁設計,希望可以帶給大家不一樣的創作靈感。

1.Whale Synth

Whale Synth是一個專為音樂人打造的非常有趣的網站,可以將不同種類鯨魚的聲音進行合成,變成音樂。網站背景由其中深淺不一的藍色組成,顏色深淺代表了不同的音高,隨著鼠標的移動,網站會變成層層疊疊的波浪,各種各樣的鯨魚音也會隨之產生,讓人仿佛徜徉在海洋中,享受著被鯨魚包圍的幸福感。

2.WizardingWorld

作為哈利波特的官方網站,WizardingWorld可以帶領每一個哈利波特愛好者進入神奇的魔法世界。在這裏你可以創建個人檔案,進行分帽院測試。深藍色星空背景為網站增加了幾分神秘色彩,也能讓用戶產生更強烈的代入感。

3.NPO

日本NPO就業支援事業所網站,在設計上采用了較高飽和度和明度的藍色進行了搭配,借助卡通風格的插畫設計和手寫風格字體,配合適量的動態效果,使整個網站設計在契合主題的前提下,顯得生動有趣,別具一格。

4.MICT

韓國MICT網站整體風格偏冷,充滿冷靜、理智的情感色彩,符合醫療機構網站的定位。同時,為了中和網站色調,在輪播圖片的選取時,加入了暖色係的圖片,整體搭配和諧,降低了設計上的距離感。

5.Ondaparts

Ondaparts是一家專門生產管道連接組件的日本公司。其網站設計風格幹淨清爽,除了充滿藍色元素的導航、功能按鈕等部分,在選擇背景輪播圖時,也以藍色調圖片為主。同時網站設計了大面積的留白空間,提升整個頁面的呼吸感,降低訪客視覺壓力。

6.Wonder

Wonder是著名編劇帕拉西奧處女作《Wonder》的官方網站,該書自出版以來,就長期占據《紐約時報》的暢銷書榜單。書中講述了一個頭戴太空頭盔的男孩戰勝自己,融入社會的溫暖故事。在Wonder 的官方網站中,也采用了溫暖的手繪小插畫形式,將書中的故事通過簡單的線條呈現在天藍色的背景布中,極具趣味性。

7.Fontstore

Fontstore是一家風格獨特的字體設計公司,旗下包含多種可付費使用的獨家字體。該公司官方網站在設計上也別出心裁,通過用藍白線條在黑色背景上逐漸繪製出主題圖案,來呈現歡迎頁、字體瀏覽、價格信息、安裝方式、訂閱五個部分。整體設計獨具一格,趣味性十足,很容易給人留下深刻的印象。

8.Peekabeat

Peekabeat是一款有趣的音樂播放軟件,用戶隻需拍照,該軟件就能根據用戶的臉自動推薦播放列表。Peekabeat的官網延續了APP的趣味性,背景色彩還會隨機在藍色到紫色之間發生漸變,極具魅力。背景人物隨著色彩的變化,也表現出了不同的情緒,突出了軟件可以“根據心情推薦歌曲”的特色。整體設計很好地凸顯出了Peekabeat的與眾不同。

9.Radio Canada

Radio Canada是加拿大廣播電台的官方網站,該網站采用了抽象主義設計風格,通過棱角分明的圖案和豐富的色彩碰撞,創造出強烈的視覺衝擊感。同時網站采用了視差滾動的交互效果,增加了其互動性,也讓加拿大廣播電台的形象變得豐富了起來。

10.Spectral

Spectral是由Production Type設計的參數化Google字體,在該字體官網,可以實現在線快速生成新風格字體,提高了字體設計的創造力。該網站風格簡潔,藍色背景布上,使用白色線條將主要工作區進行了劃分,讓用戶對各功能區可以一目了然,為用戶提供了很不錯的字體在線設計體驗。

11.Womanhood

Womanhood是一個互動式紀錄片的官方網站,網站導航以萬花筒的方式呈現。選擇一個字母後,點擊對應單詞即可進入相關紀錄片的頁面。網站的交互方式簡單,但通過巧妙的色彩搭配和風格突出的導航呈現方式,整體互動感極強。

12.Fotonaut

這是捷克Fotonaut攝影工作室的官方網站。網站背景使用了紫藍色,在頁面的重要元素設計上,使用了大量紅色,配色顯得非常大膽,創意十足,與攝影工作室現代時尚的風格相符合。

13.Luckin Coffee

作為近兩年極具話題性和爭議性的品牌,Luckin Coffee(瑞幸咖啡)可謂是賺足了眼球。在官方網站的設計上,毫無意外地選擇了藍色作為其主色調,在輪播背景圖的正中心,固定展示Luckin Coffee的Logo。網站整體畫風一致,強化了小藍杯的形象,使品牌推廣更加深入人心。

14.Mozaik

Mozaik是一家位於雅典的綜合性的數字營銷機構,其官方網站每個頁面均采用了藍色作為背景色,無論是背景視頻還是背景圖片,均進行了色彩處理。單個頁面的關鍵信息使用白色字體呈現在頁面正中,主次分明,重點突出。

15.Benediktas

這是立陶宛攝影師、作家Benediktas的個人網站。網站設計非常簡單,通過簡單的線條將信息呈現在深色背景中,幹練的設計很好地表達出了Benediktas的處事風格。UI動效是該網站的一大特色。

16.Thing Of Wonder

該網站采用了扁平的設計風格,去除了冗餘、厚重和繁雜的裝飾效果,突出了網站的重點信息。為了符合網站的主題,設計師從頁面動態元素和字體的排版上進行了創新,讓整個UI界面變得靈活跳脫,充滿創意。相信對於許多設計師來說,這個網站無論是內容還是設計風格,都能帶來豐富的創作靈感。

17.Bay Street Biergarten

Bay Street Biergarten是查爾斯頓的第一座當代啤酒花園,致力於為啤酒愛好者提供市場上最好的精釀產品。其官方網站為用戶提供預約、通訊、活動促銷信息發布等服務。網站整體色調為深藍色,導航和背景圖選擇使用燙金色,搭配雙線條圖標的使用,在突出了網站重要信息的同時,也讓網站看起來更有質感和格調。

18.Molamil

Molamil是一間為客戶提供品牌打造、網站搭建、APP設計、廣告設計等服務的工作室。網站背景采用2.5d的等距元素排列,表達出了團隊多元化的服務理念。嚴謹整齊的背景元素,搭配淺藍色的色調,讓整個網頁看起來清新簡潔。

19.Type Terms

這是創意團隊Supremo推出的字母排版術語網站,深藍色背景上陳列了“Terminology”一詞,通過對該單詞字母的各部分進行單獨剖析講解,讓瀏覽者可以對字母排版的術語進行生動地理解。

20.Animalmade

Animal是一支有趣的藝術家團隊,涉及領域包含平面海報設計、遊戲研發、視頻製作、動畫設計、網站設計、品牌設計等方面。其團隊的官方網站風格與日常創作風格相似,壓抑的深藍色背景上陳列著造型怪異的動物與粗獷的文字,配色大膽有趣,充滿狂野的創造力和想象力。

相關文章:

推薦設計

最新文章