أورجين
تطبيق تجارة إلكترونية متعدّد المنصّات لمتجر سعودي، مع دمج كامل لبوّابتَي دفع بالتقسيط وبالبطاقة.
- 2
- iOS + Android
- KSA
البنية
- عميل
- خدمة
- مخزن بيانات
- خارجي
المشكلة
كانت أورجين تدير متجراً إلكترونياً يخدم السوق السعودية. واحتاج التطبيق وسائل دفع مناسبة للمنطقة — فالتقسيط توقّع سائد في الخليج لا خيار هامشي — وعناوين توصيل دقيقة بما يكفي للوصول إلى المبنى فعلاً.
يتوقّع العملاء في الخليج تقسيط Tabby إلى جانب الدفع بالبطاقة، وكلاهما ينبغي أن يكون موثوقاً: فالدفعة التي تنجح نصف نجاح أسوأ من التي تفشل بوضوح. كما أنّ العنونة في المنطقة كثيراً ما تكون غير موثوقة، فالعنوان المكتوب وحده لا يكفي غالباً لإتمام مندوب التوصيل مهمّته.
المقاربة
دمجتُ Tabby للتقسيط وUrway للدفع بالبطاقة، معتبراً استدعاء البوّابة الراجع — لا عودة العميل إلى التطبيق — هو المرجع في ما إذا تمّ الدفع. وبُني التطبيق بنمط MVVM مع إدارة حالة Cubit. أمّا العناوين فتُؤكَّد بتثبيت دبّوس على الخريطة، فيحمل الطلب إحداثيات لا عنواناً نصّياً فقط.
قرارات كان لها أثر
MVVM مع Cubit
اخترتُ Cubit بدل BLoC الكامل: فانتقالات حالة التطبيق مباشرة في معظمها، وCubit يعبّر عنها من دون الإسهاب في أصناف الأحداث الذي لا يضيف شيئاً عند هذا المستوى من التعقيد.
ثِق بالاستدعاء الراجع لا بالعميل
تُحسَم حالة الدفع باستدعاء البوّابة الراجع من خادم إلى خادم. فإغلاق العميل للتطبيق في منتصف إعادة التوجيه، أو فقدان الإشارة، أو النقر مرّتين — لا شيء من ذلك يمكن أن يفصل الطلب عن المال.
ملاقاة المتجر القائم حيث هو
كان النشاط يعمل أصلاً على WooCommerce. وبدل فرض ترحيلٍ كشرط مسبق، استهلك التطبيق واجهة WooCommerce REST وسدّت خدمات إضافية الفجوات — فاستمرّ المتجر في العمل طوال الوقت.
مسائل صعبة
بوّابتان، مسار دفع واحد
لـ Tabby وUrway مساران مختلفان، وأشكال استدعاء راجع مختلفة، وأنماط فشل مختلفة. تقدّم صفحة الدفع مساراً واحداً متماسكاً للعميل بينما توفّق بينهما خلف واجهة موحّدة، فلا تتسرّب خصوصيات أيّ بوّابة إلى منطق الطلبات.
عناوين يستطيع المندوب استخدامها فعلاً
يتيح تحديد الموقع والترميز الجغرافي للعملاء تأكيد التوصيل بدبّوس على الخريطة. ويخزّن الطلب الإحداثيات إلى جانب العنوان المكتوب، وهو الفرق بين محاولة توصيل وتوصيل فعليّ.
إعادة البناء من دون توقّف
انتقل التطبيق من بناء Ionic/Angular إلى Flutter بينما بقي المتجر مفتوحاً. جرى الترحيل ميزةً تلو الأخرى مقابل واجهة خلفية حيّة، لا كتحوّل شامل دفعة واحدة.
دوري
بنيتُ تطبيق Flutter، ودمجتُ بوّابتَي الدفع، وعملتُ على الواجهة الخلفية التي تخدمه.
الحالة
سُلِّم وشُغِّل للعميل. لم يعد المتجر ولا صفحات التطبيق متاحة، لذا تصف دراسة الحالة هذه الهندسة بدل الإحالة إلى منتج يعمل.
التقنيات
- FlutterMVVMCubitFCMFirebase Analytics
- TabbyUrway
- GeolocationGeocoding
- NestJSNode.jsWooCommerce REST