انتقل إلى المحتوى
ENFRAR

FILE 001

WhereBus

رُفعت السرية

تطبيق ويب لتتبع الحافلات في الوقت الفعلي

الدور
مصمّم ومطوّر — نماذج تجربة المستخدم، تطبيق ويب بـ React، الخرائط والتتبع المباشر
السنة
2022
التقنيات
  • React.js
  • SASS
  • Firebase
  • AWS Amplify
  • Amazon Location Service

01نظرة عامة

تطبيق ويب يعرض الحافلات مباشرة على الخريطة. يختار الركاب الخط ونقطة الانطلاق، ويشارك السائقون موقعهم عبر GPS، وتسجّل شركات النقل أسطولها وخطوطها.

خريطة مباشرة للحافلات · تقدير مدة الرحلة · البحث عن المحطات والخطوط · مشاركة موقع السائق · تسجيل الشركات.

02المشكلة

ينتظر الركاب في المحطة دون أن يعرفوا مكان حافلتهم، ولا تملك شركات النقل الصغيرة طريقة بسيطة لوضع خطوطها على الخريطة.

03منهجيتي

  1. A.01

    تطبيق واحد بثلاثة أدوار: راكب وسائق وشركة

  2. A.02

    مزامنة مواقع السائقين مباشرة عبر Firebase Realtime Database

  3. A.03

    الخرائط وتقدير مدة الرحلة عبر Amazon Location Service

04الشاشات الرئيسية

خريطة الراكب: نقطة الانطلاق والخط والحافلةWhereBus: خريطة الراكب: نقطة الانطلاق والخط والحافلة
S.01خريطة الراكب: نقطة الانطلاق والخط والحافلة
الخريطة المباشرة على الجوال
WhereBus: الخريطة المباشرة على الجوال
S.04الخريطة المباشرة على الجوال
الصفحة الرئيسية للراكبWhereBus: الصفحة الرئيسية للراكب
S.02الصفحة الرئيسية للراكب
تسجيل الشركةWhereBus: تسجيل الشركة
S.03تسجيل الشركة

› اسحب لعرض كل الشاشات (4)

05أبرز الجوانب التقنية

الواجهة الأمامية
React 18 · SASS
الخرائط والموقع
Amazon Location Service
بيانات في الوقت الفعلي
Firebase Realtime Database
الواجهة الخلفية
AWS Amplify

06النتيجة

يختار الركاب الخط ونقطة الانطلاق، ثم يتابعون الحافلة على الخريطة مع تقدير لمدة الرحلة. وتضع الشركات خطوطها ومحطاتها على الإنترنت في بضع خطوات.