خريطة تفاعلية · امتلاك نظام المحتوى
باب الشام
منصة عامة ثنائية اللغة تعتمد نظام إدارة محتوى، وتضم محتوى مترجماً ومشاريع قابلة للبحث ومستكشفاً جغرافياً تفاعلياً.
زيارة المنتجالدور
المطور الوحيد للمنتج عبر واجهة Next.js ومخطط محتوى Directus الكامل.
النطاق
خريطة D3/GeoJSON متجاوبة واستكشاف جغرافي للمشاريع · مسارات ومحتوى ومعرّفات وبيانات SEO وروابط بديلة مترجمة · استعلامات Directus typed وفلاتر وبحث ووسائط ونموذج تواصل · مجموعات Directus وحقوله وعلاقاته وترجماته وصلاحياته وتخزين ملفاته
الفريق
المطور الوحيد للمنتج، بالتعاون مع أصحاب المصلحة ومدخلات التصميم.
التحدي
تحويل التعقيد إلى حالة مفهومة.
التحدي
كان على الخريطة أن تلائم شاشات متنوعة، وتترجم التسميات الجغرافية، وتزامن المحافظة المحددة مع URL، وتقود نتائج CMS المفلترة دون هشاشة أو صعوبة استخدام.
النهج
استخدمت D3 Geo وإسقاطات GeoJSON مع fitted extents وحاويات مقاسة، ثم ربطت حالة الخريطة بالروابط المترجمة وفلاتر Directus. صممت لوحة المفاتيح والحركة وبطاقات المشاريع والحالات المتجاوبة كنظام واحد.
النتيجة
يمكن للزوار استكشاف المشاريع جغرافياً ومشاركة موقع مفلتر عبر URL، بينما يحدّث المحررون المحتوى والترجمات والعلاقات والوسائط دون تعديلات في الواجهة.
أبرز المساهمات
- 01بنيت المستكشف الجغرافي التفاعلي كاملاً.
- 02امتلكت مخطط Directus ونموذج الصلاحيات بالكامل.
- 03نفذت مسارات وعرض العربية RTL والإنجليزية LTR.
- 04أضفت بيانات SEO وOpen Graph والروابط الأساسية وبدائل اللغات المترجمة.
التقنيات
لقطة من سجل المستودع
نُسب 128 من 132 التزاماً في سجل الفرع الرئيسي المفحوص إلى هوياتي المعروفة في Git.
تابع الاستكشاف
مصحف اقرأ
تكامل واجهة لجلسات التلاوة المباشرة، وصوت المتصفح، والملاحظات على مستوى الآية، وقارئ قرآن بست لغات.
عرض دراسة الحالة
Univerta
تدفقات إدارة وتعلم واسعة، مع معالجة اعتماديات Nx أعادت التحديث الفوري ورفعت اختبار Lighthouse مضبوطاً من 78 إلى 92.
عرض دراسة الحالة
إدارة متون
منصة إدارة طورتها منذ إعدادها الأول، وتشمل مجالس التسميع المباشرة وGraphQL والحضور والشهادات.
عرض دراسة الحالة