亚洲av日韩av永久无码久久,免费的视频app网站,欧美性猛交xxxx免费看,国产成人精品三级麻豆

教你一文讀懂暗色模式

2024-4-10    博博

暗色模式(Dark Mode)的興起是一個(gè)逐漸發(fā)展的過(guò)程,它涉及到技術(shù)進(jìn)步、用戶(hù)體驗(yàn)優(yōu)化以及設(shè)計(jì)趨勢(shì)的變化。
隨著iOS 13在2019年的發(fā)布,暗色模式開(kāi)始成為用戶(hù)關(guān)注的焦點(diǎn);在用戶(hù)體驗(yàn)方面,設(shè)計(jì)者們考慮到了環(huán)境光線(xiàn)與屏幕亮度的匹配問(wèn)題,暗色模式可以有效減少視覺(jué)疲勞;在實(shí)際使用中,用戶(hù)發(fā)現(xiàn)暗色模式在光線(xiàn)較暗的環(huán)境中更為舒適,這也促使了暗色模式的普及和發(fā)展。
暗色模式在UI設(shè)計(jì)中的重要性體現(xiàn)在改善視覺(jué)舒適度、節(jié)省電量以及提供個(gè)性化選擇上,其普及程度隨著用戶(hù)需求和技術(shù)發(fā)展不斷提升。
 
 
「大廠設(shè)計(jì)師」教你一文讀懂暗色模式
 
一、定義及其在UI設(shè)計(jì)中的表現(xiàn)形式
1.暗色模式的定義
  暗色模式是一種低光用戶(hù)界面(UI)設(shè)計(jì),也稱(chēng)為深色模式,是一種用戶(hù)界面設(shè)計(jì)選項(xiàng),它使用較深的顏色方案和背景,通常為黑色或深灰色,以減少屏幕亮度并提供更舒適的視覺(jué)體驗(yàn)。
iOS 13 亮色模式(左)與暗色模式(右)的對(duì)比
iOS 13 亮色模式(左)與暗色模式(右)的對(duì)比
 
2.暗色模式的定義
(1).暗色模式在UI設(shè)計(jì)中的表現(xiàn)形式
設(shè)計(jì)師需要為暗色模式創(chuàng)建一個(gè)新的調(diào)色板,這通常意味著降低顏色的飽和度,以適應(yīng)深色背景。同時(shí),避免使用純黑作為主色調(diào)背景,而是選擇接近純黑的深灰色,以確保閱讀體驗(yàn)的舒適性和可讀性。
亮色/暗色模式下主色需要進(jìn)行調(diào)整
亮色/暗色模式下主色需要進(jìn)行調(diào)整
 
(2).對(duì)比度控制
暗色背景與文本顏色之間的對(duì)比度應(yīng)該控制在WCAG2.0AA級(jí)標(biāo)準(zhǔn)以上,以保證內(nèi)容的清晰度和易讀性。對(duì)于彩色元素,也需要適當(dāng)調(diào)整飽和度,確保整體色彩之間的對(duì)比度符合無(wú)障礙標(biāo)準(zhǔn)。
達(dá)到/未達(dá)到WCAG2.0AA標(biāo)準(zhǔn)的視覺(jué)效果對(duì)比
達(dá)到/未達(dá)到WCAG2.0AA標(biāo)準(zhǔn)的視覺(jué)效果對(duì)比
 
(3).視覺(jué)元素區(qū)分
在暗色模式下,設(shè)計(jì)師需要特別注意視覺(jué)元素的區(qū)分,通過(guò)足夠的對(duì)比度來(lái)保證文字和圖形的清晰可見(jiàn)。這不僅僅是簡(jiǎn)單的顏色反轉(zhuǎn),而是一種“弱光”主題的設(shè)計(jì)思考,旨在優(yōu)化用戶(hù)在低光環(huán)境下的視覺(jué)體驗(yàn)。
亮色模式中的按鈕在暗色模式中顯得太跳躍
亮色模式中的按鈕在暗色模式中顯得太跳躍
 
二、歷史回顧及發(fā)展脈絡(luò)
1.命令行界面時(shí)代
在早期的計(jì)算機(jī)系統(tǒng)中,如DOS和Linux,終端通常使用暗色模式,這是因?yàn)樵缙诘腃RT顯示器存在閃爍問(wèn)題,暗色背景能夠減少視覺(jué)疲勞,并提供較高的對(duì)比度。
Linux的終端界面
Linux的終端界面
 
2.個(gè)人電腦時(shí)代
隨著個(gè)人電腦的普及,圖形用戶(hù)界面(GUI)逐漸成為標(biāo)準(zhǔn),此時(shí)大多數(shù)操作系統(tǒng)和應(yīng)用程序采用了亮色模式,以模仿紙張的顏色并減少CRT顯示器的眩光。
Windows2000的GUI
Windows2000的GUI
 
3.移動(dòng)設(shè)備時(shí)代
智能手機(jī)和平板電腦的興起帶來(lái)了OLED等先進(jìn)顯示技術(shù),這些設(shè)備的小屏幕和高分辨率使得暗色模式再次變得實(shí)用和流行,特別是在節(jié)省電量和減少眼睛疲勞方面。
iOS13的暗色模式
iOS13的暗色模式
 
4.操作系統(tǒng)時(shí)代
近年來(lái),各大操作系統(tǒng)開(kāi)始正式支持暗色模式。例如,Windows 10在2018年的更新中引入了暗色應(yīng)用模式,macOS和iOS隨后也推出了可以根據(jù)時(shí)間或環(huán)境自動(dòng)切換的暗色模式。
Windows10的暗色模式
Windows10的暗色模式
 
三、設(shè)計(jì)趨勢(shì)中暗色模式的地位
暗色模式在當(dāng)前設(shè)計(jì)趨勢(shì)中占據(jù)重要地位,以其減輕眼睛疲勞、節(jié)省電量和聚焦內(nèi)容的優(yōu)勢(shì)受到青睞。它不僅適應(yīng)低光環(huán)境,還提供美學(xué)上的新探索,響應(yīng)了用戶(hù)對(duì)舒適性和個(gè)性化選擇的需求。隨著技術(shù)發(fā)展和設(shè)計(jì)創(chuàng)新,暗色模式已成為現(xiàn)代界面設(shè)計(jì)不可或缺的一部分。許多頂級(jí)品牌和應(yīng)用程序,如WhatsApp、Instagram、Google、Facebook等,都已經(jīng)引入暗色模式設(shè)計(jì),這表明暗色模式已經(jīng)成為了一種廣泛接受的設(shè)計(jì)趨勢(shì)。
從左往右依次為:WhatsApp、Instagram、Google、Facebook
從左往右依次為:WhatsApp、Instagram、Google、Facebook
 
「大廠設(shè)計(jì)師」教你一文讀懂暗色模式
 
一、用戶(hù)體驗(yàn)層面
1.提高閱讀舒適度
(1).對(duì)比度和可讀性
在相同的對(duì)比度條件下,淺背景上的黑字比深背景上的淺色字閱讀效果更好。這表明,優(yōu)化對(duì)比度是提高閱讀舒適度的關(guān)鍵因素之一。
淺背景上深字與深背景上淺字的視覺(jué)對(duì)比
淺背景上深字與深背景上淺字的視覺(jué)對(duì)比
 
(2).用戶(hù)偏好和滿(mǎn)意度
一項(xiàng)針對(duì)用戶(hù)對(duì)暗色模式的使用體驗(yàn)的調(diào)查顯示,與默認(rèn)的白底模式相比,用戶(hù)在使用暗色模式時(shí)報(bào)告了更低的視覺(jué)疲勞和更高的滿(mǎn)意度。斯隆(Sloan)的一項(xiàng)研究在1977年就報(bào)告說(shuō),如果更多的光線(xiàn)通過(guò)混濁的透鏡到達(dá)眼睛,則出現(xiàn)畸變的可能性更大,即暗模式對(duì)視力障礙者更好。
對(duì)于長(zhǎng)時(shí)間從事屏幕工作的人來(lái)說(shuō),暗色模式對(duì)眼睛更加友好
對(duì)于長(zhǎng)時(shí)間從事屏幕工作的人來(lái)說(shuō),暗色模式對(duì)眼睛更加友好
 
2.減少視覺(jué)疲勞
(1).人眼生理特性
暗色模式能減少屏幕發(fā)出的光線(xiàn),這有利于減少眼睛疲勞和不適,特別是在低光環(huán)境下,人眼的虹膜會(huì)打開(kāi)以接受更多光線(xiàn),而暗色模式提高了減少的光源,減少了對(duì)眼睛的刺激
亮/暗環(huán)境下瞳孔大小的變化
亮/暗環(huán)境下瞳孔大小的變化
 
(2).藍(lán)光輻射減少
人們通過(guò)長(zhǎng)期研究發(fā)現(xiàn)短波可見(jiàn)光,即紫光和藍(lán)光對(duì)眼底視網(wǎng)膜有相當(dāng)程度的破壞作用, 而人們通常把這種可見(jiàn)光波長(zhǎng)中高能量波段(400- 470nm)對(duì)視網(wǎng)膜的損壞現(xiàn)象稱(chēng)為“藍(lán)光傷害現(xiàn)象”。 還有研究關(guān)注了暗色模式對(duì)藍(lán)光輻射的影響。由于暗色模式降低了屏幕的整體亮度,因此也減少了藍(lán)光的輻射。
可見(jiàn)光波段分布
可見(jiàn)光波段分布
 
二、設(shè)備電池壽命
1.降低屏幕功耗
在OLED屏幕上,每個(gè)像素都是獨(dú)立發(fā)光的,當(dāng)顯示黑色時(shí),相關(guān)的像素點(diǎn)會(huì)關(guān)閉,從而不消耗能量。這意味著,顯示大面積黑色內(nèi)容的暗色模式能夠顯著減少屏幕的能量消耗。
OLED屏幕發(fā)光原理
OLED屏幕發(fā)光原理
 
2.實(shí)際省電效果
以 Google 測(cè)試數(shù)據(jù)為例,OLED 屏幕的 Pixel 手機(jī)在時(shí)間段內(nèi)啟用深色模式并在使用地圖導(dǎo)航時(shí)保持屏幕最大亮度,手機(jī)的電量消耗下降了 63%。
Google的測(cè)試數(shù)據(jù)
Google的測(cè)試數(shù)據(jù)
 
三、降低屏幕功耗
1.促進(jìn)睡眠
對(duì)于晚上喜歡在床上閱讀或工作的用戶(hù)來(lái)說(shuō),暗色背景有助于降低屏幕亮度,減少對(duì)褪黑素分泌的干擾,也有助于減少藍(lán)光對(duì)睡眠周期的影響,從而幫助用戶(hù)更快入睡并提高睡眠質(zhì)量。
OPPO手機(jī)暗色模式廣告
OPPO手機(jī)暗色模式廣告
 
2.減少眩光
眩光是明亮的屏幕和低光環(huán)境之間惱人的對(duì)比現(xiàn)象,對(duì)眼睛具有一定的影響并造成眼部不適。暗色模式通過(guò)使用深色背景和亮色文字,整體降低了屏幕的亮度,這樣在光線(xiàn)較亮的環(huán)境中,屏幕的亮光與周?chē)淡h(huán)境的對(duì)比度降低,從而減少了屏幕反射光線(xiàn)對(duì)眼睛的刺激,降低不適。
有眩光與無(wú)眩光的顯示器對(duì)比
有眩光與無(wú)眩光的顯示器對(duì)比
 
四、打造沉浸式體驗(yàn)
1.減少視覺(jué)干擾
暗色模式提高了一種無(wú)干擾的工作環(huán)境,有助于他們專(zhuān)注于手頭的任務(wù),特別是在進(jìn)行寫(xiě)作、編碼或其他需要集中注意力的活動(dòng)時(shí),暗色模式能夠減少視覺(jué)干擾。
暗色模式為視覺(jué)設(shè)計(jì)提供了更大的對(duì)比度,使得界面元素更為突出。這種高對(duì)比度不僅有利于內(nèi)容的戰(zhàn)士,也增強(qiáng)了用戶(hù)的視覺(jué)聚焦,讓用戶(hù)更容易沉浸于應(yīng)用或游戲的環(huán)境中。特別是在觀看視頻或進(jìn)行游戲時(shí),暗色背景能夠使色彩更為鮮明,提升用戶(hù)的視覺(jué)體驗(yàn)。
編碼軟件一般默認(rèn)暗色界面,有利于專(zhuān)注工作
編碼軟件一般默認(rèn)暗色界面,有利于專(zhuān)注工作
 
2.增強(qiáng)視覺(jué)聚焦
暗色模式為視覺(jué)設(shè)計(jì)提供了更大的對(duì)比度,使得界面元素更為突出。這種高對(duì)比度不僅有利于內(nèi)容的戰(zhàn)士,也增強(qiáng)了用戶(hù)的視覺(jué)聚焦,讓用戶(hù)更容易沉浸于應(yīng)用或游戲的環(huán)境中。特別是在觀看視頻或進(jìn)行游戲時(shí),暗色背景能夠使色彩更為鮮明,提升用戶(hù)的視覺(jué)體驗(yàn)。
手游王者榮耀UI界面


作者:阿琳01
來(lái)源:站酷

藍(lán)藍(lán)設(shè)計(jì)(www.chinatradebeam.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)、APP界面設(shè)計(jì)圖標(biāo)定制、用戶(hù)體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)、UI咨詢(xún)、高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì),以及相關(guān)的軟件開(kāi)發(fā)服務(wù),咨詢(xún)電話(huà):01063334945。

關(guān)鍵詞:UI咨詢(xún)、UI設(shè)計(jì)服務(wù)公司軟件界面設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)公司UI交互設(shè)計(jì)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、用戶(hù)體驗(yàn)公司、高端網(wǎng)站設(shè)計(jì)公司

銀行金融軟件UI界面設(shè)計(jì)、能源及監(jiān)控軟件UI界面設(shè)計(jì)氣象行業(yè)UI界面設(shè)計(jì)、軌道交通界面設(shè)計(jì)、地理信息系統(tǒng)GIS UI界面設(shè)計(jì)、航天軍工軟件UI界面設(shè)計(jì)醫(yī)療行業(yè)軟件UI界面設(shè)計(jì)、教育行業(yè)軟件UI界面設(shè)計(jì)、企業(yè)信息化UI界面設(shè)計(jì)、軟件qt開(kāi)發(fā)、軟件wpf開(kāi)發(fā)軟件vue開(kāi)發(fā)

日歷

鏈接

個(gè)人資料

藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.chinatradebeam.com

存檔

亚洲国产精品久久久久婷婷老年 | 肉不停h共妻h山中猎户h| 日本久久高清一区二区三区毛片| 亚洲精品国产精品乱码不卡√| 国产精品久久| 99re8在这里只有精品2| 精品国模一区二区三区| 性少妇jealousvue成熟| 久久久久久国产精品美女| 欧美精品无码一区二区三区| 精品久久香蕉国产线看观看亚洲| 8AV国产精品爽爽ⅤA在线观看| 欧美性xxxxx极品娇小| 欧美午夜精品一区二区蜜桃| 快穿名器系统纯肉巨污文直播 | 精国产品一区二区三区a片 | 久久久久亚洲av片无码| 欧美黑人狂躁日本妞免费视频 | 久久成人国产精品| 无码中文字幕色专区| 亚洲 自拍 另类 欧美 综合| 人交CZ00与女性XXX| 国产古装妇女野外a片| 夜夜爽夜夜叫夜夜高潮漏水| 国产精品久久人妻无码网站一区| 波多野结衣作品| 小罗莉极品一线天在线| 丁香花在线影院观看在线播放| 无码人妻一区二区三区免费n鬼沢| 性饥渴的老妇教我玩她| 后入内射无码人妻一区| 五月丁香综合激情六月久久| 国产又粗又猛又爽又黄| 老熟妇高潮一区二区三区| 少妇厨房愉情理伦bd在线观看| 国产精品偷伦视频免费观看了| 免费毛片在线看不用播放器| 国产精品久久午夜夜伦鲁鲁| 人妻丰满熟妇av无码区乱| 亚洲午夜av久久久精品影院色戒 | 熟女人妻一区二区三区免费看|