Dashboard

Wasl — B2B Logistics Dashboard

Fleet management dashboard for a Riyadh-based logistics company — live tracking, driver scoring, and automated reporting.

  • Year: 2023
  • Duration: 4 months
  • Client: Logistics & Fleet Company
  • Outcome: 30% ops cost reduction

Technologies: React, WebSockets, Maps, Charts

The Challenge

A 120-vehicle fleet with no live visibility. Dispatchers were calling drivers every 20 minutes for status updates. Fuel costs were unmonitored, idling was rampant, and monthly reporting took the ops team a full week to compile from spreadsheets.

Our Approach

  1. Operations Deep Dive — Spent two days at the dispatch center observing real workflows. Built a comprehensive map of every decision a dispatcher makes in a shift — this became the information architecture.
  2. Real-Time Architecture — Designed a WebSocket-first architecture with a Redis pub/sub layer. Location updates arrive in under 2 seconds, even with 120 simultaneous vehicle streams.
  3. Reporting Automation — Built a configurable reporting engine that auto-generates daily, weekly, and monthly PDFs in Arabic and English and emails them to the right stakeholders.

Core Features

  • Live Fleet Map — Real-time vehicle positions with route playback, geofence alerts, and cluster view for dense urban zones.
  • Driver Scorecard — Composite driver score from speeding events, harsh braking, idle time, and on-time delivery rate. Weekly rankings shared with drivers via SMS.
  • Fuel Analytics — Per-vehicle and per-route fuel consumption with anomaly detection that flags unusual patterns automatically.
  • Automated Report Engine — Configurable daily/weekly/monthly PDF reports auto-delivered to operators, in Arabic or English, with one-click export.

لوحة تحكم

وصل — لوحة تحكم للخدمات اللوجستية

لوحة تحكم لإدارة الأسطول لشركة لوجستية في الرياض، مع تتبع مباشر وتقييم السائقين وتقارير تلقائية.

  • السنة: 2023
  • المدة: ٤ أشهر
  • العميل: شركة لوجستية وأساطيل
  • النتيجة: خفض تكاليف التشغيل بنسبة ٣٠٪

التقنيات المستخدمة: React، WebSockets، Maps، Charts

التحدي

أسطول مؤلف من ١٢٠ مركبة بدون رؤية مباشرة. كان المرسلون يتصلون بالسائقين كل ٢٠ دقيقة. تكاليف الوقود غير مراقبة، والتقارير الشهرية تستغرق أسبوعاً كاملاً.

كيف عملنا

  1. غوص عميق في العمليات — قضينا يومين في مركز الإرسال نراقب العمليات الحقيقية. بنينا خريطة شاملة لكل قرار يتخذه المرسل في وردية.
  2. بنية الوقت الحقيقي — صممنا بنية WebSocket-first مع طبقة Redis pub/sub. تصل تحديثات الموقع في أقل من ثانيتين مع ١٢٠ بث للمركبات في آن واحد.
  3. أتمتة التقارير — بنينا محرك تقارير قابل للتهيئة يُنشئ PDFs يومية وأسبوعية وشهرية بالعربية والإنجليزية ويرسلها للمعنيين.

الميزات الأساسية

  • خريطة الأسطول الحية — مواقع المركبات الآنية مع إعادة تشغيل المسار وتنبيهات السياج الجغرافي وعرض المجموعات.
  • بطاقة تقييم السائق — تقييم السائق المركّب من أحداث السرعة والكبح المفاجئ ووقت التوقف. تُشارك التصنيفات الأسبوعية مع السائقين.
  • تحليلات الوقود — استهلاك الوقود لكل مركبة وكل مسار مع كشف الشذوذات الذي يُبرز الأنماط غير العادية تلقائياً.
  • محرك التقارير التلقائي — تقارير PDF يومية/أسبوعية/شهرية تلقائية تُسلَّم للمشغلين بالعربية أو الإنجليزية مع تصدير بنقرة واحدة.

Previous Project: Mada — E-Commerce Design System · Next Project: Saqr — Fintech Brand Identity · Back to Portfolio · Start a Conversation