亚洲视频在线一区二区三区_色婷婷AV一区二区三区浪潮_亚洲综合无码精品一区二区三区_高清精品一区二区三区一区

淺談UI設計中妙用無窮的深色系背景

作者:
分類: 觀點/經驗
2016-06-20
1625

黑暗系背景,或者說深色的背景,在UI設計中的運用至今都是一個相當有爭議的議題。背景選取對于界面的使用效率而言是至關重要的,合理的背景設計讓界面更易用,相反,一個不恰當的背景則可能毀掉你精心設計的UI。今天我們一起來探討一下深色背景在UI設計中的使用技巧和注意事項。

影響配色方案和背景色選取的因素有很多,深色的背景在網頁和APP UI 界面中運用時,優點和缺點一樣明顯。Tubik Studio 的諸多設計項目的實際經驗證明,深色背景本身的確可以帶來良好的用戶體驗,提供極具吸引力的解決方案。所以,我們探討一下如何在UI設計中最大程度地運用深色系背景。

1-_uANAwbpHgHTxiZx4zRNiw

深色系視覺感知

早在2009年的時候,ProBlogger 就曾做過相應的調研,當問及用戶他們喜歡什么樣的博客背景之時,幾乎有一半的用戶反饋喜歡淺色的背景——這很合理,畢竟博客是以文本內容為主,淺色的背景更符合大家的日常閱讀習慣。不過有意思的地方在于,大概10%的用戶反饋會更喜歡暗色背景,大概三分之一的用戶則認為背景的色彩與網站本身的屬性以及內容相關。同時,這也意味著有相當大一部分用戶需求在設計師設計過程中被忽略掉了。然而,對于非文字驅動類的網站和APP當中,用戶對于深色調背景方面的需求可能還要高。用戶調研在實際的設計項目中的重要性,由此可見一斑。

用戶對于背景顏色的感知規律在Richard H.Hall 和 Patrick Hanna 的科學研究項目中得到了證實。早些時候,不同領域的科學家專門針對網頁的可讀性進行了系統化的實驗和分析,他們得出了這樣的結論:背景和內容兩者之間的對比度和可讀性是成正比的,白色背景下的黑色文字擁有最好的可讀性。這個道理同樣適用于黑底白字,控制好對比度和清晰度,兩位科學家又合理的設計整個實驗。這項研究包含了許多不同色彩組合的有效性測試,對于設計師而言有很重要的參考意義。

0-yBYhT3qOil81uPqQ

可讀性方面

用戶體驗領域最著名的先驅之一 Jacob Nielsen 曾經說過:“文字和背景應當使用高對比度的配色。白底黑字能將可讀性提升到最高,黑底白字在可讀性上的效果幾乎是一樣的。雖然兩種配色方式對比度是相同的,但是后者還是會讓用戶對文字的識別稍慢一些。受限于配色方案,白色的文本內容相比于白底黑字的情況,會顯得更加纖細、模糊,整體的清晰度其實是不如常見的黑字。這種情況在純黑背景和純白字體的搭配下,最為明顯。”

的確,可讀性是影響產品性能的最重要的影響因素,而可讀性又不僅僅只牽涉到文本,所有有意義的文本、標識、符號、數字、圖案都存在可讀性的問題。因此,當設計師準備使用深色背景的時候,應當在不同的設備上測試字體、圖標和圖像在深色背景下的實際效果,用來支撐整個設計。

0-3JcEBtBQRgM-pzMY

正如同Awwwards 網站所提供的最佳黑色細網站設計合集中所展示的,這些優秀的黑色系網站和APP頁面為了在黑色背景上正常顯示內容,都精心挑選了合理的配色方案。這些優秀的案例為我們貢獻出了如下經驗:

·由于深色的背景會“吸收”其他元素的“光芒”,所以元素之內、元素和元素之間要留有足夠的空間,確保識別度;
·較長篇幅的文本具有更好的可讀性,對于用戶更容易消化
·行間距和文本的長度對于可讀性有顯著的影響,尤其是在深色的背景之下,所以篇幅長短、字間距、行間距需要仔細考慮
·深色并不意味著是純粹的黑色,不同深淺的背景和文字的搭配帶來的效果也不盡相同,所以應當懷著開放的心態多加試驗
·色度、漸變和光暈對于可讀性有著顯著的影響
·非襯線字體在深色背景下可讀性更強,襯線字體在深色背景下則會顯得更加優雅。在實際設計過程中應當運用好兩者的特性。

對比度方面

Webdesign.about.com 所給出的這個對比度的表單很好的為我們展現了不同色彩在對比度上的實際效果。這個表格最有意思的地方在于,黑色這一欄證明了黑色幾乎是唯一一個能和其他色彩都構成不錯對比度的色彩。在進行界面設計的時候,盡量仔細測試每種色彩,而黑色的這種特性使得深色背景下的色彩搭配擁有更多的可能性。

0-LNP7A4Ry62aeIzid

同樣的,對比度也是確保可動性的辨識度和清晰的重要因素。

有個早期的調查是針對對比度和清晰度的,調查表明:在黑暗的背景下,盡量不要使用純白,應當將白色淡化為淺灰色,防止極端的對比使白色產生炫光,而消除炫光至少需要5%的灰色來達成效果。有趣的地方在于,這樣的灰色在視覺中依然被識別為白色。此外,將字體加粗也是放置白色被黑色“吃掉”的一種辦法。

另外值得一提的是,深色,尤其是黑色比起其他的色彩來的更加深沉厚重,這也使得它更適宜于展示圖片、插畫、海報等內容。良好的布局和組織結構下,黑色能夠顯著的提升其他視覺元素的表現力,讓內容更具有吸引力。

0-RIXUJr2KNkMLTjy8

情緒感知方面

色彩心理學同樣是需要考慮的因素。背景不僅僅是內容展現的平臺,同時也想訪客傳遞著信息。深色通常會顯得更加優雅,也會展現出神秘感。從色彩心理學上來看,黑色傳遞出高雅、正式、名望、權力的感覺,這也許是為什么許多大品牌會圍繞著黑色來做視覺設計,并且使用黑白來做主要的配色方案。熟知黑色的這一屬性,能夠在UI設計過程中為客戶提供優秀、合理的設計方案,并能夠給出清晰的解釋。

bg121

深色背景的優勢

綜上所述,我們可以總結出深色背景的優勢:

·風格化,優雅
·給人神秘的感覺
·帶來奢華和高端的氛圍
·擁有廣闊而良好的對比度
·更容易創造視覺層次感
·創造視覺深度,讓內容更容易被獲取
·視覺吸引力

1-ESkH7eip6OQbghho5O-KGw

值得思考的問題

uidesign23

另外,深色背景也有費神的一面,如果沒有合理規劃細節的話,用戶容易在布局間迷失。所以,我們還有一些問題是值得思考的:

·用戶研究:針對目標用戶進行實際調查、理論研究和試驗,得出來的數據和信息是創造有效和有吸引力的配色方案的基礎。
·竟品研究:對競爭對手、竟品進行是市場調研,調研結果會影響設計方案,讓產品更容易被理解,創造更加矚目的設計。
·用戶測試:深色系背景在不同的設備、不同分辨率下的可讀性、清晰度上的實際效果,通過測試尋求影響因素。
·環境因素:分析產品可提供給用戶其他方面的支持,以及用戶感到反感的原因等外部因素。
·內容量:頁面的內容的覆蓋范圍和背景深淺等典型因素之間的配比,以及它們對于用戶使用體驗、視覺感知的影響。
·內容屬性:深色的背景對于圖形和文本等不同屬性的元素的影響。

0
0
分享到:

0

喜歡他,就推薦他上首頁吧^_^

推薦閱讀

×

賽事服務聯系方式

0371-86068866

4008887269

cndesign@163.com

好的,我知道了

官方微信

聯系我們

  • QQ:33143335 QQ:1904200230
  • 電話:18569912460
  • 投稿:cndesign@163.com
  • 地址:鄭州市國家大學科技園東區9號樓2層

版權信息

  移動 Android 版 豫 ICP 備16038122號-2 豫公網安備 41019702002261號

亚洲视频在线一区二区三区_色婷婷AV一区二区三区浪潮_亚洲综合无码精品一区二区三区_高清精品一区二区三区一区

      久久综合成人精品亚洲另类欧美| 黄色成人小视频| 久久手机精品视频| 日韩午夜三级在线| 国产日韩欧美在线播放不卡| 欧美夫妇交换俱乐部在线观看| 午夜国产精品视频免费体验区| 亚洲国产视频a| 国产亚洲激情| 国产精品高清免费在线观看| 男女视频一区二区| 久久福利精品| 午夜欧美大尺度福利影院在线看 | 免费在线播放第一区高清av| 妖精视频成人观看www| 在线观看日韩av先锋影音电影院| 国产精品久久久久久久久久久久久 | 国产精品爱久久久久久久| 久久久久久久久久码影片| 亚洲一区二区三区777| 亚洲日本在线观看| 亚洲日本在线观看| 亚洲观看高清完整版在线观看| 国产午夜精品一区二区三区视频| 国产精品女主播| 国产精品夫妻自拍| 欧美日韩在线免费| 欧美日韩免费高清| 欧美日韩一级黄| 欧美色网一区二区| 欧美性视频网站| 欧美日一区二区三区在线观看国产免 | 亚洲日本欧美| 91久久国产综合久久| 亚洲肉体裸体xxxx137| 亚洲人成人一区二区三区| 亚洲国产你懂的| 99视频精品在线| 亚洲尤物精选| 久久成人资源| 欧美成人一品| 欧美体内she精视频在线观看| 国产精品盗摄久久久| 国产精品一香蕉国产线看观看| 国产精品一区二区久久国产| 国产日韩精品一区二区三区| 韩日成人av| 亚洲人成网站在线观看播放| 99国产精品自拍| 欧美亚洲日本国产| 欧美成人免费网站| 欧美视频国产精品| 国产一区二区三区网站| 亚洲电影专区| 亚洲一区亚洲二区| 久久久欧美精品| 欧美日韩亚洲视频| 国产一区二区三区高清播放| 亚洲国产日韩欧美在线图片| 亚洲天堂av在线免费观看| 欧美在线综合| 欧美视频日韩视频在线观看| 国产日韩欧美在线播放不卡| 亚洲伦理精品| 久久久精品国产免大香伊| 欧美日韩国产区一| 韩国一区电影| 欧美一区成人| 欧美日韩在线精品| 在线免费观看日本一区| 亚洲欧美成人一区二区在线电影 | 国内外成人在线| 99这里只有精品| 欧美第一黄网免费网站| 国产午夜精品在线| 一区二区三区日韩在线观看| 久久久久久久久久久一区| 国产精品日日摸夜夜摸av| 亚洲片在线观看| 久久综合图片| 激情视频一区| 久久精品91久久久久久再现| 欧美日韩一区二区国产| 亚洲人妖在线| 欧美大尺度在线观看| 国内精品视频在线播放| 欧美一区二区三区在线免费观看| 欧美日韩一区二| 亚洲精选久久| 欧美精品在欧美一区二区少妇| 亚洲电影在线播放| 麻豆成人在线播放| 在线观看日产精品| 免费亚洲视频| 在线观看日韩一区| 美女图片一区二区| 亚洲国产精品久久久久秋霞蜜臀 | 在线视频国内自拍亚洲视频| 欧美中文字幕视频| 国产欧美 在线欧美| 欧美一区二区三区喷汁尤物| 国产精品亚洲综合久久| 欧美伊久线香蕉线新在线| 国产伦精品一区二区三区高清| 亚洲综合99| 国产一区在线看| 另类图片综合电影| 亚洲精品欧洲| 国产精品久久久久久模特| 午夜伦理片一区| 狠狠色丁香婷婷综合| 久久夜色精品国产噜噜av| 亚洲大胆女人| 欧美日韩不卡在线| 亚洲欧美韩国| 伊甸园精品99久久久久久| 欧美激情女人20p| 亚洲一区区二区| 国产欧美另类| 欧美阿v一级看视频| 日韩视频永久免费| 国产欧美日韩视频一区二区三区 | 免费中文日韩| 99精品视频免费全部在线| 国产精品一区二区你懂的| 久久久国产精品一区二区中文| 亚洲第一中文字幕在线观看| 欧美三级乱人伦电影| 久久精品视频在线观看| 日韩视频第一页| 国产午夜精品理论片a级大结局| 久久在线免费观看视频| 一本一本久久| 一区免费观看| 国产精品一卡二| 欧美日韩高清在线| 久久精品亚洲一区二区| 99精品视频免费| 激情久久久久| 国产精品嫩草99av在线| 欧美高清在线观看| 久久av一区二区三区漫画| 日韩性生活视频| 亚洲大片一区二区三区| 国产欧美日韩激情| 欧美日韩另类一区| 乱中年女人伦av一区二区| 午夜欧美电影在线观看| 一区二区欧美国产| 亚洲国产精品久久久久婷婷老年| 国产视频在线观看一区二区| 欧美日韩无遮挡| 欧美激情视频一区二区三区免费 | 永久久久久久| 国产伦理精品不卡| 国产精品久久久久久久久免费| 欧美刺激午夜性久久久久久久| 欧美一区二区在线看| 亚洲午夜免费福利视频| av成人免费观看| 最新日韩精品| 亚洲成人直播| 在线播放视频一区| 一区二区亚洲| 樱花yy私人影院亚洲| 激情国产一区二区| 国色天香一区二区| 激情自拍一区| 一区视频在线看| 依依成人综合视频| 136国产福利精品导航网址| 在线日韩成人| 亚洲精品国产欧美| 99精品久久久| 亚洲一区网站| 午夜欧美大片免费观看| 欧美一区二区三区精品电影| 欧美一区二区三区免费视| 午夜一区二区三区在线观看 | 国产欧美日韩中文字幕在线| 国产精品视频xxx| 国产一区二区三区在线观看视频| 国产视频精品网| 在线观看欧美| 亚洲毛片视频| 亚洲一区欧美激情| 久久久不卡网国产精品一区| 久久人人爽人人爽爽久久| 欧美ed2k| 欧美午夜精品理论片a级大开眼界| 国产精品国产精品| 国产日韩欧美另类| 在线精品高清中文字幕| 日韩一级黄色大片| 午夜精品久久久久久久久久久久久| 欧美一区二区三区另类| 免费久久99精品国产| 欧美日韩午夜精品| 黑人巨大精品欧美一区二区| 亚洲美女少妇无套啪啪呻吟|