اللون
تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
تعتمد استراتيجية ألوان نظام التشغيل Android Automotive OS على فكرة "البناء من اللون الأسود". إن اعتماد ألوان واجهة المستخدم على اللون الأسود يوفر تجربة مستخدم أكثر اتساقًا، دون أي تغيير جذري بين سمات النهار والليل.
كما أن استخدام اللون الأسود في البناء يضمن توافقاً أفضل مع الأجهزة، حيث أن المواد الداكنة غالباً ما تستخدم في التصميمات الداخلية للسيارات ولوحات القيادة.
إرشادات سريعة (باختصار شديد)
اختر ألوانك بدءًا من الأسود لدعم القيادة ليلاً ونهارًا.
حافظ على نسبة تباين لا تقل عن 4.5:1 بين الخلفية والأيقونات أو النصوص.
استخدم الألوان بشكل محدود، ولغرض محدد.
عرض الارتفاع باستخدام تدرج الرمادي
استخدم الشفافية والعتامة لتوجيه التركيز البصري
الألوان والتدرجات
يعتمد التصميم الداكن لواجهة نظام التشغيل أندرويد أوتوموتيف على تدرجات الرمادي. ومن الأفضل أن تكون أي ألوان إضافية أقل كثافة، كما هو الحال في الألوان الداكنة المستخدمة في لوحات ألوان تصميم ماتيريال.
يتضمن هذا القسم معلومات عن لوحة الألوان والشفافية، بالإضافة إلى مخططات توفر قيم تدرج الرمادي لمستويات الارتفاع المرتبطة بكل مكون.
تصميم المواد
استخدام الألوان ولوحات الألوان
نظام تشغيل السيارات أندرويد، لوحة ألوان رمادية
تُستخدم لوحة الألوان الرمادية لنظام التشغيل Android Automotive OS لعناصر مثل النصوص والأيقونات، وهي مصممة لتلبية المتطلبات الفريدة لبيئة القيادة.
يجب أن تكون هذه المجموعة اللونية متنوعة بما يكفي لـ:
تغطية جميع حالات الاستخدام المختلفة لواجهة المستخدم ذات الوضع الداكن
وفر نطاقًا كافيًا لتحديد التسلسل الهرمي من خلال الاختلافات النغمية
تُعد لوحة الألوان الرمادية هذه لوحة الألوان الرئيسية لنظام التشغيل Android Automotive OS، وهي تدعم الوضع الداكن للواجهة.
تُضفي التدرجات اللونية إحساسًا بالعمق حتى على الخلفيات السوداء تمامًا حيث تكون الظلال غير مرئية. ولتوفير تدرجات لونية كافية، تتضمن لوحة تدرجات الرمادي في نظام Android Automotive درجات رمادية متوسطة. أما درجات الرمادي في تصميم Material Design، بدءًا من الرمادي 900، فتقترب من الألوان الأكثر سطوعًا بسرعة كبيرة؛ فاللون الأفتح بدرجتين هو الرمادي 700، وهو ساطع جدًا بالنسبة لبيئة السيارات.
يوضح هذا الرسم البياني مستويات الارتفاع التي تستقر عندها المكونات المختلفة. ولكل مستوى ارتفاع قيمة رمادية مرتبطة به. يوضح هذا الرسم البياني قيم اللون الرمادي المرتبطة بمستويات الارتفاع المختلفة في الوضع النهاري والليلي
لون مميز
بالإضافة إلى لوحة الألوان الرمادية التي تشكل جوهر واجهة نظام التشغيل Android Automotive، يمكن استخدام ألوان أخرى باعتدال لأغراض مثل لفت الانتباه.
يحتوي نظام التشغيل Android Automotive حاليًا على لون مميز رسمي واحد، وهو درجة من درجات اللون الأزرق تُعرف في مكتبة الدعم باسم "لون السيارة المميز". ولزيادة تشبع اللون الأزرق وحيويته، تم تعديل درجة هذا اللون الأزرق قليلاً عن اللون الأزرق القياسي من جوجل. يساعد هذا التعديل الألوان على الظهور بشكل أفضل على الأسطح الداكنة.
يتميز اللون الأزرق "الخاص بلمسة السيارة" في نظام التشغيل Android Automotive OS بأنه أكثر تشبعًا من اللون الأزرق القياسي من Google، وهو مصمم ليعمل بشكل جيد في واجهة الوضع الداكن أثناء القيادة ليلاً ونهارًا.
مخططات قيمة الشفافية
تُضفي الشفافية إحساسًا بالعمق وتُعزز النموذج المكاني لتصميم ماتيريال. وللاستفادة من الشفافية بفعالية، اختر قيم التعتيم الداكنة أو البيضاء بناءً على حالة الاستخدام.
قيم التعتيم الداكن
تتمثل حالة الاستخدام الأكثر شيوعًا لقيم التعتيم الداكن في إنشاء طبقات شفافة (تراكبات).
قيم عتامة اللون الأبيض
تُستخدم هذه القيم في الغالب مع النصوص، وتكون فعّالة بشكل خاص عندما تكون الخلفية ملونة. استخدام اللون الرمادي الداكن على خلفية داكنة وملونة يُعطي مظهرًا باهتًا.
للاطلاع على أمثلة حول كيفية استخدام الشفافية في الشاشات الشفافة والتسلسلات الهرمية للنصوص، انظر الإرشادات والأمثلة .
مقابلة
للامتثال لإرشادات السلامة الأساسية لنظام التشغيل Android Automotive، يجب ألا تقل نسبة التباين بين الخلفية والأيقونات أو النصوص عن 4.5:1. لمزيد من التفاصيل حول كيفية تطبيق نسب التباين على عناصر واجهة المستخدم الخاصة بالسيارات، راجع قسم "جعل المحتوى سهل القراءة" .
يفعل
تأكد من أن نسبة التباين لا تقل عن 4.5:1 لجميع المحتويات المقروءة والقابلة للتنفيذ.
لا
لا تدع نسبة التباين تنخفض عن 4.5:1، فهذا يقلل من سلامة السائق.
إرشادات وأمثلة
تتميز واجهة المستخدم الداكنة لنظام Android Automotive OS بالبساطة والوضوح، مع استخدام محدود للألوان. بالإضافة إلى استخدام الألوان والدرجات وقيم الشفافية المناسبة لعناصر واجهة المستخدم (انظر لوحات الألوان والتدرجات اللونية )، من المهم التأكد من أن كل استخدام للألوان والتدرجات اللونية له غرض محدد.
يُقدّم هذا القسم إرشادات وأمثلة لتطبيق الشفافية والعتامة واللون لتحقيق مجموعة متنوعة من الأهداف. وتشمل هذه الأهداف ما يلي:
حجب الخلفيات
الحفاظ على الاتساق
إنشاء تسلسل هرمي بصري يجذب انتباه المستخدم إلى الإجراءات الأساسية.
تمييز الكيانات في قائمة
حجب الخلفيات بشاشات شفافة
تُستخدم الأغطية الشفافة (التراكبات) التي تغطي كامل الشاشة لتغطية الخلفيات خلف العناصر المشتتة، مثل مربعات الحوار التي تتطلب من المستخدمين اتخاذ إجراء. أما الأغطية الشفافة الجزئية فتُستخدم لجذب الانتباه إلى انتقال العناصر مثل الإشعارات.
شاشة كاملة (خلف بطاقة الحوار) في وضع النهار شاشة كاملة (خلف بطاقة الحوار) في الوضع الليلي
شاشة جزئية (خلف الإشعار) في وضع النهار شاشة جزئية (خلف الإشعار) في الوضع الليلي
الحفاظ على تناسق اللون
يُعدّ اللون وسيلة فعّالة لتعزيز الذاكرة والتمييز. استخدمه لخلق تجربة متناسقة من شاشة إلى أخرى.
يفعل
حافظ على التناسق البصري باستخدام نفس اللون لعنصر ما عبر طرق عرض متعددة، مثل اللون الأخضر المستخدم في طرق عرض التنقل خطوة بخطوة هنا.
يفعل
استخدم اللون لربط العناصر والوظائف ذات الصلة بصريًا، مثل أزرار الحث على اتخاذ إجراء الحمراء المعروضة هنا.
يفعل
استخدم اللون السائد لغلاف الألبوم أو اللون المخصص للتطبيق على العناصر ذات الصلة كعنصر بصري ثابت. هنا، تم تمييز الدائرة المحيطة بزر الإيقاف المؤقت باللون الأخضر الخاص بسبوتيفاي.
لا
لا تستخدم ألوانًا مختلفة لتمييز العناصر المتكررة داخل شاشة واحدة بشكل عشوائي. كن حذرًا عند استخدام الألوان عندما لا تضيف قيمة، كما هو الحال مع هذه الخطوط الملونة حول بطاقات الملخص، والتي تكرر لون أيقونة التطبيق.
إنشاء تسلسل هرمي بصري
استخدم قيم عتامة اللون الأبيض لإنشاء تسلسل هرمي بصري متناسق وقوي. توفر قيم العتامة 88 و72 و56 تباينًا كافيًا لتلبية متطلبات سهولة الوصول، مع توفير بيئة قراءة مريحة على خلفية داكنة. استخدم عتامة 96% على جميع الألوان البيضاء لوضع الليل.
يفعل
استخدم قيمًا مختلفة للشفافية والتباين للحفاظ على التسلسل الهرمي البصري.
لا
لا تفرط في استخدام قيم الشفافية أو التباين الكاملة بتطبيقها على عدد كبير من العناصر. فالتباين في قيم الشفافية ضروري لتمييز المعلومات الأساسية عن المعلومات الثانوية.
تاريخ التعديل الأخير: 2026-02-25 (حسب التوقيت العالمي المتفَّق عليه)
[[["يسهُل فهم المحتوى.","easyToUnderstand","thumb-up"],["ساعَدني المحتوى في حلّ مشكلتي.","solvedMyProblem","thumb-up"],["غير ذلك","otherUp","thumb-up"]],[["لا يحتوي على المعلومات التي أحتاج إليها.","missingTheInformationINeed","thumb-down"],["الخطوات معقدة للغاية / كثيرة جدًا.","tooComplicatedTooManySteps","thumb-down"],["المحتوى قديم.","outOfDate","thumb-down"],["ثمة مشكلة في الترجمة.","translationIssue","thumb-down"],["مشكلة في العيّنات / التعليمات البرمجية","samplesCodeIssue","thumb-down"],["غير ذلك","otherDown","thumb-down"]],["تاريخ التعديل الأخير: 2026-02-25 (حسب التوقيت العالمي المتفَّق عليه)"],[],[]]