أنظمة تصميم الإعلام والترفيه
أنظمة تصميم مستخرجة من مواقع الأخبار والمجلات والنشر والبث والترفيه. الخطوط هي القائد: خطوط العناوين الرئيسية، وأسطر أسماء الكتّاب، وشبكات القصص، مع استخدام مقتصد للألوان في الأقسام ودعوات اتخاذ الإجراء.
مثالان على DESIGN.md في هذه الفئة، من The Onion و WIRED. مستخرجة من الصفحات العامة لكل موقع، وليست إرشادات رسمية للعلامة التجارية. جديد على هذا التنسيق؟ اقرأ ما هو ملف DESIGN.md.
The Onion
لنظام تصميم The Onion طابع صحيفة ساخرة رقمية: عناوين بخط غروتسك ضيّق عريض باللون الأسود، ولون تمييز أخضر غابي مميّز (#006b3a) يُستخدم في عناوين الأقسام وشارات الأكثر تداولًا وأزرار الدعوة إلى الإجراء، وذلك كله على خلفية بيضاء ناصعة أو رمادية فاتحة. الطباعة هي الأداة التصميمية الأساسية، إذ تهيمن على العناوين خطوط Adobe Fonts الغروتسك المضغوطة وشبه المضغوطة مثل tablet-gothic وrocky-condensed، بينما يتولى utopia-std-caption النص الأساسي. والتخطيط كثيف المعلومات، تتوزع فيه بطاقات متقاربة الشبكة، وتفصل بين المقالات حدود سفلية، وتكاد زوايا العناصر البنيوية تخلو من الانحناء. أما العمق فمحدود جدًا، ولا تُستخدم إلا بعض الظلال الخفيفة على الطبقات المتراكبة فقط.
WIRED
WIRED-ის დიზაინ სისტემა არის მაღალი კონტრასტის, რედაქციულად მართული მონოქრომული ჩარჩო... Wait, I must answer in Arabic, not Georgian. Correcting: نظام تصميم WIRED إطار أحادي اللون عالي التباين يقوده المحتوى التحريري، ومبني على نظام خطوط خاص (Breve Text وWIRED Mono وWiredDisplay وApercu) ولوحة ألوان شبه خالية من الألوان. يهيمن اللون الأسود (#000000) بعدد 2961 ظهورًا، فيثبّت النصوص والحدود والأيقونات وحالات التفاعل. ويوفر اللون الأبيض (#ffffff) السطح الأساسي. يُستخدم لون التمييز بحذر شديد، فلا يظهر سوى الأزرق العلامة التجارية #057dbc في أزرار الاشتراك. يعتمد التخطيط على شبكة قصص متعددة الأعمدة منظمة، مع مسافات أساسية محكمة بقيمة 8px، وأسطح مسطحة بلا ظلال، وحواف دائرية محدودة بقيمة 4px كمعيار عام. ويُعد الخط الفارق الأساسي: يُستخدم Breve Text بحجم 19px للنص التحريري، ويُستخدم WIRED Mono بأحرف كبيرة وتباعد محسوب لعناوين الأقسام، ويُستخدم WiredDisplay للعناوين الرئيسية الكبيرة. والأسلوب العام سلطوي كثيف المعلومات، ويُعطي الأولوية لتدفق القراءة.
لا تجد الموقع الذي تحتاج إليه؟
الصق أي رابط لتحصل على ملف DESIGN.md من أي موقع ويب. الألوان والخطوط والمسافات والرموز، جاهزة لسير عملك مع الذكاء الاصطناعي.