تيليجرام، WhatsApp+380637610482
فاليري دانيوك
فاليري دانيوكالمطورتطوير أدوات الذكاء الاصطناعي للشركات. جودة عالية. بأسعار معقولة.راسلنا على Telegram
Modal — معاينة لموقع بهذا النمط

Modal

طرفية فسفورية في غرفة خوادم مظلمة - مصدر الضوء الوحيد هو اللون الأخضر الفاتح

تعمل واجهة المستخدم المنبثقة كطرفية مضيئة في غرفة خوادم مظلمة: خلفية سوداء تقريبًا، وكتابة باللون الأخضر الباهت، ولمسة نهائية واحدة زاهية باللون الأخضر الليموني تعمل كمؤشر حالة LED. لغة التصميم موجهة للمطورين - نوافذ برمجية أحادية المسافة مع نقاط إشارة مرور، وأيقونات ثلاثية الأبعاد متساوية القياس باللون الأخضر المميز، ومساحة بيضاء واسعة، مما يسمح لعنصر واحد في كل قسم بالتوهج. تنقسم الطباعة بين خط مخصص (Goga) للعناوين وخط متغير (Inter) لجميع عناصر واجهة المستخدم، وكلاهما مضبوط على تباعد سلبي ضيق. الألوان موزعة بالتساوي: معظم الشاشات أحادية اللون، ويظهر اللون الأخضر الليموني الزاهي فقط على الإجراءات الرئيسية، والشعار، والرسوم التوضيحية ثلاثية الأبعاد، ولحظات التأكيد. المكونات مسطحة وبدون إطار، مع عمق يتم إنشاؤه من خلال حدود خضراء دقيقة وضبابية خلفية بدلاً من الظلال.

تستخدم النافذة المنبثقة تصميمًا داكنًا بعرض كامل يبلغ 1280 بكسل كحد أقصى لاستيعاب المحتوى. تتوسط النافذة الرئيسية الصفحة، وتتضمن العنوان (الجملة الأولى باللون الأخضر الليموني)، وعنوانًا فرعيًا، ودعوتين لاتخاذ إجراء، وعنصرًا ثلاثي الأبعاد واحدًا كعنصر بصري مرجعي، دون فصل التصميم عن الشريط الجانبي. تتبع أقسام المحتوى نمطًا موحدًا: وسم الحاجب (أحرف كبيرة، Moss 70) ← عنوان Goga ← نص أساسي باهت، ثم إما تصميم من عمودين مع وصف للميزة (نص + رمز/بطاقة مرئية) أو شبكة من ثلاثة أعمدة من البطاقات. المسافة بين الأقسام واسعة، 80 بكسل. تتناوب الصفحة بين خطوط خلفية داكنة فارغة (#000000) وخطوط خلفية أفتح قليلًا (#181818)، مع ظهور قسم فاتح (#def0dd) في منتصف الصفحة كفاصل بصري. تتكون قائمة التنقل من شريط علوي ثابت واحد بخلفية ضبابية، بدون شريط جانبي أو قائمة رئيسية. يتميز الجزء السفلي بتصميمه المدمج والداكن، مع أعمدة روابط خضراء باهتة. كثافة النص مريحة: حيث تُمنح كل فقرة مساحة كافية، ولا تستخدم شبكات البطاقات أكثر من ثلاثة أعمدة.

تنقسم لغة Modal البصرية إلى نمطين: عروض ثلاثية الأبعاد للمنتجات المتوهجة، ونماذج أولية لنوافذ التعليمات البرمجية الداكنة. النقطة المحورية هي مكعب ثلاثي الأبعاد واحد مُصمم باستخدام تدرج لوني تسويقي (من الأخضر الليموني إلى الزمردي)، موضوع داخل هالة متدرجة شعاعيًا تُغمر المساحة الفارغة بضوء أخضر - وهو النمط البصري المميز للعلامة التجارية. تحتوي بطاقات عبء العمل على أيقونات ثلاثية الأبعاد متساوية القياس (مكعب هيكلي، درج صلب، طبقات) مُصممة بنفس اللون الأخضر الليموني على خلفية داكنة. تُعرض نتائج التعليمات البرمجية والمعايير كبطاقات نوافذ طرفية مع نقاط إشارة مرور، وتمييز بناء الجملة أحادي المسافة في لوحة ألوان فسفورية، وحدود خضراء باهتة - وهي تُشبه لقطات شاشة لواجهة سطر أوامر حقيقية. تُعرض شعارات العملاء كملصقات رمادية مخضرة باهتة في صف واحد منخفض التباين، مما يُشير إلى الثقة دون منافسة بصرية. الكثافة الإجمالية منخفضة - تحتوي معظم الصفحات بشكل أساسي على نص، وتُعرض الصور كنقاط محورية فردية بدلاً من شبكات من الصور الفوتوغرافية. لا توجد صور فوتوغرافية؛ يتم عرض النظام البصري بأكمله بشكل هندسي وإشعاعي.

لوحة الألوان

ماركة

  • Lime Pulse #7fee64 — العناصر الرئيسية للهوية المؤسسية هي الشعار، والعبارة الرئيسية للدعوة إلى اتخاذ إجراء (CTA)، وتعبئة العلامات، والحالات النشطة، واللون الأساسي للرسم التوضيحي.

حيادي

  • Phosphor White #ddffdc — يشكل النص الرئيسي ولون العنوان ومخطط الأيقونة ونص الزر المعبأ السطح الرئيسي القابل للقراءة.
  • Void Black #000000 — لوحة الصفحة، طبقة الخلفية الأعمق
  • Ground Iron #181818 — تعبئة الزر الرئيسي، أسطح البطاقات في المناطق المظلمة، السطح الأساسي لواجهة المستخدم.
  • Carbon Veil #212525 — الأسطح المرتفعة، خلفية الملاحة، أفتح قليلاً من الأرض.
  • Circuit Border #485346 — إطار الحركة الشفاف/الغامض، وهو الخط الرفيع التفاعلي الرئيسي، عبارة عن ظل رمادي مخضر باهت.
  • Phosphor Blue-Black #1f2a33 — خطوط تحديد ثانوية رفيعة، تفصل بين الخطوط الداكنة.

الطباعة

من 12 إلى 64 بكسل · 8 خطوات

  • Goga — الاستبدال: Inter Tight or Space Grotesk · الخطوط العريضة 400, 500 · خط العناوين والعناوين الفرعية – يُستخدم لجميع عناوين H1 إلى H4 والبطاقات. Goga هو خط هندسي مخصص بدون serif بفتحات ضيقة ونهايات مربعة قليلاً. الوزن المتوسط (500) مخصص لتمييز عناوين مستوى البطاقة؛ بينما يُستخدم الوزن العادي (400) لعناوين الصفحات الرئيسية وعناوين الأقسام. للوصول إلى أشكال الأحرف البديلة التي تُحدد هوية Modal، يجب تفعيل مجموعة الأنماط 'ss01' الخاصة به. يتناقص تباعد الأحرف السالب تدريجيًا من -0.007em عند 48 بكسل إلى -0.017em عند 21 بكسل.
  • Inter Variable — الاستبدال: Inter · الخطوط العريضة 400, 500 · واجهة المستخدم ومحتوى النص - التنقل، الأزرار، محتوى النص، التسميات، التذييل. يُستخدم وزن متوسط (500) افتراضيًا للعناصر التفاعلية والتنقل؛ بينما يُستخدم وزن عادي (400) للفقرات. يتم تقليل تباعد الأحرف بشكل ملحوظ حتى في الأحجام الصغيرة (-0.026em عند 14 بكسل، -0.022em عند 16 بكسل)، مما يمنح الواجهة كثافة مكثفة. بالنسبة لعلامات الترقيم البديلة، يجب تضمين متغير الأحرف 'cv11'. تستخدم التسميات المكتوبة بأحرف كبيرة فقط عند 12 بكسل تباعدًا للأحرف +0.05em لموازنة كثافة محتوى النص.

الفترات والشكل

غايةمعنى
كثافةمتوسط
الخطوة الأساسية20px
نصف قطر الزر12px
نصف قطر البطاقة8px
الظلاللا - حدود بدلاً من الظلال
بين الأقسام80px
عرض الصفحة1280px

سيقوم الذكاء الاصطناعي ببناء موقعك الإلكتروني بأسلوب Modal وتعبئته.

  • املأ حسابك بالمنتجات والمنشورات عبر الرابط - Instagram ، TikTok ، Facebook.
  • انقل المحتوى من موقعك القديم - ما عليك سوى تحديد العنوان.
  • تصميم عصري على أفضل محرك: React ( Next.js) مع عرض الخادم وتحسين محركات البحث بشكل جاهز للاستخدام.
  • تحسين محركات البحث المؤتمت بالكامل لنتائج البحث وتوصيات الشبكة العصبية.

أنماط مشابهة

  • Slash — قبو منتصف الليل ذو دفاتر حسابات مذهبة
  • AgentQL — الشفق القطبي فوق مبنى الركاب ليلاً
  • GitHub — لوحة تحكم فضائية مزودة بنقاط تحكم مضيئة بيولوجيًا - مساحة عمل مظلمة ذات أجواء مميزة حيث يشير توهج أخضر واحد إلى الطريق إلى الأمام.
  • Doppler — إضاءة القبو الأرجوانية عند منتصف الليل. القماش الأسود تقريبًا يتوهج بإشارة لافندر واحدة وضوء تأكيد أخضر، كل سطح منحني بما يكفي للإمساك به.
  • Basedash — محطة بيانات ليلية بخط غير لامع. مرصد مظلم حيث تتوهج المقاييس باللونين الأرجواني والأخضر، وتطفو عناوين ذات حروف مزخرفة فوق الضوضاء، والأزرار البيضاء على شكل حبة دواء هي الأشياء المضيئة الوحيدة في غرفة ذات أسطح سوداء ناعمة.
  • Superwhisper — تتلاشى الأضواء الشمالية فوق زجاج منتصف الليل
  • Better Stack — وحدة تحكم Midnight SRE
  • Langbase — وحدة تحكم أضواء منتصف الليل الشمالية
  • Astro — مركز التحكم في مهمات الفضاء العميق مع توهج أرجواني واحد من سديم
  • Wayfinder — شاشة عرض سوداء عليها عنوان بالكاد يُسمع يظهر فوق رسم توضيحي حي. واجهة المستخدم عبارة عن شريط تمرير لضبط السطوع بدلاً من لوحة تحكم.
  • HashiCorp — غرفة التحكم في منتصف الليل ذات النيون الأرجواني عبارة عن سطح تقني مظلم حيث يعمل مكعب سداسي متوهج كمرجع لوني وحيد.
  • Umbrel — موقد نار مريح في غرفة الخادم الليلية - غرفة مظلمة حيث يسلط توهج خوخي واحد الضوء على ما هو مهم حقًا.