ترتكز استراتيجية الألوان الخاصة بنظام التشغيل Android Automotive على فكرة "المبنى من الأسود". يؤدي تركيب ألوان الواجهة على اللون الأسود إلى توفير تجربة مستخدم أكثر اتساقًا بدون تغيير كبير بين المظاهر نهارًا وليلاً.
كما يضمن البناء من الأسود محاذاة أفضل مع الأجهزة، حيث تستخدم المواد المظلمة غالبًا في داخل السيارة ولوحات المعلومات.
الحصول على إرشادات سريعة
- ابنِ بخيارات الألوان التي تتنوّعها من الأسود لتسهيل القيادة ليلاً ونهارًا
- الحفاظ على نسبة تباين 4.5:1 على الأقل بين الخلفية والرموز أو النص
- استخدام الألوان بشكل بسيط
- إظهار الارتفاع عبر وضع تدرّج الرمادي
- استخدام الشفافية والتعتيم لتوجيه التركيز البصري
لوحات الألوان والتدرجات اللونية
يستند المظهر الداكن لواجهة نظام التشغيل Android Automotive إلى لوحة تدرّج الرمادي. من الناحية المثالية، يجب أن تكون أي ألوان إضافية ذات كثافة منخفضة، كما في المتغيرات الداكنة للألوان في لوحات Material Design.
يتضمن هذا القسم معلومات حول لوحة الألوان ومعدل الشفافية، إلى جانب مخططات توفر قيم تدرج الرمادي لمستويات الارتفاع المرتبطة بكل مكون.
لوحة تدرّج الرمادي لنظام التشغيل Android Automotive
تُستخدم لوحة التدرج الرمادي لنظام التشغيل Android Automotive مع عناصر مثل النصوص والرموز، وهي مصمّمة لتلبية المتطلبات الفريدة لبيئة القيادة.
يجب أن تكون لوحة الألوان هذه متنوعة بما يكفي لتحقيق ما يلي:
- تغطية جميع حالات الاستخدام المختلفة لواجهة مستخدم المظهر الداكن
- توفير نطاق كافٍ لتحديد التسلسل الهرمي من خلال الاختلافات في الدرجات اللونية
![لوحة الألوان الرمادية](https://developers.google.cn/cars/design/automotive-os/design-system/images/grayscale.png?authuser=6&hl=ar)
إنّ الاختلافات في درجات الألوان تخلق خدعة العمق حتى على الخلفيات السوداء الحقيقية التي يصعب فيها إدراك الظلال. لتوفير اختلافات كافية في الدرجات اللونية، تحتوي لوحة التدرج الرمادي لنظام التشغيل Android Automotive على درجات رمادية متوسطة. يقترب اللون الرمادي في Material Design، بدءًا من Grey 900، من الألوان الساطعة بسرعة كبيرة، أما اللون الأفتح بخطوتين فهو الرمادي 700، وهو ساطع للغاية بالنسبة للسياق التلقائي.
![مخطط مسقط رأسي للمكوّن](https://developers.google.cn/cars/design/automotive-os/design-system/images/elevation-chart-black.png?authuser=6&hl=ar)
![مستويات ارتفاع التدرج الرمادي في الوضعَين النهاري والليلي](https://developers.google.cn/cars/design/automotive-os/design-system/images/elevation-grayscale.png?authuser=6&hl=ar)
لون التَشدِيد
بالإضافة إلى لوحة التدرج الرمادي اللون في واجهة نظام التشغيل Android Automotive، يمكن استخدام ألوان أخرى باعتدال لأغراض مثل التركيز على العناصر.
في الوقت الحالي، يحتوي نظام التشغيل Android Automotive على لون تمييز رسمي واحد، وهو ظل أزرق يُشار إليه في مكتبة الدعم باسم "لهجة السيارة". لزيادة التشبع والحيوية، يتم تغيير هذا اللون الأزرق قليلاً من اللون الأزرق القياسي من Google. يساعد هذا التغيير في جعل الألوان أكثر راحة على الأسطح الداكنة.
![مثال على لون تمييز السيارة الأزرق](https://developers.google.cn/cars/design/automotive-os/design-system/images/brand-palette.png?authuser=6&hl=ar)
الرسوم البيانية لقيمة التعتيم
تنقل الشفافية إحساسًا بالعمق وتعزز النموذج المكاني في Material Design. لاستخدام الشفافية بشكل فعال، اختر قيم تعتيم داكنة أو بيضاء بناءً على حالة الاستخدام.
قيم التعتيم الداكن
تتمثّل حالة الاستخدام الأكثر شيوعًا لقيم التعتيم الداكن في إنشاء إطارات شبكية.
![قيم تعتيم اللون الأسود للتراكبات](https://developers.google.cn/cars/design/automotive-os/design-system/images/opacity-black.png?authuser=6&hl=ar)
قيم تعتيم الأبيض
تُستخدم هذه القيم في الغالب مع النص. وهي فعالة بشكل خاص عندما تكون الخلفية ملونة. استخدام اللون الرمادي الخالص على خلفية داكنة بالألوان يبدو موحلًا للغاية.
![قيم تعتيم النص الأبيض](https://developers.google.cn/cars/design/automotive-os/design-system/images/opacity-white.png?authuser=6&hl=ar)
للحصول على أمثلة حول كيفية استخدام التعتيم في مربّعات الاختيار والتسلسلات الهرمية للنصوص، يُرجى الاطّلاع على الإرشادات والأمثلة.
التباين
لتلبية إرشادات الأمان الأساسية لنظام التشغيل Android Automotive، يجب أن تكون نسبة التباين بين الخلفية والرموز أو النص 4.5:1 على الأقل. لمعرفة تفاصيل حول كيفية تطبيق نِسب التباين على عناصر محدَّدة من واجهة المستخدم في السيارة، يُرجى الاطّلاع على تسهيل قراءة المحتوى.
![توفير التباين](https://developers.google.cn/cars/design/automotive-os/design-system/images/contrast_do.png?authuser=6&hl=ar)
الإجراءات المقترَحة
![التباين ليس](https://developers.google.cn/cars/design/automotive-os/design-system/images/contrast_dont.png?authuser=6&hl=ar)
الإجراءات التي يجب تجنّبها
الإرشادات والأمثلة
تتميز واجهة المستخدم الداكنة لنظام التشغيل Android Automotive بتصميم بسيط وبسيط مع استخدام أقل قدر من الألوان. بالإضافة إلى استخدام الألوان والدرجات اللونية وقيم التعتيم المناسبة لعناصر واجهة المستخدم (راجع اللوحات والتدرج)، من المهم التأكد من أن كل استخدام لتدرجات الألوان وتدرجات الألوان له غرض محدد.
يقدّم هذا القسم إرشادات وأمثلة لتطبيق الشفافية والتعتيم واللون لتحقيق مجموعة متنوعة من الأهداف. وتشمل هذه الأهداف ما يلي:
- خلفيات محجوبة
- الحفاظ على الاتساق
- إنشاء تسلسل هرمي مرئي يوجه تركيز المستخدم إلى الإجراءات الأساسية.
- تمييز الكيانات في القائمة
إخفاء الخلفيات باستخدام أدوات الحروق
يتم استخدام حواجز (تراكب) بملء الشاشة لتغطية الخلفيات الكامنة وراء العناصر المزعجة، مثل مربّعات الحوار التي تتطلب من المستخدمين اتخاذ إجراء. تُستخدم القطع الجزئية للفت الانتباه إلى انتقال العناصر مثل الإشعارات.
![التمويه الكامل في الوضع اليومي](https://developers.google.cn/cars/design/automotive-os/design-system/images/Dialog-Mock-1.png?authuser=6&hl=ar)
![التمويه الكامل في الوضع الليلي](https://developers.google.cn/cars/design/automotive-os/design-system/images/Dialog-Mock-2.png?authuser=6&hl=ar)
![حاجب جزئي في وضع اليوم](https://developers.google.cn/cars/design/automotive-os/design-system/images/HUN-day.png?authuser=6&hl=ar)
![حاجب جزئي في الوضع الليلي](https://developers.google.cn/cars/design/automotive-os/design-system/images/HUN-night.png?authuser=6&hl=ar)
الحفاظ على الاتساق مع اللون
اللون هو وسيلة قوية لتعزيز الذاكرة والقدرة على التعرّف على الصوت. استخدمه لإنشاء تجربة متماسكة من شاشة إلى أخرى.
![التعرُّف على الألوان المرئية](https://developers.google.cn/cars/design/automotive-os/design-system/images/color-recognition-DO.png?authuser=6&hl=ar)
الإجراءات المقترَحة
![استمرارية الألوان المرئية](https://developers.google.cn/cars/design/automotive-os/design-system/images/color-continuity-DO.png?authuser=6&hl=ar)
الإجراءات المقترَحة
![لون تمييز التطبيق الدائم](https://developers.google.cn/cars/design/automotive-os/design-system/images/color-persistent-DO.png?authuser=6&hl=ar)
الإجراءات المقترَحة
![تقييد استخدام الألوان](https://developers.google.cn/cars/design/automotive-os/design-system/images/color-usage-DONT.png?authuser=6&hl=ar)
الإجراءات التي يجب تجنّبها
تأسيس تسلسل هرمي مرئي
استخدم قيم تعتيم الأبيض لإنشاء تسلسل هرمي مرئي متناسق وقوي. تحتوي قيم التعتيم 88 و72 و56 على تباين كافٍ لتلبية متطلبات إمكانية الوصول مع إنشاء بيئة قراءة مريحة على خلفية داكنة. يمكنك استخدام معدل تعتيم 96% على جميع درجات اللون الأبيض في الوضع الليلي.
![مثال على التعتيم والتباين للحفاظ على التسلسل الهرمي المرئي](https://developers.google.cn/cars/design/automotive-os/design-system/images/hierarchy-DO.png?authuser=6&hl=ar)
الإجراءات المقترَحة
![تقييد التعتيم والتباين](https://developers.google.cn/cars/design/automotive-os/design-system/images/hierarchy-DONT.png?authuser=6&hl=ar)
الإجراءات التي يجب تجنّبها