مقدمة عن مشروع تطبيق بالطو baltoe

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

إعادة تصميم بالكامل مع الاحتفاظ بقاعدة البيانات

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

بعد فهم متطلبات العميل حددنا الأدوات والتكنولوجيا التي سنستخدمها في كل مراحل العمل كالتالي:

1. Pen & Paper: أداة تصميم رقمية ساعدتنا في تخطيط تصميم مبدئي لواجهة المستخدم لما يُتصوَّر أن تكون عليها وإجراء التعديلات اللازمة الانتقال إلى الخطوات التالية.
2. Adobe XD: أداة تصميم الواجهة التعاونية، وتُسهِّل مشاركة ملف التصميم مع أعضاء الفريق وإبداء أي ملاحظات لتعديل التصميم على الفور، وهي أول أداة تصميم تستخدم الويب، وهي تُساعِد المُصمّمين في العمل معًا في تصميم واجهة مُستخدم جذّابة.
3. Illustrator: أداة تصميم الرسومات التي اعتمدنا عليها بإنشاء رسومات إبداعية جذّابة في التطبيق.
4. Flutter: تكنولوجيا تصميم شاشة تطبيق FoundDr للعديد من المنصات بكود مُوحَّد.
5. Laravel: إطار PHP مفتوح المصدر وفَّر الأدوات والموارد اللازمة لبناء التطبيق.
6. HTML: لغة الترميز المستخدمة في إنشاء التطبيق، ومن خلالها أُنشئ هيكل وأقسام التطبيق.
7. CSS: اللغة المستخدمة لإظهار التصميمات والمستندات داخل التطبيق.
8. Javascript: تكنولوجيا لغة برمجية لإضافة تفاعلات ديناميكية داخل التطبيق؛ للسماح بتفاعل المستخدم، وتعمل بسلاسة إلى جانب HTML وCss في تنسيق عناصر HTML.
9. Ajax: تكنولوجيا إنشاء هيكل ديناميكي للتطبيق وإدارته من خلال مراقبة المحتوى، وهي تساعد في جعل التطبيق أكثر استجابة مع المستخدمين.

خطوات العمل في مشروع تطبيق بالطو baltoe

تطوير تطبيق بالطو تطلب فهم عميق لإطار العمل Business model وتطلعات الشركة في التطبيق الجديد، ونظرًا لأنه تطبيق بفكر مختلف فكان علينا دمج المتعارف عليه في تطبيقات حجز مواعيد الأطباء مع المميزات الجديدة التفاعلية.

1. تحليل المشروع الحالي ومعرفة أوجه القصور

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

2. تصميم تجربة المستخدم UX

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

• تصور لآلية استخدام التطبيق: وضعنا تصورًا لآلية استخدام التطبيق لتصميم تجربة مستخدم مناسبة وتُلبِّي رغبات الجمهور.
• رسم الشاشات الأساسية بشكل مبدئي: لإنشاء نماذج أولية قبل وضع التصميم النهائي للتطبيق.
• مراجعة الأفكار مع العميل: نُراجِع مع العميل الخصائص المطلوبة في التطبيق ونعرض عليه التصميم قبل استكمال التطبيق.

3. تصميم شاشات التطبيق UI

صمَّمت يو ام جي واجهات جذابة يسيرة الاستخدام تجعل المستخدمين يمرون بتجربة مميزة عند استخدام التطبيق، وكذلك صمّمت wireframe أولي لقياس ردود أفعال المستخدمين قبل إطلاق التطبيق.

• تصميم Wireframe: نُصمِّم هيكل الصفحة والتخطيط وبنية المعلومات وتدفُّق المستخدم، أو الصورة الأولية للتطبيق، وهي نقطة الانطلاق لتصميم التطبيق، كما تُسهِّل استقبال ردود أفعال المستخدمين، وهي الطريقة المُثلى لنا لقياس مدى تفاعل المُستخدِم مع الواجهة.

تصميم UI: نُصمِّم واجهات جذَّابة سهلة الاستخدام تُلبِّي حاجة المستخدمين، وتُمكِّنهم من الاستمتاع بتجربة التطبيق حيث نربط المُستخدمِين بعلامتك التجارية من خلال التصميم الجيد.

4. إعادة تصميم قاعدة البيانات

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

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

5. التطوير التقني للتطبيق

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

6. إطلاق التطبيق

بعد الانتهاء من عملية التطوير والاختبار نشرت يو ام جي تطبيق بالطو في المتاجر الإلكترونية ليتمكن الجميع من تنزيلها والبدء في استخدامها.

تحميل تطبيق بالطو:

فريق تطوير تطبيقات الجوال في يو ام جي

م. طاهر ناصر (Backend developer): المسؤول عن تطوير خلفية تطبيق الويب والجوال، وهي المعنية بالتعامل مع تخزين البيانات ومعالجتها، وذلك باستخدام لغات البرمجة المناسبة، حيث يتعامل مع الأمور غير المرئية لمستخدمي التطبيق، لكنّها الأساسية لعمل التطبيق بكفاءة.

م. راندا محمد (Frontend developer): المسؤولة عن تطوير الواجهة الأمامية لتطبيق الويب التي يتعامل عليها الجمهور وترتبط مع الواجهة الخلفية باستخدام خطافات APIs.

م. عبد الرحمن محمد (UI/UX designer): المسؤول عن تصميم واجهة المستخدم وتحقيق تجربة مستخدم جيدة من خلال العناصر المرئية المناسبة التي يتفاعل معها المستخدمون مباشرة، مثل الأزرار والقوائم والأيقونات، وبالتصميم الجمالي الذي يجذب المستخدمين.

م. أحمد ناصر (Mobile developer): المسؤول عن تطوير وتصميم تطبيقات الهاتف المحمول، وجعل هذه التطبيقات ملائمة لمنصات الهاتف الذكي، مثل الأندرويد وأبل iOS، كما يحرص على أن يعمل التطبيق تقنيًا بشكل صحيح.