“مجموعة مكوّنات واحدة، وأربعة أنماط، وخمسة أوضاع: كربون من آي بي إم وأتلاسيان وأول مواصفة مستقرة لرموز التصميم تبيّن كيف يصبح التلوين إعداداً لا مكتبة ثانية.
النمط يجب أن يكون إعداداً لا مكتبة ثانية
نظام تصميم يصدر مكتبة مكوّنات ثانية لأجل النمط الداكن قد فشل في التلوين قبل أن يبدأ.
وصلت أول مواصفة مستقرة لرموز التصميم في ٢٨ تشرين الأول ٢٠٢٥، والأنظمة الإنتاجية التي تفصل الرمز والدور والقيمة تفعل ذلك منذ سنوات دون أن تسميه معياراً.
ما هو الرمز، ولماذا تهم المواصفة
رمز التصميم قيمة مسمّاة في ملف يستطيع كل من أدوات التصميم وخطوط البناء قراءته. ومنذ ٢٨ تشرين الأول ٢٠٢٥ صار لهذا الملف معيار يقف خلفه: فقد نشر مجتمع رموز التصميم أول مواصفة مستقرة لرموز التصميم، الإصدار ٢٠٢٥٫١٠، مع إتمام وحدات التنسيق واللون والمحلّل.
والقابلية للنقل هي المقصد كله. فقائمة التطبيقات المذكورة مع المجموعة تضم ستايل ديكشنري وتوكِنز ستوديو وتيرازو وفيغما وبينبوت وسكيتش، أي أن القيمة تستطيع أن تنتقل من ملف تصميم إلى خط بناء دون أن يعيد أحد كتابتها. والاعتقاد الشائع بأن الرموز مجرد متغيرات أنماط مُعاد تسميتها لا يصمد أمام هذا الشرط؛ فوُجود مواصفة بوحدات دليل على أن المتغيرات المُعاد تسميتها يدوياً تتوقف عند أول تغيير في الأدوات.
أربعة أنظمة وطبقات كل واحد منها
| النظام | البنية المنشورة | الأنماط أو الأوضاع | ما يبرهنه |
|---|---|---|---|
| كربون من آي بي إم | طبقات الرمز والدور والقيمة | أربعة أنماط: الأبيض والرمادي ١٠ والرمادي ٩٠ والرمادي ١٠٠ | تبقى المكوّنات مستقلة عن النمط بينما تتغير القيم |
| نظام تصميم أتلاسيان | تسمية من الأساس والخاصية والمُعدِّل | فاتح، داكن، عالي التباين، كثافة مضغوطة، حركة مخفَّضة | الكثافة والحركة تنتميان إلى طبقة النمط |
| نظام تصميم لايتننغ من سيلزفورس | ترقيم كل رمز مع حالة إتاحة عامة | رموز تصدر فرادى، مثل رمز لون العلامة المتاح في النسخة ٢٫٦٫٠ | رمز واحد يستطيع أن يصل دون أن يكسر المجموعة |
| ماتيريال ٣ | توليد لوني ديناميكي | لوحات ألوان من خلفية الجهاز أو من محتوى المنتج | يمكن توليد النمط وقت التشغيل من مدخل خارجي |
ثلاث طرق لتنظيم طبقة النمط
أربعة أنماط ومجموعة مكوّنات واحدة
يفصل كربون من آي بي إم بين الرمز والدور والقيمة، ويصدر أربعة أنماط: الأبيض كافتراضي، ثم الرمادي ١٠ والرمادي ٩٠ والرمادي ١٠٠. والمكوّن لا يقرأ قيمة خاماً أبداً؛ بل يقرأ دوراً، والنمط يقدّم القيمة التي تقف خلف ذلك الدور.
والنتيجة العملية أن إضافة نمط خامس تكلّف ملفاً لا مراجعة مكوّنات. وتعني أيضاً أن مراجعة التصميم تستطيع أن تناقش قيم النمط في موضع واحد بدل مطاردة الألوان في المكتبة كلها.
خمسة أوضاع تشمل الكثافة والحركة
تمتد قائمة أنماط أتلاسيان إلى الفاتح والداكن وعالي التباين والكثافة المضغوطة والحركة المخفَّضة، مع عرف تسمية مبني على الأساس والخاصية والمُعدِّل. واقرأ هذه القائمة كتصريح عن الموضع الذي يتوقع النظام أن يحدث فيه التنويع.
واللافت أن الكثافة والحركة تجلسان في طبقة النمط: فشبكة بيانات تستطيع أن تكون مضغوطة لجمهور ومريحة لجمهور آخر دون مكوّن متفرّع، ومن يحتاج حركة أقل يحصل على وضع لا على تذكرة دعم.
لون مولَّد من مدخل لا يملكه النظام
يولّد اللون الديناميكي في ماتيريال ٣ لوحات ألوان من خلفية المستخدم أو من محتوى المنتج، وتُدعم مصادر لونية متعددة. وهذا موقف معاكس لنمط علامة ثابت: النظام يقبل مدخلاً لا يستطيع التحكم به، ويبقى عليه أن يعيد واجهة مقروءة.
ويناسب هذا منتجاً استهلاكياً على منصة تعرف تفضيلات المستخدم مسبقاً، وهو معمار خاطئ حيث يجب أن يبقى لون علامة مرخّص على حاله دون مساس.
النمط الداكن ليس عكس الألوان
الاعتقاد بأن النمط الداكن هو النمط الفاتح معكوساً هو أغلى اختصار في هذا العمل. فكربون يحدد أربعة أنماط متمايزة ويفصل الدور عن القيمة، وأتلاسيان تنشر قيماً منفصلة لكل نمط من أنماطها. ولا أحد من النظامين يعكس الألوان، لأن العكس يكسر الأدوار: فعلى المسافة والارتفاع والحالة أن تُقرَّر من جديد، لأن ظلاً يُقرأ فصلاً بين سطحين على الأبيض لا يُقرأ فصلاً على الأسود.
والاختصار الثاني هو التعامل مع التلوين كتكرار للمكوّنات: مكوّن للجوال، ومكوّن داكن، ونسخة للتسويق. لكن كربون وأتلاسيان تُبقيان المكوّنات مستقلة عن النمط وتستبدلان القيم بدلاً من ذلك، ولهذا يستطيع نظام بأربعة أنماط وخمسة أوضاع أن يبقى فيه زر واحد فقط. فعدد المكوّنات وعدد الأنماط رقمان مستقلان، والمكتبة التي تخلط بينهما تفقد قابليتها للصيانة في اللحظة التي تظهر فيها علامة ثانية.
الأعداد التي تصف طبقة نمط ناضجة
٤أنماط
أنماط كربون من آي بي إم: الأبيض والرمادي ١٠ والرمادي ٩٠ والرمادي ١٠٠
طبقات الرمز والدور والقيمة تُبقي المكوّنات مستقلة عن النمط. نظام كربون، حتى ٢٠٢٦.
٥أوضاع
أنماط أتلاسيان: الفاتح والداكن وعالي التباين والكثافة المضغوطة والحركة المخفَّضة
بتسمية من الأساس والخاصية والمُعدِّل. نظام تصميم أتلاسيان، حتى ٢٠٢٦.
٣وحدات
التنسيق واللون والمحلّل، مكتملة في أول مواصفة مستقرة لرموز التصميم
الإصدار ٢٠٢٥٫١٠، الصادر في ٢٨ تشرين الأول ٢٠٢٥ عن مجتمع رموز التصميم.
٢٤بكسلاً
الحد الأدنى لحجم الهدف الذي لا يجوز أن تتجاوزه كثافة مضغوطة
المعيار ٢٫٥٫٨ في معايير إمكانية الوصول لمواقع الويب ٢٫٢، منظمة الويب العالمية، ٢٠٢٣.
كيف تبني النمط الذي يحتاجه المشروع فعلاً
طبقة دلالية واحدة
منتج واحد وعلامة واحدة، ولا متطلب علامة بيضاء على خطة العمل حتى الآن.
ملفات قيم لكل علامة
عدة علامات أو مناطق أو وكلاء يتشاركون المكوّنات نفسها ولا يجوز أن يتشاركوا قيم اللون.
لون مولَّد وقت التشغيل
على الواجهة أن تتكيّف مع جهاز المستخدم أو مع محتوى لم يكتبه أحد في الفريق.
الطبقة الدلالية الواحدة تسمّي كل قيمة بالدور الذي تلعبه — سطح، نص هادئ، حدود قوية، حلقة تركيز — وتُبقي القيم الخام تحتها. وفصل كربون بين الرمز والدور والقيمة هو النسخة المنشورة من هذا النمط، وهو أرخص بنية للبداية لأنه لا يفترض شيئاً عن علامة ثانية. والخطر أن تُسمّى الأدوار وفق مظهرها: فدور اسمه «حدود رمادية» لا يستطيع أن يصبح حدوداً بلون العلامة في النمط التالي.
ملفات القيم لكل علامة تُبقي المكوّنات مستقلة عن النمط وتستبدل القيم: الزر نفسه يقرأ مختلفاً في علامتين دون كود شرطي ودون تفرّع. وعرف الأساس والخاصية والمُعدِّل عند أتلاسيان مبني لهذا التعدّد، وسيلزفورس ترقّم كل رمز على حدة فيستطيع تخصيص علامة أن يصل دون أن يزعزع البقية. وما تشتريه هنا هو مصدر حقيقة واحد، وما تدفعه هو الانضباط في ألا يعدّل أحد لوناً داخل المكوّن أبداً.
اللون وقت التشغيل يستمد اللوحات من مدخل لا يتحكم به الفريق، كما يفعل ماتيريال ٣ مع خلفيات الأجهزة ومحتوى المنتج، بدعم مصادر لونية متعددة. والفاتورة الهندسية حقيقية: على التباين أن يصمد لمدخلات لم يعاينها أحد. اختره حين تكون التخصيصية سمة من سمات المنتج، وتجنّبه حين يجب أن تبقى هوية مرخّصة متطابقة على كل سطح.
الكثافة قرار رمزي لا عادة
الكثافة هي الموضع الذي يتوقف فيه التلوين عن كونه حديثاً عن اللون. فأتلاسيان تنشر الكثافة المضغوطة كنمط لا كمجموعة تجاوزات، وتضع أحكام إمكانية الوصول الحد الذي لا يجوز تجاوزه: المعيار ٢٫٥٫٨ لحجم الهدف (الحد الأدنى) في معايير إمكانية الوصول لمواقع الويب ٢٫٢ يطلب هدفاً بمقاس ٢٤ في ٢٤ بكسل، وقد دخل التوصية في ٢٠٢٣.
والتعامل مع الكثافة كعائلة رموز هو ما يسمح لشبكة بيانات على الحاسوب ولتطبيق ميداني بأن يتشاركا المكوّنات. والبديل مكوّن مضغوط مخصّص لشاشة واحدة، وهو تكرار للمكوّنات يصل من الباب الخلفي. فنمط مضغوط بحد أدنى موثّق قرار يستطيع الفريق الدفاع عنه، أما حشوة ضيّقت باليد فتفضيل سيُلغى بهدوء في دورة التطوير التالية.
أربعة أسئلة تحسم مراجعة التلوين
لماذا يحتاج ملف الرموز إلى مواصفة
لأن الأدوات تتغير. يذكر مجتمع رموز التصميم تطبيقات تمتد من ستايل ديكشنري إلى توكِنز ستوديو وتيرازو وفيغما وبينبوت وسكيتش، ووحدات التنسيق واللون والمحلّل في المواصفة هي ما يُبقي الرمز مقروءاً حين يستبدل الفريق إحدى هذه الأدوات.
وبدون تنسيق مشترك يصبح كل تغيير في الأدوات مشروع ترحيل يقف في وسطه مصمم.
كيف نضيف علامة ثانية دون تفرّع المكوّنات
أبقِ المكوّنات مستقلة عن النمط، وأضف ملف قيم. فأنماط كربون الأربعة تتشارك مجموعة مكوّنات واحدة، وعرف تسمية أتلاسيان مصمَّم لتعدّد الأنماط لا لتكرار العناصر.
والاختبار بسيط: إذا تطلبت إضافة علامة تعديل مكوّن، فطبقة النمط ناقصة.
من أين يستمد النمط الداكن قيمه
من مجموعة قيم منفصلة اختيرت للسطح الداكن، لا من نسخة معكوسة. فكربون تنشر أربعة أنماط متمايزة بفصل الدور عن القيمة، وأتلاسيان تنشر قيماً خاصة بكل نمط. والعكس هو سبب انتهاء الواجهات الداكنة بحدود غير مقروءة وظلال متوهجة.
احسم قيم النمط الداكن في المراجعة نفسها مع القيم الفاتحة، وباختبار التباين نفسه.
من يملك الرموز بعد الإطلاق
مالك مسمّى يمتلك عملية إصدار. فنظام تصميم لايتننغ من سيلزفورس يرقّم الرموز فرادى ويحدد حالة كل واحد، وهذا لا يكون ممكناً إلا حين يكون أحدهم مسؤولاً عن الملف.
وملف الرموز بلا مالك يتراكم فيه الإضافات الفردية حتى يعود النمط زينة شكلية.
وحدة تحكم واحدة وعدة أوضاع تشغيل
وحدة التحكم طبقة أنماط منزوعة الزينة: مجموعة عناصر واحدة، وعدة أوضاع استخدام، وتسميات يجب أن تعني الشيء نفسه في كل ساعة من الوردية. والصورتان أدناه لغرفتَي تشغيل لا لواجهتين، وكلتاهما تفرضان المطلب نفسه الذي على مجموعة الرموز أن تجيب عنه على الشاشة.
ما تفعله بهذا يوم الاثنين
- رقّم الرموز فرادى لا المكتبة كلها.ينشر نظام تصميم لايتننغ من سيلزفورس حالة لكل رمز، فيستطيع إدخال مثل رمز لون العلامة المتاح في النسخة ٢٫٦٫٠ أن يصل وحده.
- سمِّ الأدوار قبل القيم.فصل كربون بين الرمز والدور والقيمة هو ما يسمح لأربعة أنماط بتشارك مجموعة مكوّنات واحدة، والدور المسمّى على لون لا يصمد أمام النمط الثاني.
- ضع الكثافة والحركة في طبقة النمط.تنشر أتلاسيان الكثافة المضغوطة والحركة المخفَّضة إلى جانب الفاتح والداكن، وتضع معايير إمكانية الوصول ٢٫٢ حد ٢٤ في ٢٤ بكسل للهدف.
- لا تبنِ نمطاً داكناً بعكس نمط فاتح.تنشر كربون أربعة أنماط متمايزة، وتنشر أتلاسيان قيماً منفصلة لكل نمط، لأن العكس يكسر الأدوار بدل أن يقرّرها من جديد.
- اقرأ المواصفة قبل شراء أدوات الرموز.أول مواصفة مستقرة لرموز التصميم، الإصدار ٢٠٢٥٫١٠، صدرت في ٢٨ تشرين الأول ٢٠٢٥ مع إتمام وحدات التنسيق واللون والمحلّل.
- أبقِ المكوّنات مستقلة عن النمط.زر واحد عبر أربعة أنماط وخمسة أوضاع، مع استبدال القيم في طبقة الرموز بدل تكرار المكوّنات.
المصادر
- مواصفة رموز التصميم، الإصدار ٢٠٢٥٫١٠ — مجتمع رموز التصميم، ٢٨ تشرين الأول ٢٠٢٥
- مجتمع رموز التصميم — منظمة الويب العالمية، حتى ٢٠٢٦
- نظرة على الأنماط — نظام كربون من آي بي إم، حتى ٢٠٢٦
- رموز التصميم — نظام تصميم أتلاسيان، حتى ٢٠٢٦
- رموز التصميم — نظام تصميم لايتننغ من سيلزفورس، حتى ٢٠٢٦
- اللون الديناميكي — ماتيريال ٣، حتى ٢٠٢٦
- الجديد في معايير إمكانية الوصول لمواقع الويب ٢٫٢ — منظمة الويب العالمية، ٢٠٢٣