AQUAFINITY
Endless Purity — موقع شركة سينمائي.
تجربة شركة أحادية الصفحة بالعربية أولًا لشركة تقنيات مياه وطاقة تأسست في الرياض عام 2008 ومقرها الرئيسي في أوتاوا منذ 2021: كرة مياه بـ WebGL، وخط زمني للشركة مدفوع بالتمرير، وخط معالجة متحرك، وخريطة عالم منقّطة.
Aquafinity تصدير ثابت بـ Next.js 15 مصمم لـ Cloudflare Pages. كل النصوص — التاريخ، والخدمات، والفروع، وأرقام الهواتف — استُخرجت حرفيًا من موقع الشركة القائم بدلًا من اختلاقها. قسم البطل كرة مياه بـ three.js تُحمَّل بكسل مع بديل ثابت؛ ويحرّك GSAP ScrollTrigger الخط الزمني 2008 → 2021 → اليوم بالتمرير؛ ومسارات SVG مكتوبة يدويًا تحرّك رحلة SOURCE → TEST → TREAT → PURIFY → DELIVER؛ وشبكة نقاط يابسة متساوية المستطيلات مولَّدة مسبقًا ترسم كندا وليبيا ولبنان.
تعمل الحركة للجميع افتراضيًا لأن كثيرًا من أجهزة Windows تأتي وحركات نظام التشغيل فيها معطّلة؛ ومفتاح ?motion=reduce يعطّل Lenis وحلقة WebGL والحركات المدفوعة بالتمرير مع إبقاء كل المحتوى ظاهرًا. ونموذج التواصل يؤلف رسالة WhatsApp إلى خط طرابلس — لا يوجد خادم خلفي بحكم التصميم.
نظرة عامة
ماء، وتقنية نظيفة، وزجاج وضوء. الموقع كله تمرير واحد متصل: الكرة، ونقاط الثقة، والشريط المتحرك، والتاريخ، والخدمات، ورحلة المياه، والطاقة الشمسية، والحضور العالمي، والتواصل.
الأقسام
- 01التحميل المسبق → المؤشر → الترويسة → البطل (كرة WebGL) → إحصاءات الثقة → الشريط المتحرك
- 02نبذة → الخط الزمني (2008 الرياض · التوسع · 2021 أوتاوا · اليوم) → الخدمات (5)
- 03رحلة المياه → الطاقة الشمسية → لماذا Aquafinity → الحضور العالمي (خريطة منقّطة) → دعوة لاتخاذ إجراء → التواصل → التذييل
التصميم
محيط عميق، وسماوي ناعم.
خلفيات من #030E18 → #0A2438، ولون الأكوا المميز #1BAFD2، والسماوي #5FD9F5، والجليدي #DCF2FA؛ خط IBM Plex Sans Arabic للعربية وSpace Grotesk للمسات اللاتينية؛ وتخفيف حركة فاخر بقيمة cubic-bezier(0.16, 1, 0.3, 1) في كل الموقع. الشعار الرسمي لا يُعاد تصميمه أبدًا.
الهندسة
- 01output: 'export' مع صور غير محسّنة لـ Cloudflare Pages؛ وملفا sitemap وrobots مفروضان كثابتين
- 02كرة three.js تُحمَّل بكسل؛ وبديل ثابت عند عدم توفر WebGL
- 03world-atlas + d3-geo يُستخدمان مرة واحدة وقت البناء لتوليد lib/map-dots.json — ولا يُشحنان وقت التشغيل
- 04مخطط JSON-LD Organization مع تاريخ التأسيس والشعار وثلاثة عناوين بريدية
- 05ملف محتوى واحد، lib/content.ts، هو مصدر الحقيقة الوحيد لكل نص
