Bu sayfa, Cloud Translation API ile çevrilmiştir.

Renk

Android Automotive işletim sisteminin renk stratejisinin temeli, "siyahtan yola çıkma" fikrine dayanmaktadır. Arayüz renklerini siyaha dayandırmak, gündüz ve gece temaları arasında belirgin bir değişiklik olmaması sayesinde daha tutarlı bir kullanıcı deneyimi sağlar.

Siyah renk kullanmak, donanımla daha iyi uyum sağlamayı da garanti eder, çünkü koyu renkli malzemeler genellikle otomobil iç mekanlarında ve gösterge panellerinde kullanılır.

Özet Bilgiler (TL;DR)

Hem gündüz hem de gece sürüşünü desteklemek için renk seçeneklerinizi siyahtan başlayarak oluşturun.
Arka plan ile simgeler veya metin arasında en az 4,5:1 kontrast oranı koruyun.

Renkleri minimum düzeyde ve amaçlı kullanın.
Yüksekliği gri tonlama ile göster
Görsel odağı yönlendirmek için şeffaflık ve opaklık kullanın.

Renk paletleri ve gradyanlar

Android Automotive OS arayüzünün koyu teması, gri tonlamalı bir palete dayanmaktadır. İdeal olarak, eklenen renklerin yoğunluğu, Material Design paletlerindeki renklerin koyu varyantlarında olduğu gibi azaltılmalıdır.

Bu bölümde, her bir bileşenle ilişkili yükseklik seviyeleri için gri tonlama değerlerini gösteren grafiklerin yanı sıra palet ve opaklık bilgileri de yer almaktadır.

Malzeme Tasarımı

Renk kullanımı ve paletleri

Android Automotive OS gri tonlama paleti

Android Automotive OS'nin gri tonlamalı renk paleti, metin ve simgeler gibi öğeler için kullanılır ve sürüş ortamının benzersiz gereksinimlerini karşılayacak şekilde tasarlanmıştır.

Bu renk paletinin yeterince çeşitli olması gerekiyor:

Koyu tema arayüzünün tüm farklı kullanım durumlarını ele alın.
Ton farklılıkları yoluyla hiyerarşiyi tanımlamak için yeterli aralık sağlayın.

gri renk paleti — Bu gri tonlamalı palet, Android Automotive OS'nin ana renk paletidir ve arayüzün koyu temasını destekler.

Ton farklılıkları, gölgelerin algılanamaz olduğu tamamen siyah arka planlarda bile derinlik yanılsaması yaratır. Yeterli ton farklılığı sağlamak için Android Automotive OS gri tonlama paleti orta grileri içerir. 900 Gri'den başlayan Material Design grileri, daha parlak renklere çok hızlı yaklaşır; iki ton daha açık bir renk olan 700 Gri, otomotiv bağlamı için çok parlaktır.

Bileşen yükseklik grafiği — Bu grafik, çeşitli bileşenlerin bulunduğu yükseklik seviyelerini göstermektedir. Her yükseklik seviyesinin ilişkili bir gri değeri vardır.

Gündüz ve gece modu gri tonlamalı yükseklik seviyeleri — Bu grafik, gündüz ve gece modunda çeşitli yükseklik seviyeleriyle ilişkili gri değerlerini göstermektedir.

Vurgu rengi

Android Automotive OS arayüzünün temelini oluşturan gri tonlamalı palete ek olarak, dikkat çekmek gibi amaçlar için diğer renkler de az miktarda kullanılabilir.

Şu anda Android Automotive OS'nin resmi olarak tek bir vurgu rengi bulunuyor; destek kütüphanesinde "araba vurgusu" olarak adlandırılan bir mavi tonu. Doygunluğu ve canlılığı artırmak için bu mavi, standart Google mavisinden biraz farklı bir tonda. Bu farklılık, renklerin koyu bir yüzeyde daha rahat görünmesine yardımcı oluyor.

Android Automotive işletim sistemindeki mavi "araç vurgusu" rengi, standart Google mavisine göre daha doygun olup, hem gündüz hem de gece sürüşlerinde koyu temalı arayüzde iyi görünmesi için tasarlanmıştır.

Opaklık değeri grafikleri

Şeffaflık, derinlik hissi verir ve Material Design'ın mekansal modelini güçlendirir. Şeffaflığı etkili bir şekilde kullanmak için, kullanım durumunuza bağlı olarak koyu veya açık opaklık değerlerini seçin.

Koyu opaklık değerleri

Koyu opaklık değerlerinin en yaygın kullanım alanı, perde (katman) oluşturmaktır.

Beyaz opaklık değerleri

Bu değerler çoğunlukla metinlerde kullanılır. Özellikle arka plan renkli olduğunda etkilidirler. Koyu renkli bir arka plan üzerinde düz gri kullanmak çok bulanık görünür.

Şeffaflık özelliğinin perdelerde ve metin hiyerarşilerinde nasıl kullanılacağına dair örnekler için Kılavuz ve örnekler bölümüne bakın.

Zıtlık

Android Automotive OS'nin temel güvenlik yönergelerini karşılamak için, arka plan ile simgeler veya metin arasındaki kontrast oranı en az 4,5:1 olmalıdır. Kontrast oranlarının belirli otomotiv kullanıcı arayüzü öğelerine nasıl uygulandığına ilişkin ayrıntılar için, İçeriği okunması kolay hale getirme bölümüne bakın.

Kontrast yapın — Okunabilir ve etkileşime açık tüm içeriklerde kontrast oranının en az 4,5:1 olduğundan emin olun.

Kontrastlar — Kontrast oranının 4,5:1'in altına düşmesine izin vermeyin, bu sürücü güvenliğini azaltır.

Rehberlik ve örnekler

Android Automotive OS'nin karanlık arayüzü, minimum renk kullanımıyla temiz ve basittir. Arayüz öğeleri için uygun renkler, tonlar ve opaklık değerleri kullanmanın yanı sıra (bkz. Paletler ve gradyanlar ), her renk ve renk gradyanı kullanımının bir amacı olduğundan emin olmak önemlidir.

Bu bölüm, çeşitli amaçlara ulaşmak için şeffaflık, opaklık ve rengin nasıl uygulanacağına dair rehberlik ve örnekler sunmaktadır. Bu amaçlar şunlardır:

Arka planları gizlemek
Tutarlılığı korumak
Kullanıcının dikkatini öncelikli eylemlere çeken görsel bir hiyerarşi oluşturmak.
Listedeki varlıkları ayırt etme

Arka planları tül perdelerle gizlemek

Tam ekran perdeler (katmanlar), kullanıcıların bir işlem yapmasını gerektiren diyalog kutuları gibi dikkat dağıtıcı unsurların arkasındaki arka planları örtmek için kullanılır. Kısmi perdeler ise bildirimler gibi unsurların geçişine dikkat çekmek için kullanılır.

Gündüz modunda tam ekran (diyalog kartının arkasında)

Gece modunda tam ekran (diyalog kartının arkasında)

Gündüz modunda kısmi perdeleme — Gündüz modunda kısmi ekran (bildirimin arkasında)

Gece modunda kısmi perdeleme — Gece modunda kısmi perde (bildirimin arkasında)

Renk tutarlılığını korumak

Renk, hafızayı ve tanımayı güçlendirmek için güçlü bir ipucudur. Ekranlar arasında tutarlı bir deneyim yaratmak için rengi kullanın.

Görsel renk tanıma — Görsel sürekliliği sağlamak için, bir öğe için birden fazla görünümde aynı rengi kullanın; örneğin, burada adım adım yol tarifi görünümlerinde kullanılan yeşil renk gibi.

Görsel renk sürekliliği — Burada gösterilen kırmızı renkli çağrı düğmeleri gibi, ilgili öğeleri ve işlevleri görsel olarak birbirine bağlamak için renk kullanın.

Kalıcı uygulama vurgu rengi — Albüm kapağının baskın rengini veya bir uygulamanın atanmış rengini, ilgili öğelerde kalıcı bir görsel unsur olarak kullanın. Burada, duraklatma düğmesinin etrafındaki daire Spotify yeşiliyle vurgulanmıştır.

Renk kullanım kısıtlaması — Tek bir ekranda tekrarlanan bileşenleri keyfi olarak farklı renklerle ayırt etmeyin. Değer katmayan renkleri kullanmaktan kaçının; özet kartlarının etrafındaki renkli çerçeveler, uygulama simgesinin rengini kopyaladığı için bu durum bir örnektir.

Görsel bir hiyerarşi oluşturmak

Tutarlı ve güçlü bir görsel hiyerarşi oluşturmak için beyaz opaklık değerlerini kullanın. 88, 72 ve 56 opaklık değerleri, koyu bir arka planda rahat bir okuma ortamı yaratırken erişilebilirlik gereksinimlerini karşılayacak kadar kontrast içerir. Gece modu için tüm beyazlarda %96 opaklık kullanın.

Görsel hiyerarşiyi korumak için saydamlık ve kontrast kullanımına örnek — Görsel hiyerarşiyi korumak için farklı saydamlık ve kontrast değerleri kullanın.

Opaklık ve kontrast kısıtlaması — Çok fazla öğeye tam opaklık veya kontrast değerleri uygulayarak aşırıya kaçmayın. Birincil ve ikincil bilgileri ayırt etmek için opaklık değerlerinde kontrast gereklidir.

Renk Koleksiyonlar ile düzeninizi koruyun İçeriği tercihlerinize göre kaydedin ve kategorilere ayırın.