block-websites-design-5-1

曾有人說過,想要知道一個網頁設計師是否專業,就讓他設計一個黑色系網站。的確,真正漂亮的黑色系網站大多出自真正專業的設計師之手。黑色是經典的色彩,更是神秘的色彩,它蘊含著攻擊性,深藏著邪惡的種子,但他在邪魅中還隱藏著優雅,在沉穩中里還包含權威,它與力量密不可分。黑色中潛藏著善與惡,但是不管它表達著怎樣的情緒,它都是最具有表現力的色彩之一,強烈而鮮明。這也解釋了為什么黑色會廣泛應用于各個領域。那么,黑色系網站到底蘊含著怎樣的能量呢?

今天的文章就是為了探索這個問題,同時也在是戰中告訴你,到底怎樣的黑色系網站設計,才能讓人難忘。

當設計師在UI設計中使用黑色的時候,他們通常想營造優雅的氣質,或者權威的氣息,打造神秘或者力量感十足的效果。

所以,當黑色同銳利多變的排版結合起來,配合科技感十足的抽象動畫,輔以互補的對象,加上對比色和輔助色,頁面就會擁有獨特而鮮明的質感。黑色系的網頁設計往往可以順利隱藏一部分缺陷,并讓一些內容和效果突出展現。這種“沒有光線”的頁面設計會在日常使用的大量白色系為主的網站中脫穎而出。

那么,接下來我們來看案例吧。

Thomas Rhythm

非凡的細節設計和氣息獨特的個人風格從黑色的頁面中自然而然地逸散出來,整個頁面在沉穩的黑色中展現出令人著迷的節奏感,黑色的視覺吸引力在這個案例中得到了清晰的呈現。

Roidna

黑色的背景色是呈現鮮艷色彩的天然載體,它能讓這些元素成為視覺的焦點,抓住用戶全部的吸引力。Roidna 的頁面中許多元素都采用了霓虹綠,它成功地讓每個訪客都不得不盯著它們看。

This Was My Best

This Was My Best 是一個高端的作品展示網站,它展示了每個設計師最優秀的作品。傳統而經典的黑白系配色互相映襯,讓藝術家們的作品更加突出。整個網站的細節設計微妙而漂亮。

YnY

和前面幾個站的設計類似,YnY 的頁面也同樣是兩種基本色設計而成,優雅而精致。值得注意的是,設計師在網頁中加入了許多裝飾用的小橫線,它們很好將不同的元素串聯到了一起,讓不同的元素在視覺上產生了關聯。

Tim Brack

所有無用的信息都被Tim Brack 從首頁上移除了,讓用戶可以直接關注到黑色背景映襯下的設計作品。大量的留白讓黑色的背景也呈現出一種干凈的感覺。

Self-Destructing Book

Self-Destructing Book 是一個非常神奇的項目,它會在第一時間引起你的興趣。黑色的背景營造出充滿科技感的氛圍,配上清爽的小塊內容和有趣的動效,給人探索的欲望。

We Make Awesome

同樣沿襲這黑白強對比的設計,We Make Awesome 的頁面中黑色背景中使用了許多高透明度的文字疊加在黑色的背景中,視覺重心用的是大標題,粗糙銳利的白色筆刷字體加紅色的點綴,醒目又不單調。

Brio

Brio 的首頁被分為三個部分,歡迎訪客的文案區、郵件訂閱框和一組照片,黑色讓整個頁面顯得沉穩而安定。

Eau de Design

點綴在黑色背景和白色文字中的金色橫線點亮了整個頁面,黑色背景中若隱若現的圖案和漸變的文字讓頁面有了縱深和層次,不再單調。

Video Mapping Loops

深沉的黑色背景讓白色的文字非常顯眼,整個頁面的設計則采用了經典的單頁設計,視頻、圖片、文字、動畫等元素在頁面中大多以視覺中心的形式存在。

FS Millbank

FS Millbank 的頁面設計同樣也是以吸引用戶注意力見長,頁面設計的重心在于呈現新的字體族。黑白極簡風之下,設計師將全新的字體族以不同的尺寸、透明度錯落地呈現出來,打造出優雅而漂亮的布局。同樣的,設計師將箭頭用黃色標識出來,引導用戶點擊繼續查看。

Raphael Malka

Raphael Malka 在頁面的裝飾和配色上總的是更傳統的方式,他對于極簡風有著明顯的傾向。近年流行的幽靈按鈕、漢堡圖標和一些用戶體驗設計,都可以在這個看起來很簡單的網頁中找到。

Music

作為一個音樂網站,霸氣十足的字體效果在黑色的映襯下顯得更加突出,同時也突出了整體的神秘感。

Bind Film

黑色的背景不僅僅是讓網站的內容更突出了,巧妙的布局讓黑色作為留白的功能更加突出,黑色也使得導航欄中的內容顯得更加明顯了,換成白底效果會明顯差很多。

Dream and Reach

半透明的黑色圖層讓底部的圖片和內容能被看到,但是又不會造成干擾,在這種背景上,兩個明顯的動作召喚按鈕給用戶帶來了暢快的體驗。

Mix Event

活潑有趣的圖片疊加上了黑色半透明層作為背景,營造出與音樂相關的氛圍,華麗復雜而復古的黃色徽章在整個頁面中是最顯眼的元素,它與整個網站主題貼合而又足夠有氣場,獨特的色彩也使得它成為了頁面的中心焦點。

Authentic Form and Function

如畫的風景被制作成為黑白照片背景,金色和白色的文字在整個排版設計中起到了關鍵的作用。配合上動畫圖標和獨特的布局,頁面給人的印象非常深刻。

Trif

Trif 擁有一個另類而神秘的首頁,黑色系的頁面中白色的幾何圖案構成的短動畫不停地循環播放,突出的視覺設計讓訪客對這個頁面欲罷不能。

Romeo Fragt Julia

這個以視覺設計為導向的網站并沒有使用多種多樣的UI元素,一切設計都是圍繞著突出圖片內容。

Serapian

對于時尚圈而言,黑色的色調總能帶來神秘、奢華、低調的質感,不論是作為產品色還是襯托色。所以,在設計頁面的時候這位設計師為了突出這個深藍色的皮質手包,采用了黑色的背景,配合金色的紋理增加質感。

【教父級色彩系列】

1.0:
《教父級色彩!一組黑白灰的低調大氣范網站設計》

2.0:
《教父級色彩2.0!一組黑白灰的低調大氣范網站設計》

3.0:
《教父級色彩3.0!一組大氣有范兒的黑白灰色調網站設計》

4.0:
《教父級色彩4.0!一組大氣有范兒的黑白色調網站設計》

原文地址:designmodo
優設譯者:@陳子木

本文由優設網原創翻譯,請尊重版權和譯者成果,轉摘請附上優設鏈接,違者必究。謝謝各位編輯同仁配合。

【優設網 原創文章 投稿郵箱:2650232288@qq.com】

================關于優設網================
“優設網uisdc.com“是國內人氣最高的網頁設計師學習平臺,專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書:史上最全的設計師圖書導航:http://hao.uisdc.com/book/。
設計微博:擁有粉絲量106萬的人氣微博@優秀網頁設計 ,歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航:全球頂尖設計網站推薦,設計師必備導航:http://hao.uisdc.com

點贊
收藏 1

發表評論 快來秀出你的觀點

還可以輸入 800 個字
 
 
載入中....
相關推薦
評論 收藏