من الصعب إنشاء لوحة ألوان جيدة

في اليوم الآخر قضيت ساعة كاملة أحاول إنشاء لوحة ألوان تبدو جيدة.
تتمثل نقطة الألم الأولى في أن تحديد الضوابط الأولية إلى الرباعية بالضبط أمر غامض بعض الشيء.

أتفهم أنه لا يمكنك شرح الكثير في النص، ولكن في الممارسة العملية، الطريقة الوحيدة الحقيقية لمعرفة كيف ستتغير الألوان هي إجراء تحديث كامل في كل مرة. هذا جعل الأمر مستهلكًا للوقت أيضًا.
نقطة الألم الثانية هي أن الألوان الفردية “الأساسية” و “الثانوية” تحسب سراً سلسلة كاملة من الألوان الأخرى التي تستخدم مثل --primary-low و --primary high، إلخ. لقد لاحظت أن استخدام لون مثل #2b2b2b يعطي نتيجة مختلفة جدًا عن لون داكن مشابه مع القليل من الأزرق، لأن اللوحة التي تم إنشاؤها تنتهي بكونها مختلفة جدًا. يبدو الأمر وكأنه ضربة في الظلام في كل مرة أحاول فيها لونًا جديدًا لأن الألوان الناتجة تنتهي بكونها غير متوقعة. أقدر بساطة وجود ثلاث متغيرات أساسًا تتحكم في اللوحة بأكملها، ولكن النتيجة تبدو عشوائية للغاية.
أخيرًا، لدي الكثير من المشاكل مع التباين. أجد أنه مع الألوان التي كنت أختارها، كان هناك مقايضة بين تباين النص مع الخلفية، وتباين القاعدة الأفقية مع الخلفية، وتباين أزرار الرد/التعديل مع الخلفية. على سبيل المثال، زيادة تباين النص جعلت القاعدة صعبة الرؤية والعكس صحيح.

لا أطلب حقًا القيام بأي شيء هنا. أعتقد أن الحل سيكون زيادة حجم اللوحة لتمكين المزيد من المرونة. لكنني أتفهم فوائد الحفاظ على البساطة. سيكون نوع من المعاينة في الوقت الفعلي مفيدًا، ولكني أتفهم أيضًا أن هذا سيكون طلبًا ذا أولوية منخفضة.
أردت فقط توثيق تجربتي. في النهاية تمكنت من إنشاء لوحة ألوان ولكنني لم أكن راضيًا تمامًا عنها. هل واجه الآخرون تحديات مماثلة، أم ربما تكمن المشكلة لدي؟ النصائح موضع تقدير.

إعجابَين (2)

نعم، كان الهدف الأصلي هو جعل خيارات لوحة تحكم المسؤول طريقة مبسطة لتعيين الألوان، وبشكل أساسي “وضع سهل”. أتفق على أنه محدود وأن التباين ليس جيدًا لبعض مجموعات الألوان.

الخبر السار هو أن السمات عن بُعد يمكنها تجاوز جميع الألوان التي تم إنشاؤها تلقائيًا، انظر Override values for auto-generated color variables

لقد كنا أيضًا نلقي نظرة فاحصة على كيفية عمل ألواننا مؤخرًا، على أمل تسهيل العمل مع مخططات الألوان وأنماط الإضاءة/الظلام لكل من المسؤولين والمستخدمين، لذا نأمل أن نتمكن من إجراء بعض التحسينات المفيدة.

7 إعجابات

لا أريد أن أُقلل من شأن نقطتك التقنية، ولكن ربما تجد هذا مفيدًا؟

إعجابَين (2)

لم أكن أعرف أن هذا ممكن، قد يكون هذا هو الحل الذي سأضطر إلى الاستقرار عليه :slight_smile:

إعجاب واحد (1)

هل سيساعد إنشاء لوحة ألوان بدءًا من لوحة ألوان عالية التباين (WCAG) توفر المزيد من حقول الألوان؟

لا أعرف ما إذا كانت لوحات WCAG لديها حسابات ألوان مختلفة يتم إنشاؤها تلقائيًا قد تكون غير مرغوب فيها.

إعجاب واحد (1)

نعم، تأتي مع بعض CSS الإضافية (discourse/app/assets/stylesheets/wcag.scss at main · discourse/discourse · GitHub)، لذلك قد تكون هناك بعض الإضافات غير المرغوب فيها.

إعجاب واحد (1)