眼鏡顏色

顏色會考量顯示器、環境和認知。眼鏡上的色彩採用精緻的調色盤,支援加法顯示器的行為,並提供最佳的視覺舒適度。在智慧眼鏡上使用顏色時,應謹慎搭配現實世界,用來表示重要動作、顯示圖像或提供語意。

在光學透視螢幕上,黑色是透明的。設計時請注意,深色會顯得暗淡或透明,但也可以用來營造深度。

色彩配置

眼鏡色彩配置 (一組色彩符記或角色,用於設定應用程式的色彩主題) 包含 3 個強調色角色、4 個表面色 (或中性色角色) 及其對應的「on-color」角色。顏色角色與行動版配置角色類似,使用方式也相同。

設計元素應錨定在影格底部。

強調色可做為 on color,但強調效果有限。

大部分的文字內容都使用白色文字。字型顏色可用於強調文字。
為所有內容使用彩色文字。

自訂顏色

自訂眼鏡顏色時,請務必盡量減少視覺障礙,並與現實世界協調一致,在不同光線條件下優先確保可讀性。仔細校正色彩,平衡亮度與飽和度,確保色彩能立即辨識。

主要顏色可自訂為品牌或主要互動顏色。 請考量所選顏色的對比度、飽和度和耗電量。

設計元素應錨定在影格底部。

最佳化品牌和語意顏色

代表品牌、動作或系統快訊的顏色必須符合下列條件:

  • 亮度足夠,可清楚辨識
  • 飽和度足夠,可辨識為顏色

詳情請參閱 Jetpack Compose Glimmer 主題

耗電量

有些顏色比其他顏色更耗電,也會產生更多熱能。如右側所示,如果比較色調相同的顏色,綠色最省電,藍色最耗電。盡量減少點亮的像素數量。螢幕越亮,螢幕溫度就越高。請勿以全白畫面填滿螢幕,否則可能會導致熱能減緩。

設計元素應錨定在影格底部。

請考量使用者會遇到的所有背景之間的對比。
各種背景上的 UI 元素對比度不足,可能導致眼睛疲勞和難以辨識。
如要確保文字在任何背景上都有足夠的對比度,前景和背景顏色的色調對比差異必須達到 70 (7:1)。您可以將設計設為「螢幕」混合模式,測試這項功能。
使用飽和度較低的色彩。
使用過於飽和的顏色。可能無法正常顯示,導致難以閱讀。

請避免使用客製化表面。

設計元素應錨定在影格底部。

深色容器顏色

容器通常必須專注於顯示其中的內容,且不得造成干擾:

  • 如要達到最高對比度,表面必須是黑色
  • 輪廓應清晰可見,但不能太過顯眼

使用深色介面和亮色內容。
使用明亮或填滿的介面。

您可以自訂外框,加入品牌或表情符號 UI。

使用預設顏色。這些內容經過高度最佳化,適合在眼鏡上顯示。
使用多種輪廓顏色。

請小心處理,並協調焦點和預設狀態外框之間的自訂顏色。

設計元素應錨定在影格底部。 使用藍色自訂外框焦點:焦點狀態醒目顯示由 2 個外框組成,顏色會套用至第 2 層,以微調焦點狀態。