iOS11人機(jī)交互指南-視覺-04:顏色 Color

顏色

顏色可以提示交互,賦予活力,并提供視覺的連續(xù)性,明確狀態(tài)信息,增強(qiáng)數(shù)據(jù)可視化。系統(tǒng)的配色方案可以作為應(yīng)用參考,無論在淺色或者深色的背景中,這些顏色都很明快并易于組合使用。

Color

巧妙使用顏色

重要信息的用色應(yīng)謹(jǐn)慎選擇,要凸顯其重要性。例如,當(dāng)紅色被用作表示非關(guān)鍵信息時,用紅色三角形告知用戶有一個關(guān)鍵問題就不太有效。


用色要協(xié)調(diào)

使用協(xié)調(diào)的顏色來提升使用體驗(yàn),而不是讓用戶特別集中注意力或分散注意力。如果使用粉色作為應(yīng)用主色調(diào),其它用色應(yīng)與粉色協(xié)調(diào)。


使用與 Logo 協(xié)調(diào)顏色

色彩的微妙使用是強(qiáng)化品牌的好方法。


確定產(chǎn)品主色,貫穿應(yīng)用始終

在筆記中,交互元素為黃色;在日歷中,交互元素是紅色。在確定產(chǎn)品主色后,請確保其他用色與之協(xié)調(diào)。


避免交互式和非交互式元素用色相同

如果互動和非互動元素用色相同,用戶很難得知哪里可以點(diǎn)擊。

啟用和禁用元素


插圖和半透明度會影響附近顏色

插圖的改變,有時會讓附近顏色發(fā)生變化,保持視覺上的連續(xù)性,防止界面元素太過搶眼或無法辨別。例如,地圖的道路顏色在使用地圖模式時使用淺色,但在衛(wèi)星模式下會切換到深色方案。前面有半透明元素(例如工具欄)時,顏色也可能會發(fā)生變化。

在各種照明條件下測試配色方案

根據(jù)室內(nèi)氛圍、時間、天氣等情況,室內(nèi)外照明都有很大差異。應(yīng)用在現(xiàn)實(shí)使用中,設(shè)計時的顏色并不總是看起來一致。在多個照明條件下預(yù)覽應(yīng)用,包括在陽光明媚的室外環(huán)境下,如有必要了解顏色顯示方式,調(diào)整顏色,以便在大多數(shù)環(huán)境中提供最佳的觀看體驗(yàn)。


考慮 True Tone Display 顯示技術(shù)對顏色的調(diào)整

True Tone Display 顯示技術(shù)能根據(jù)周圍環(huán)境色溫,智能調(diào)整屏幕顯示效果。專注于閱讀、照片、視頻和游戲的應(yīng)用可以通過適應(yīng)風(fēng)格來加強(qiáng)或削弱這種效果。


考慮色盲

盲人難以區(qū)分紅色和綠色(含灰度顏色),或者從橙色區(qū)分出藍(lán)色。避免使用這些顏色組合作為區(qū)分兩種狀態(tài)的唯一方法??梢允褂眉t色方塊和綠色圓圈,而不是使用紅色和綠色圓圈來表示離線和在線。一些圖像編輯軟件包含檢測色盲是否試用工具。

左圖為色彩正常用戶所見,右圖為紅綠色盲所見

考慮顏色在不同文化中的引申意

在某些文化中,紅色有危險的含義;而在另一些文化怯怯相反。確保應(yīng)用中的用色傳達(dá)了正確的含義。


使用足夠的對比度

應(yīng)用中的色彩對比度不足會使內(nèi)容難以閱讀。例如,圖標(biāo)和文字可能與背景相融。在線色彩對比計算器可以準(zhǔn)確分析應(yīng)用中的顏色對比度情況,確保符合最佳標(biāo)準(zhǔn):7:1 為最優(yōu),4.5:1 為最低要求。


顏色管理

圖片應(yīng)包含顏色配置文件

iOS 上的默認(rèn)色彩空間是標(biāo)準(zhǔn) sRGB。要確保顏色與此顏色空間正確匹配,請確保圖片包含嵌入的顏色配置文件。


使用 P3 色彩空間增強(qiáng)廣色域屏幕體驗(yàn)

iOS 設(shè)備的廣色域屏幕支持 Display P3 色彩空間,顏色比 sRGB 更豐富,更飽滿。因此使用 P3 色彩空間的照片和視頻更加逼真,視覺數(shù)據(jù)和狀態(tài)指示更具沖擊力。適當(dāng)時,使用 P3 顏色配置文件(每通道16位),并以 .png 格式導(dǎo)出圖像。請注意,需要支持 P3 顏色配置文件的顯示器才能設(shè)計相匹配的顏色。


為特定圖片提供雙色彩標(biāo)準(zhǔn)

一般來說,P3 顏色空間和圖片傾向于在 sRGB 設(shè)備中使用,有時很難區(qū)分其中的差異。但 P3 顏色的漸變效果在 sRGB 上會出現(xiàn)色帶。為了避免這些問題,可以在 Xcode 的資源目錄中提供不同色彩標(biāo)準(zhǔn)的圖像,確保色彩還原度。


在 sRGB 和? P3 屏幕上都預(yù)覽顏色

根據(jù)需要進(jìn)行調(diào)整,以確保在兩種類型的屏幕上同時預(yù)覽視覺效果。


最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容