Huly
الأضواء الشمالية في مرصد منتصف الليل - البطل هو شعاع عمودي من اللون الأرجواني يتلاشى إلى اللون المرجاني، وكل قسم هادئ أسفله يستعير نفس القصة ثنائية اللون التي تُروى بنبرة أكثر هدوءًا
يستحضر تصميم Huly أجواء مساحة عمل كونية: لوحة سوداء تقريبًا مع توهج بنفسجي كهرماني يخترق العنصر الرئيسي، وأسفلها شبكة أكثر هدوءًا لزيادة الإنتاجية. يعمل النظام ضمن نطاق لوني محدود - لون أزرق ساطع ولون مرجاني يُستخدمان في جميع عناصر العلامة التجارية على أسطح جرافيتية متعددة الطبقات، لذا لا يبدو الوضع الداكن محايدًا أبدًا. تعتمد الطباعة على نمط Inter لجميع العناصر الوظيفية، مع خط مخصص (Esbuild) مخصص للنقاط الرئيسية، بمسافة بين الأحرف تتراوح بين 80 و84 بكسل وتباعد سلبي حاد. تأتي المكونات على شكل كبسولة: نصف قطر 9999 بكسل على عناصر التحكم، و12 بكسل على البطاقات، مع ظل خفيف وخطوط متدرجة متوهجة كزخرفة رئيسية. تتناوب الصفحة بين مناطق داكنة تغطي كامل الصفحة وأقسام فاتحة هادئة، لذا يجب على أي شاشة جديدة تحديد الوضع قبل اختيار الألوان.
تتميز الصفحة الرئيسية بعرضها الكامل، حيث تعرض شعاعًا رأسيًا للأضواء الشمالية وعنوانًا محاذيًا لليسار، بالإضافة إلى لقطة شاشة للمنتج في أسفل اليمين. أسفل الصفحة الرئيسية، توجد منطقة محتوى بعرض أقصى يبلغ 1200 بكسل، تتناوب فيها الخطوط الداكنة والفاتحة. كل قسم عبارة عن كتلة رأسية واحدة: عنوان بالإضافة إلى شبكة من 3 أو 4 أعمدة من البطاقات تفصل بينها مسافات 96 بكسل. يكسر قسم "MetaBrain" الشبكة بعنوان مركزي ومجموعة متنوعة من البطاقات بأحجام مختلفة (بطاقة رئيسية كبيرة بالإضافة إلى بطاقات داعمة أصغر). الصفحة غنية بالمحتوى، وفقًا لمعايير SaaS، ولكنها تستخدم خطوطًا داكنة وفاتحة متناوبة لإتاحة مساحة كافية لكل قسم. شريط التنقل عبارة عن شريط علوي شفاف يتلاشى تدريجيًا ليصبح معتمًا عند التمرير.
العنصر الرئيسي هو تدرج لوني نقيّ مستوحى من الشفق القطبي، خالٍ من الصور الفوتوغرافية. جميع الرسوم التوضيحية عبارة عن لقطات شاشة حقيقية لواجهة المستخدم الخاصة بالمنتج (لوحة كانبان في الوضع الداكن، صندوق الوارد، التقويم)، مُؤطّرة بإطارات بطاقات تُستخدم كدليل وزخرفة في آنٍ واحد. لا توجد صور نمط حياة، ولا صور جاهزة، ولا رسومات ثلاثية الأبعاد. العنصر المرئي الوحيد غير المرتبط بواجهة المستخدم هو توهج شمسي دافئ شعاعي في قاعدة الشفق القطبي، مُصمّم كتدرج لوني باستخدام CSS. الأيقونات عبارة عن أيقونات خطية أحادية اللون باللون #95979 أو الأبيض، وليست متعددة الألوان. يُعامل النظام واجهة المستخدم الداكنة الخاصة به كعنصر رئيسي، بينما تُمثّل الصور الفوتوغرافية المنتج نفسه.
لوحة الألوان
ماركة
- Electric Iris
#5683da— تخلق الخلفية الرئيسية ومؤشر التنقل النشط ولمسة الأضواء الشمالية اللافتة للنظر - لون أزرق بنفسجي نابض بالحياة على خلفية سوداء داكنة - انطباعًا بالانخراط بدلاً من النشاط المؤسسي. - Ember Pulse
#ff8964— لمسة ثانوية، منطقة أضواء شمالية دافئة، نقطة إشعار، ورسم توضيحي بارز - لون كهرماني يكسر رصانة اللون الأزرق ويضيف دفئًا إلى الشعاع.
حيادي
- Obsidian Canvas
#303236— خلفية الصفحة، وهي السطح المهيمن، لونها أسود تقريبًا مع لمحة خفيفة من الدفء، وهي البيئة القياسية لجميع المحتويات. - Void
#090a0c— الطبقة السطحية الأعمق للتدرجات اللونية على الشاشة الرئيسية، وخلفيات النوافذ المنبثقة، والإطارات التي يجب أن تمتزج مع اللوحة القماشية. - Charcoal Card
#111111— أسطح مرتفعة مصنوعة من الورق المقوى والألواح، موضوعة على ارتفاع درجة واحدة فوق القماش. - Slate Edge
#4a4b50— حدود وفواصل دقيقة على الأسطح الداكنة - Iron Veil
#6b6c6d— خلفية باهتة للعلامات، وتعبئة عناصر القائمة، والتعبئة المعطلة. - Smoke
#95979e— تُعدّ الخطوط الخارجية للأيقونات والنصوص الإضافية وعناصر التحكم غير النشطة هي عناصر العمل الأساسية باللون الرمادي المتوسط.
الطباعة
من 11 إلى 80 بكسل · 8 خطوات
- Inter — الاستبدال: DM Sans · الخطوط العريضة 300, 400, 500, 600, 700 · يتم استخدام جميع النصوص الوظيفية في واجهة المستخدم - نص الجسم، والتنقل، والأزرار، وعناصر القائمة، والملصقات، والعناوين الصغيرة - بوزن خط يتراوح بين 500 و600 للتأكيد، و400 لنص الجسم، و300 بشكل مقتصد للبيانات الوصفية غير المزعجة.
- Esbuild — الاستبدال: Sora · الخطوط العريضة 400, 500, 600 · للعرض فقط: عناوين الصفحات الرئيسية، وعناوين الأقسام، وعناوين مقالات MetaBrain. يُوحي التصميم الهندسي المُكثّف والتباعد الضيق بين الأحرف بأنّ حجم 84 بكسل أنسب للأعمال التحريرية من مشاريع البرمجيات كخدمة (SaaS). لا تستخدم أبدًا حجمًا أقل من 28 بكسل.
الفترات والشكل
| غاية | معنى |
|---|---|
| كثافة | واسع |
| الخطوة الأساسية | 12px |
| نصف قطر الزر | 9999px |
| نصف قطر البطاقة | 12px |
| الظلال | ظلال ناعمة |
| بين الأقسام | 96px |
| عرض الصفحة | 1200px |
سيقوم الذكاء الاصطناعي ببناء موقعك الإلكتروني بأسلوب Huly وتعبئته.
- املأ حسابك بالمنتجات والمنشورات عبر الرابط - Instagram ، TikTok ، Facebook.
- انقل المحتوى من موقعك القديم - ما عليك سوى تحديد العنوان.
- تصميم عصري على أفضل محرك: React ( Next.js) مع عرض الخادم وتحسين محركات البحث بشكل جاهز للاستخدام.
- تحسين محركات البحث المؤتمت بالكامل لنتائج البحث وتوصيات الشبكة العصبية.
أنماط مشابهة
- monday — ورشة عمل بيضاء مع ملصقات بألوان الباستيل
- Slack — المسرح بلون الباذنجان مع أضواء كاشفة بيضاء. يهيمن لون البرقوق الداكن على المناطق المظلمة، بينما تسمح الخلفية البيضاء المائلة للصفرة للعناوين الكبيرة والطليعية بالظهور بحرية.
- Base44 — دفتر ملاحظات مضاء بأشعة الشمس مع قلم تحديد أخضر ليموني
- Supahub — ضوء النهار الناعم على قمة أرجوانية. لوحة بيضاء في الغالب، متجددة الهواء، مضاءة بشمس أرجوانية ساطعة واحدة، مع كرات متدرجة زخرفية تنشر اللون في المساحة السلبية وهندسة مستديرة سخية تضفي على كل سطح ثقلًا لطيفًا وملموسًا.
- Raycast — مركز قيادة منتصف الليل، كورال نيون
- Dimension — محطة عمل مضاءة عند الغسق بألواح زجاجية مصنفرة
- Wiza — مرصد للتنقيب عن المعادن عند الغسق، يكتنفه ضباب بنفسجي.
- Paste — فانوس كهرماني على رخام أبيض - شعار العلامة التجارية ذو التدرج الدافئ يطفو في المساحة البيضاء الشاسعة، مثل النافذة المضاءة الوحيدة في مبنى مغطى بالثلوج.
- Reworkd — إن ضوء النهار الخافت في مخطط المنتج هو اللون الوحيد الذي يتحدث عن نفسه، إنه زر الإجراء والعنوان المتدرج اللوني أعلاه.
- Reflect Notes — الفضاء البنفسجي المرصع بالنجوم هو مرصد مظلم حيث تطفو النوتات الموسيقية مثل الأبراج على خلفية من فراغ نيلي أسود تقريبًا.
- Ameba — غرفة التحكم في منتصف الليل – نبضة زرقاء كهربائية داخل ألواح زجاجية مصنفرة
- Todoist — مساحة عمل مضاءة بأشعة الشمس مع مفكرة ورقية - مكتب بلون كريمي دافئ، ملاحظات مكتوبة بالحبر، قلم أحمر واحد