Nebula Nexus

موقع عرض إبداعي باسم Nebula Nexus يقدّم استوديو/وكالة تصمّم تجارب غامرة.

يحتوي على بطل صفحة مع عنوان ورسالة وقسم بطاقات توضيحية، أقسام: About، Visions (شبكة بطاقات مشاريع)، وStories (شهادات عملاء بسلايدر)، ثم تذييل غني بالمعلومات وروابط اجتماعية.

خلفية تفاعلية متحركة على كامل البطل عبر كانفس تحاكي تأثير الشفق القطبي.

التقنيات المستخدمة

HTML5: بنية دلالية للأقسام، ترويسة/ملاحة/أقسام/تذييل، كانفس للشكل الخلفي.

CSS3:

متغيرات جذرية للألوان والزينة.

تأثيرات زجاجية وblur وsoft glow.

Grid وFlexbox لتخطيط الاستجابة.

تدرجات وخلفيات شعاعية، حالات hover، نقاط توقف 900px و600px.

أزرار بأنماط متعددة: primary, secondary, ghost.

JavaScript (Vanilla):

رسم خلفية متحركة على canvas عبر createRadialGradient وتحديث مستمر بـ requestAnimationFrame.

سلايدر شهادات: تحريك أفقي بعرض المسار، أزرار prev/next، إعادة حساب عند تغيير الحجم.

تبديل قائمة الملاحة على الجوال.

أصول ويب:

تحميل خط Google Fonts: Space Grotesk.

تحسين اتصال مسبق preconnect لـ fonts.googleapis.com وfonts.gstatic.com.

نقاط تميّز وتجربة المستخدم

هوية لونية مستقبلية مع تباين جيّد ونصوص مقروءة.

حركات خفيفة ومتجاوبة تعزز الشعور بالعمق دون إرباك.

تخطيط مرن يستجيب للأجهزة الصغيرة بإخفاء الروابط واستخدام زر قائمة.