Slash
قبو منتصف الليل ذو دفاتر حسابات مذهبة
يعمل نظام Slash في وضع معرض ليلي: خلفية سوداء تقريبًا، ونص أبيض، ولمسة نحاسية دافئة واحدة تُستخدم كعلامة ترقيم. تُعرض العناوين بخط Ivy Presto، وهو خط ذو تباين عالٍ من نوع didone serif يُستخدم بأحجام كبيرة جدًا (تصل إلى 88 بكسل) - هذا التناقض بين الخطوط ذات الزوائد والخطوط البسيطة هو السمة المميزة للنظام، مما يمنحه طابعًا ماليًا رصينًا دون رصانة الوساطة المصرفية التقليدية. أما بقية واجهة المستخدم فهي بسيطة عمدًا: حدود رفيعة، وأزرار تحكم بيضاوية الشكل، ونص مضغوط بحجم 16 بكسل، وانحناء طفيف للأعلى ليمنح النص مساحة أكبر. يضيف تدرج ذهبي واحد (خط الرسم البياني، واللمسات الدقيقة) دفئًا إلى النظام أحادي اللون، مستحضرًا التوهج الدافئ لمحطة Bloomberg المصممة خصيصًا لجمهور التصميم.
يبلغ عرض المحتوى 1216 بكسل، وهو مُتمركز، مع هوامش رأسية بعرض 160 بكسل. الشاشة الرئيسية عبارة عن لوحة داكنة بعرض كامل بتصميم مُقسّم: عنوان رئيسي مُحاذٍ لليسار بخط serif (بعرض 64-88 بكسل) مع حقل عنوان البريد الإلكتروني أسفله، وبطاقة واجهة مستخدم كبيرة للمنتج (لقطة شاشة من لوحة التحكم) على اليمين بعرض 50%. تستخدم الأقسام اللاحقة عنوانًا رئيسيًا مُتمركزًا في عمود واحد (بخط serif، بعرض 44-64 بكسل) مع عنوان فرعي بخط Inter، يليه شبكات من ثلاثة أعمدة من البطاقات لوصف الميزات/شهادات العملاء/المدونات. شريط التنقل العلوي ثابت: الشعار على اليسار، والقائمة المركزية (الشركة، المنتجات، الحلول، العملاء، الأسعار، الأسئلة الشائعة)، وتسجيل الدخول مُحاذٍ لليمين (غير بارز)، وبدء الاستخدام (عنصر أبيض). يحتوي التذييل على شبكة كثيفة من خمسة أعمدة من الروابط مع معلومات الشركة والإشعارات القانونية. تتناوب الصفحة بين أقسام الشبكة الغنية بالمحتوى وإحصائيات ملء الشاشة - ويتم تحديد الإيقاع من خلال المساحة البيضاء الواسعة بين الأعمدة بدلاً من ألوان الخلفية المتناوبة (يتم عرض الصفحة بأكملها كلوحة واحدة موحدة).
تتميز الصور بأسلوب تحريري وطبيعي: صور دافئة للمؤسسين وأعضاء الفريق في بيئات عملهم الواقعية (مكاتب، غرف معيشة، مواقع بناء). تملأ الصور إطارات البطاقات من الحافة إلى الحافة، دون أي مساحة إضافية. يُستخدم تدرج لوني داكن في أسفل بطاقات الشهادات لتحسين وضوح النص. أما الجمالية - "مزيج بين لينكدإن والمجلات التحريرية" - فهي عفوية وإنسانية وهادئة بعض الشيء، دون استخدام صور جاهزة مصقولة. تجمع الصور المصغرة للمقالات بين الصور الفوتوغرافية والمفاهيم المصورة (شخص يقف في متاهة، مدفأة عليها أكياس من المال). تُعرض واجهة المستخدم الخاصة بالمنتج في الوضع الداكن بشفافية كاملة، وتطفو فوق الصفحة على أسطح داكنة خفيفة - عنصر أساسي. الأيقونات أحادية اللون بخطوط سمكها 1 بكسل باللونين #2e3038 أو #777a88، ولا تُملأ بلون العلامة التجارية.
لوحة الألوان
حيادي
- Bone
#e2e3e9— حجم خط كبير للنص الأساسي، وتسميات بيانات مفصلة، ونبرة نص قياسية عبر معظم عناصر واجهة المستخدم. - Obsidian
#08080a— لوحة الصفحة، وخلفية التذييل، والسطح الأكثر قتامة يكاد يكون أسود مع مسحة زرقاء خفيفة. - Onyx
#040406— سطح البطاقة، أي الخلفية الإضافية، أعمق بدرجة واحدة من الصفحة لتحقيق تأثير بصري. - Carbon
#121317— لوحات بارزة، وتعبئة واجهة مستخدم غير مزعجة - الخطوة الأولى الأخف وزنًا بشكل ملحوظ في تطور Surface Stack - Graphite
#1c1d22— الحدود، والفواصل، وحاويات الأيقونات، وأشرطة التحكم المنزلقة - أدق درجات اللون التي تحدد البنية. - Slate
#2e3038— حدود إضافية، وخطوط أيقونات باهتة، وفواصل دقيقة بين كتل المحتوى.
الطباعة
من 13 إلى 88 بكسل · 9 خطوات
- Ivy Presto — الاستبدال: Playfair Display · الخطوط العريضة 400, 500 · خط ذو نهايات مزخرفة للعناوين الرئيسية والفرعية، يُستخدم حصريًا للعناوين الرئيسية وعناوين الأقسام بحجم 28 بكسل وما فوق. تضفي الخطوط ذات التباين العالي والزخارف الرفيعة إحساسًا بالفخامة التحريرية؛ كما أن التباعد الموجب الصغير بين الأحرف (0.01em) غير معتاد، ويمنح الخط مظهرًا مطبوعًا يُشبه الخطوط المحاسبية. يُعد هذا الخط ذو النهايات المزخرفة بمثابة بطاقة تعريف أساسية للعلامة التجارية، فهو يميز Slash عن جميع شركات التكنولوجيا المالية الأخرى التي تعتمد على خطوط هندسية بدون نهايات مزخرفة.
- Inter — الاستبدال: Inter (self-hosted via Google Fonts) · الخطوط العريضة 300, 400, 500, 600, 700 · يُستخدم خط UI Sans في النص الرئيسي، وقوائم التنقل، والأزرار، والتسميات، والروابط، وحقول النماذج، والعناوين الفرعية. يستخدم النص الرئيسي حجم 300 للنصوص الثانوية غير البارزة؛ ويُستخدم حجم 500 للنصوص ذات التركيز المتوسط وتسميات الأزرار؛ أما حجم 600 فهو مخصص لتسميات الفئات المكتوبة بأحرف صغيرة. يقل تباعد الأحرف السالب من 2 (-3) ويتناقص مع تناقص الحجم، وهو ما يتوافق مع التكبير البصري لخط Inter.
الفترات والشكل
| غاية | معنى |
|---|---|
| كثافة | واسع |
| الخطوة الأساسية | 8px |
| نصف قطر الزر | 9999px |
| نصف قطر البطاقة | 10px |
| الظلال | لا - حدود بدلاً من الظلال |
| بين الأقسام | 160px |
| عرض الصفحة | 1216px |
سيقوم الذكاء الاصطناعي ببناء موقعك الإلكتروني بأسلوب Slash وتعبئته.
- املأ حسابك بالمنتجات والمنشورات عبر الرابط - Instagram ، TikTok ، Facebook.
- انقل المحتوى من موقعك القديم - ما عليك سوى تحديد العنوان.
- تصميم عصري على أفضل محرك: React ( Next.js) مع عرض الخادم وتحسين محركات البحث بشكل جاهز للاستخدام.
- تحسين محركات البحث المؤتمت بالكامل لنتائج البحث وتوصيات الشبكة العصبية.
أنماط مشابهة
- Modal — طرفية فسفورية في غرفة خوادم مظلمة - مصدر الضوء الوحيد هو اللون الأخضر الفاتح
- AgentQL — الشفق القطبي فوق مبنى الركاب ليلاً
- GitHub — لوحة تحكم فضائية مزودة بنقاط تحكم مضيئة بيولوجيًا - مساحة عمل مظلمة ذات أجواء مميزة حيث يشير توهج أخضر واحد إلى الطريق إلى الأمام.
- Doppler — إضاءة القبو الأرجوانية عند منتصف الليل. القماش الأسود تقريبًا يتوهج بإشارة لافندر واحدة وضوء تأكيد أخضر، كل سطح منحني بما يكفي للإمساك به.
- Basedash — محطة بيانات ليلية بخط غير لامع. مرصد مظلم حيث تتوهج المقاييس باللونين الأرجواني والأخضر، وتطفو عناوين ذات حروف مزخرفة فوق الضوضاء، والأزرار البيضاء على شكل حبة دواء هي الأشياء المضيئة الوحيدة في غرفة ذات أسطح سوداء ناعمة.
- Superwhisper — تتلاشى الأضواء الشمالية فوق زجاج منتصف الليل
- Better Stack — وحدة تحكم Midnight SRE
- Langbase — وحدة تحكم أضواء منتصف الليل الشمالية
- Astro — مركز التحكم في مهمات الفضاء العميق مع توهج أرجواني واحد من سديم
- Wayfinder — شاشة عرض سوداء عليها عنوان بالكاد يُسمع يظهر فوق رسم توضيحي حي. واجهة المستخدم عبارة عن شريط تمرير لضبط السطوع بدلاً من لوحة تحكم.
- HashiCorp — غرفة التحكم في منتصف الليل ذات النيون الأرجواني عبارة عن سطح تقني مظلم حيث يعمل مكعب سداسي متوهج كمرجع لوني وحيد.
- Umbrel — موقد نار مريح في غرفة الخادم الليلية - غرفة مظلمة حيث يسلط توهج خوخي واحد الضوء على ما هو مهم حقًا.