發(fā)布時間:2024-03-25 18:52:31 瀏覽量:145次
我們的日常生活是無盡的選擇。在個人和職業(yè)生活中,我們必須考慮許多對立面和挑戰(zhàn),解決方案不僅基于建議,而且還基于事實,經(jīng)驗和知識。今天,我們將討論UI設計師需要頻繁選擇的項目之一:哪種方案對于界面更好,光線還是黑暗?
影響配色方案選擇的因素
可以肯定的是,沒有人會為所有目標而努力。該解決方案在很大程度上取決于許多因素,不僅涉及用戶方面,還涉及業(yè)務目標,市場條件和當前設計趨勢。讓我們回顧一下在這個問題上必須考慮的基本因素.
可讀性和易讀性
這些術語都與對文本內容的感知直接相關??勺x性定義了人們可以輕松閱讀單詞,短語和段落。清晰度衡量用戶如何快速直觀地區(qū)分特定字體中的字母。
應該仔細考慮這些特征,特別是對于填充了大量文本的界面。在許多其他因素中,為界面選擇的配色方案在文本感知的有效過程中起著至關重要的作用。例如,與在不同背景下感知的物理對象一樣,白色或淺色背景上顯示的黑色副本似乎大于黑色背景上的白色副本。可讀性差導致用戶體驗不佳:用戶無法掃描數(shù)據(jù),甚至更多 - 即使數(shù)據(jù)相關但不可讀,用戶感覺到與文本糾結的莫名其妙的時態(tài),甚至可能錯過關鍵信息。
這是否意味著具有淺色背景的界面更具可讀性?不總是。其中一位著名的用戶體驗設計大師JacobNielsen提到:“在文字和背景之間使用高對比度的顏色。最佳易讀性需要白色背景上的黑色文字(所謂的正面文字)。黑色背景上的白色文字(負面文字)幾乎一樣好。雖然對比度與正面文本的對比度相同,但倒置的顏色方案會使人稍微放松一些,并會稍微放慢閱讀速度。在顏色方案中,易讀性受到更多影響,使文字比純黑色更輕,特別是如果背景比純白色更暗。
因此,如果設計師在不同背景下研究復制感知的特性并仔細研究字體選擇,那么任何配色方案都可能足夠可讀。
然而,一些追溯到20世紀80年代的科學研究表明,對于大量的文本來說,淺色背景似乎是大多數(shù)用戶更有效的選擇。研究廣告運營商如何運作,D. Bauer和CRCavonius在文章“通過對比反轉提高視覺顯示單元的易讀性”(1980)中分享了他們的探索。特別是,他們發(fā)現(xiàn)參與者在閱讀文本時精確度為26%,并且在淺色背景中使用了深色字符。
為什么會這樣?Sensory Perception and Interaction Research Group(英屬哥倫比亞大學)的JasonHarrison以下述方式解釋了這種現(xiàn)象。散光的人(根據(jù)不同的統(tǒng)計數(shù)據(jù)提供了大約50%的人口)感覺黑色的白色文本比白色的黑色文本更難察覺。其中一部分與光照水平有關。有了明亮的顯示屏(白色背景),虹膜會更加閉合,從而減少“變形”鏡頭的影響。在黑色顯示器(黑色背景)下,虹膜會打開以接收更多光線,鏡頭的變形會在眼睛處產生更加模糊的焦點。因此,基于此,如果界面呈現(xiàn)大量副本并提示長時間閱讀體驗,則淺色背景可能會感覺更加用戶友好。
無障礙
可訪問性主要定義為Web或移動界面盡可能接觸更多人的能力,并提供其功能,而不受任何歧視。因此,“使用還是不使用”的決定必須基于用戶的需求和偏好,而不是其身體能力。色彩方案是影響這方面的最主要因素之一。選擇調色板和顏色組合時,設計師需要考慮不同年齡,特殊需求或殘疾的用戶,這些用戶還可以確定背景和布局元素的顏色選擇。用戶研究 成為向UX設計人員提供有助于更接近目標受眾的數(shù)據(jù)的重要幫助。
明晰
清晰度定義了查看和區(qū)分屏幕或頁面上所有核心細節(jié)的能力。首先,它涉及導航的簡單性和直觀性:能夠掃描布局并找到信息和交互元素的區(qū)域,用戶不需要付出太多努力來獲得他們所需的東西。如果這方面沒有得到適當?shù)臏y試,可能會導致視覺層次較弱,并使屏幕變得一團糟。對比度在這里起著重要的作用,配色方案成為它的基礎。為了檢查,如果界面清晰并且對比度足夠,在模糊模式下查看屏幕或頁面時,請不要忘記“模糊效果”的一個很好的舊技巧,并檢查是否所有重要內容都容易到達并且明顯。
響應
界面的響應性意味著無論用戶使用何種設備,用戶都可以使用它。Sketch n高分辨率專業(yè)顯示器看上去很時尚和吸引人,可能會變成小型低分辨率屏幕上的臟污。因此,在設計階段看起來不錯的一些配色方案可能會在其應用的各種日常條件下失去美感。由于配色方案直接影響顏色,形狀和復制感知,所以在做出最終決定之前應該在多種設備上進行測試。
環(huán)境
Web和移動界面被用在如果目標受眾被仔細研究的情況下可能被認為是典型的環(huán)境中。例如,關于在自然光線下不斷使用,深色背景可以從字面上創(chuàng)造反射效果,特別是在平板電腦和智能手機的典型光面屏幕上。相反,在光線不好的環(huán)境下,黑暗的背景可以將光線從屏幕上移開,這對導航和可讀性產生不利影響。所以,顏色組合,對比度和色調問題在這里引起了很大的關注。
配色方案選擇清單
考慮到上面提到的因素,我們在這里提供一個簡短的基本步驟清單,同時為網(wǎng)頁或移動界面選擇一個通用的配色方案。
1.定義界面的目的。確定了界面實用程序和解決問題能力的核心點后,您可以更加合理地選擇顏色方案。如果UI是文本驅動的(博客,新聞平臺,電子閱讀器等),淺色背景往往是一個有效的選擇。光線使得屏幕寬敞而寬敞,純粹專注于復制將更容易。另一方面,如果界面是視覺化驅動的,并且移動的是圖像而不是文本,則背景為黑色或明亮的配色方案可能是一個很好的解決方案,因為圖像的顏色感覺更深,并且總體布局變得時尚甚至奢華。
2.分析你的目標受眾。目標受眾的定義和分析是設計師應該做的首要事情。了解誰是你的潛在用戶,他們想從網(wǎng)站或應用中獲得什么,為可用,有用和有吸引力的界面奠定了堅實的基礎。中年人和老年人傾向于喜歡淺色方案的界面,因為他們發(fā)現(xiàn)他們更直觀和可導航。年輕人通常會發(fā)現(xiàn)性能良好的界面具有更加原始和時尚的黑色背景,因此可以成為目標用戶的參與方式。青少年和兒童被吸引到使用明亮背景和有趣細節(jié)的界面。顏色的選擇顯然取決于界面功能和內容的性質。但目標受眾的偏好始終是以用戶為中心的決策的良好線索。
3.研究競爭。另一方面要記住的是,你的產品不會在藍色海洋中出現(xiàn)。反之亦然,它將在巨大而充滿活力的競爭環(huán)境中爭取用戶的關注。配色方案的選擇也成為使應用程序或網(wǎng)站突出的方式,并導致用戶方的這種寶貴的第一次互動愿望?;ㄙM在探索該部分現(xiàn)有產品上的時間可以節(jié)省時間和精力,否則將浪費在重新設計無效解決方案上。
4.測試,測試,測試。上述要點說明了一個關鍵問題:因為顏色屬于直接影響界面的可用性和吸引力的因素,所以每個設計方案都應該在不同的分辨率下,在不同的屏幕上以及不同的條件下進行適當?shù)臏y試。在產品投放市場之前,測試揭示了配色方案的強弱點,如果設計方案效率低下,就會被討論并失去令人驚嘆的第一印象的機會。
妥協(xié)解決方案
不希望遵循嚴格的配色方案,用戶界面設計師有時會發(fā)現(xiàn)妥協(xié)方案,如下所示。
黑暗的界面,復制白色標簽
正如我們在UX設計趨勢回顧中所提到的,這種趨勢在基于黑暗背景方案的界面中特別流行。它還提供了一個更好的方法來實現(xiàn)適當?shù)目勺x性,這通常是辯論的問題:將核心數(shù)據(jù)塊的淺背景應用框或空格,設計人員可以解決此問題,并為屏幕或頁面增添優(yōu)雅的對比。其中一種情況是,當它得到有效應用時,是由Tubik團隊設計的Watering Tracker應用程序
給用戶選擇配色方案
另一種方法是讓用戶選擇模式。這就是我們?yōu)閁pper做的,一個待辦事項列表應用程序,它為用戶提供了一系列配色方案。一方面,它使產品對用戶非常友好,并根據(jù)不僅可用性問題而且根據(jù)審美偏好進行更加個性化的選擇。另一方面,設計師和開發(fā)人員需要額外的工作時間來制定所有的方案。
~此文轉載,如有侵權,請聯(lián)系刪除
熱門資訊
1. iPhone6的UI設計尺寸規(guī)范,原來如此重要!
想要了解iPhone6界面設計的尺寸規(guī)范嗎?這里為您詳細介紹iPhone6的UI設計尺寸規(guī)范,包括界面尺寸、圖標尺寸、可點擊高度規(guī)范、搜索欄高度規(guī)范以及界面元素之間的距離規(guī)范。
2. 12個絕佳的UI設計網(wǎng)站,助力你的創(chuàng)作之旅!
將為大家介紹12個絕佳的UI設計網(wǎng)站,這些網(wǎng)站不僅可以為你提供靈感,還可以幫助你學習新的技巧,助力你的創(chuàng)意之旅!dribbbleDribbble 是一個面向設計師的...
3. 移動端UI設計中常見的5種APP界面類型,你get到了嗎?
通過介紹移動端UI設計中的閃屏頁、引導頁、浮層引導頁、空白頁和首頁等5種APP界面類型,幫助大家更好地了解UI設計的基本知識
4. 10個免費學習UI設計的網(wǎng)站 提升你的設計能力
怎樣可以提升你的UI設計能力!第一個:站酷站酷想必是設計師都知道的一個網(wǎng)站,里面不止有UI設計的資源,還有其他設計的,不如:平面設計、網(wǎng)頁設計、字體...
在移動端設計中,列表頁和表單頁是不可或缺的部分。一個好的列表頁和表單頁設計能夠讓用戶輕松地獲取信息并產生點擊欲望,從而提高點擊率。本文將為你...
對于想要提高自己的設計能力和創(chuàng)造力的小白和UI設計師來說,這本書是一個很好的選擇。4.《設計的覺醒》(IKKO TANAKA)推薦理由: 這本書是日本現(xiàn)代平面...
探索零基礎UI設計培訓的時長與薪資前景。了解數(shù)字藝術教育領域的專業(yè)課程,以及培訓后的職業(yè)發(fā)展機會。
8. 物聯(lián)網(wǎng)APP UI設計:創(chuàng)造智能硬件領域的沉浸式體驗
ui設計應該讓用戶一目了然,能夠快速找到所需的信息和功能。在設計過程中,應盡量使用簡潔的圖標、文字和色彩,避免過多的視覺干擾。符合用戶習慣:ui設...
想了解武漢UI設計培訓班的費用是多少嗎?不知道學UI設計要花多少錢?不妨看看這篇文章,了解UI設計培訓班的學費價格以及學習內容。
10. 設計中的色彩心理學:淺析中西方色彩的歷史演變與設計應用
摘要:本文探討了色彩的歷史演變和設計應用。通過對色彩在早期文明社會中的實用運用、不同文化背景下色彩觀念的差異、色彩在設計中的重要性以及新興技...
同學您好!