صممت وبنيت موقع PacJourneys على Framer: واجهة خفيفة حديثة للسفر الفاخر، بشبكات واضحة وانتقالات هادئة وبنية مسارات مفهومة.

لاحقاً: الانتقال إلى شيفرة مستقلة

في المرحلة التالية أعدت بناء PAC Journeys كتطبيق مستقل بـ React وVite. تعمل الشركة الدبيّية في الرحلات الفاخرة: الكروز والجولات والفنادق والرحلات المختارة شخصياً. كان يجب الحفاظ على طابع الموقع الأول وتسهيل تطويره لاحقاً.

أعدت إنشاء الواجهة بالشيفرة ونقلت المواد البصرية إلى المشروع وقسمت الصفحات إلى مكونات قابلة لإعادة الاستخدام. صار للمحتوى هيكله الخاص، ولم يعد الموقع معتمداً على Framer.

شمل المشروع تاريخ الشركة وأسطول الكروز وصفحات السفن والجولات والفنادق والمطاعم واستفسارات العملاء. المحتوى معد للإنجليزية والروسية.

استخدمت لهذه المرحلة React وVite وReact Router وTailwind CSS وFramer Motion، مع اختبارات Vitest واستضافة Cloudflare Pages. ينظم React Router كتالوج الصفحات المتنامي، ويحافظ Framer Motion على انتقالات تلائم لغة المشروع البصرية.

هكذا تبدو نسخة PAC Journeys المحفوظة. إنها الواجهة العامة الأصلية بتكوينها وموادها الحقيقية. يتيح العرض فحص الصفحة، ولا يرسل استفسارات فعلية.

موقع PAC Journeys

واجهة مؤرشفة · بيانات توضيحية

موقع PAC Journeys
شاشة محفوظة من المشروع · دون تحكم تفاعلي

تُحمّل الشيفرة بحسب المسار. الصور معدة لأحجام شاشة مختلفة، والمواد داخل المشروع، وللصفحات بيانات SEO. عملت أيضاً على الإتاحة والبنية الثنائية اللغة وsitemap والبيانات المنظمة.

أراه امتداداً لعملي التصميمي الأول. حصل الموقع على أساس يمكن تطويره ونشره مستقلاً عن الأداة التي أُنشئت بها نسخته الأولى.

لهذا العمل مرحلتان: نسخة Framer التصميمية ثم تطبيق React المستقل. تاريخ المنشور يخص البدايات، أما الواجهة البرمجية المعروضة فجاءت لاحقاً. يحتاج تاريخ تسليم هذه المرحلة إلى تأكيد مستقل.

شاهد PAC Journeys.

شاشات المشروع وسجلاته

قصص ذات صلة: Pilates.me على Framer · البورتفوليو من Framer إلى Astro.