تطوير واجهة أمامية مُخصصة بعناصر عرض البيانات لأحد أنظمة مراقبة حركة المرور عن بُعد

العميل

العميل النهائي هو إحدى الشركات المتخصصة في توفير برمجيات إدارة حركة المرور.

الحاجة إلى خبراء محترفين في تطوير الواجهة الأمامية لتنفيذ واجهة مستخدم سلسة

كانت الشركة تعمل على تطوير نظام، يتمثل في تطبيق ويب متصلًا بأجهزة تحكم لمراقبة تشغيل إشارات المرور في المُدن. وتعتمد فكرة هذا الحل على قيام أجهزة التحكم بنقل المعلومات المتعلقة بأوضاع تشغيل وإيقاف كل إشارة مرور ضوئية والمدة الزمنية لكل منها. ويُمكِّن الحل مهندسي المرور، وهم المستخدمون المستهدفون الأساسيون للنظام، من مراقبة الحالة المرورية عن بُعد، وإرسال فنيين للصيانة في حالة حدوث خلل ما، وكذلك التحكم يدويًا في أضواء الإشارات عند الحاجة، مثل في حالات تسهيل مرور سيارة إسعاف خلال الازدحامات المرورية. في البداية، كان النظام مُخصَّصًا للاستخدام في الولايات المتحدة، إلا أن العميل كان منفتحًا على إمكانية توزيعه دوليًا.

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

ساينس سوفت تُعزِّز فريق المشروع بخبراء محترفين في تطوير الواجهة الأمامية

كان العميل لديه نماذج أوَّلية لواجهة المستخدم (UI mockups) الخاصة بعناصر العرض، لكن طلبت الشركة من فريقنا التحقق من جودة تلك النماذج. وبعد الفحص والمراجعة الدقيقة، توصل خبراؤنا إلى أن التصميم غير قابل للتطبيق من عدة جوانب، كما أنه لم يشمل جميع الوظائف المطلوبة. لذا، عُدنا إلى مرحلة ما قبل التصميم لتحديد متطلبات واجهة النظام.

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

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

• البيانات الواردة في الوقت الفعلي من أجهزة التحكم بالإشارات الضوئية.
• البيانات القديمة. تتطلب هذه العناصر مزامنة البيانات يدويًا مع الخادم.

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

بالإضافة إلى ذلك، أجرى فريقنا تغييرات في إعدادات النظام بهدف تحسين تجربة المستخدم. كان النظام يضم افتراضيًا خوارزمية تضبط معلومات الوقت حسب المنطقة الزمنية المحلية للمستخدم، ما كان من المحتمل أن يتسبب في حدوث خطأ عندما يعرض المستخدمون معلومات عن الحالة المرورية في منطقة زمنية مختلفة. فإذا عُرضت تلك المعلومات بالتوقيت المحلي للمستخدم، فإنها ستكون غير دقيقة، وسيتعين على المستخدمين بذل جهد ذهني إضافي لإعادة حساب الوقت بتوقيتهم المحلي. لمعالجة ذلك، ضبط فريقنا إعدادات النظام بحيث تُعرض المعلومات في الوقت الفعلي للمستخدمين، بغض النظر عن منطقتهم الزمنية.

ساينس سوفت تتوسع بدورها في التعاون مع العميل

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

التقنيات والأدوات

Angular v13.0 – v16.0, PrimeNG, Fabric.js.