قصة نجاح شركة Tokopedia في تقليل التكاليف التشغيلية من خلال تحسين تطبيق الويب الخاص بالبائع باستخدام تكنولوجيا تعلُّم الآلة

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

Mitra Tokopedia، جزء من قطاعات الأنشطة التجارية في Tokopedia، هو تطبيق ويب يساعد مالكي الأنشطة التجارية الصغيرة في بيع المنتجات الرقمية مثل قسائم الائتمان والألعاب، وحِزم البيانات، والرموز المميزة للكهرباء، وفواتير الرعاية الصحية الوطنية وغيرها. والموقع الإلكتروني هو إحدى القنوات الأساسية لبائعي Mitra Tokopedia في أكثر من 700 مدينة، ما يجعل من المهم ضمان توفير تجربة سلسة للمستخدمين.

وهناك خطوة رئيسية في عملية الإعداد تتطلب من هؤلاء البائعين إثبات هويتهم. على البائع تحميل مستند تعريف الهوية الوطنية بالإضافة إلى صورة ذاتية تتضمّن مستند التعريف لإكمال عملية إثبات هوية البائع. ويُشار إلى ذلك بعملية معرفة العميل (KYC).

ومن خلال إضافة إمكانات تعلُّم الآلة إلى عملية التعرّف على العملاء (KYC) المهمة هذه في تطبيق الويب الخاص بها، تمكّنت شركة Mitra Tokopedia من تحسين تجربة المستخدم مع خفض عدد عمليات إثبات الملكية بنسبة تزيد عن 20%. كما وفرت التكاليف التشغيلية عن طريق تقليل الموافقات اليدوية بحوالي 70٪.

التحدّي

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

الحلّ

قرّر الفريق في شركة Tokopedia استخدام تعلُّم الآلة مع TensorFlow.js لحل هذه المشكلة في الخطوة الأولى من عملية التعرُّف على العملاء (KYC)، وهي عندما يحمّل المستخدم الصور. واستخدمت الشركة مكتبة ميزة "التعرّف على الوجه" في TensorFlow لاكتشاف وجه البائع من خلال ست نقاط رئيسية عندما يحمّل البائع بطاقة التعريف والصور الذاتية. ثم يتم استخدام مخرجات النموذج للتحقق من معايير القبول الخاصة بها. بعد التحقق بنجاح، يتم إرسال المعلومات إلى الخلفية. إذا فشل التحقق، يتم تزويد البائع برسالة خطأ وخيار لإعادة المحاولة. تم استخدام منهج مختلط حيث يقوم النموذج بالاستنتاج إما على الجهاز أو من جهة الخادم بناءً على مواصفات الهاتف. سيؤدي الجهاز الأقل تقدمًا إلى الاستنتاج على الخادم.

ويتيح لهم استخدام نموذج تعلُّم الآلة في مرحلة مبكرة من عملية التعرّف على العملاء إمكانية ما يلي:

  • تحسين معدّل الرفض في عملية "التعرّف على العملاء"
  • تحذير المستخدمين من الرفض المحتمل للصور، بناءً على الجودة التي يقيّمها النموذج.

لماذا يجب اختيار تعلُّم الآلة بدلاً من الحلول الأخرى؟

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

الاعتبارات عند اختيار نموذج

تم أخذ العوامل التالية في الاعتبار عند اختيار نموذج تعلُّم الآلة.

التكلفة

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

سهولة التطوير

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

عروض أداء

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

اعتبارات أخرى

الامتثال التنظيمي: كان عليهم التأكّد من التزام المكتبة المختارة بلوائح حماية البيانات والخصوصية ذات الصلة.

المهارات: قيّموا خبرة فريقهم ومجموعة مهاراتهم. قد تتطلب بعض أطر عمل ومكتبات تعلُّم الآلة لغات برمجة أو خبرة محددة في مجال معين. من خلال النظر في هذه العوامل، اتخذوا قرارًا مدروسًا عند اختيار النموذج المناسب لمشروع التعلم الآلي لديهم.

التكنولوجيا التي تم اختيارها

وتمكّن TensorFlow.js من تلبية احتياجاته، بعد وضع هذه العوامل في الاعتبار. ويمكن تشغيلها بالكامل على الجهاز باستخدام الواجهة الخلفية لـ WebGL لاستخدام وحدة معالجة الرسومات للجهاز. يتيح تشغيل نموذج على الجهاز إمكانية إرسال ملاحظات أسرع للمستخدم بسبب انخفاض وقت استجابة الخادم وتقليل تكلفة الحوسبة الخاصة بالخادم. يمكنك قراءة المزيد عن تعلُّم الآلة على الجهاز في المقالة مزايا وقيود تعلُّم الآلة على الجهاز.

"TensorFlow.js هي مكتبة مفتوحة المصدر لتعلُّم الآلة تقدِّمها Google، وتهدف إلى مطوّري JavaScript الذين يمكنهم تشغيل البرنامج من جهة العميل في المتصفّح. وهو الخيار الأكثر نضجًا بالنسبة إلى تكنولوجيات الذكاء الاصطناعي على الويب مع دعم شامل للواجهة الخلفية لـ WebGL وWebAssembly وWebGPU، ويمكن استخدامه ضمن المتصفّح بأداء سريع."كيفية استخدام Adobe لتعلُّم الآلة على الويب مع TensorFlow.js لتحسين Photoshop للويب

التنفيذ الفني

استخدمت Mitra Tokopedia مكتبة ميزة "التعرّف على الوجه" من MediaPipe وTensorFlow، وهي حزمة توفّر نماذج لتشغيل ميزة "التعرّف على الوجوه في الوقت الفعلي". على وجه التحديد، تم استخدام نموذج MediaPipeFaceDetector-TFJS المتوفّر في هذه المكتبة، والذي يطبّق وقت التشغيل tfjs، تم استخدامه لهذا الحلّ.

قبل البدء بعملية التنفيذ، نقدّم إليك ملخصًا موجزًا للتعرّف على MediaPipe. تتيح لك MediaPipe إنشاء حلول تعلُّم الآلة على الجهاز ونشرها على الأجهزة الجوّالة (Android وiOS) والويب وأجهزة الكمبيوتر المكتبي والأجهزة الهامشية وإنترنت الأشياء (IoT).

تم تقديم 14 حلاً مختلفًا من قِبل MediaPipe عند كتابة هذه المشاركة. يمكنك استخدام وقت التشغيل mediapipe أو tfjs. يتمّ تصميم وقت تشغيل tfjs باستخدام JavaScript وتوفير حزمة JavaScript يمكن تنزيلها خارجيًا من خلال تطبيق الويب. ويختلف ذلك عن وقت تشغيل mediapipe، الذي تم إنشاؤه باستخدام لغة C++ وتم تجميعه في وحدة WebAssembly. تتمثل الاختلافات الرئيسية في الأداء وقابلية تصحيح الأخطاء والتجميع. يمكن تجميع حزمة JavaScript مع حزم كلاسيكية مثل webpack. وفي المقابل، تعد وحدة Wasm موردًا ثنائيًا أكبر ومنفصلاً (والذي يتم التخفيف من حدته من خلال عدم الاعتماد عليه لوقت التحميل) وتتطلب سير عمل مختلف في Wasm لتصحيح الأخطاء. ومع ذلك، يتم تنفيذها بشكل أسرع للمساعدة في تلبية المتطلبات الفنية ومتطلبات الأداء.

رسم بياني يوضّح طريقة عمل نموذجَي MediaPipe وTensorFlow في أوقات التشغيل المختلفة، مع استخدام ميزة FaceDetection كمثال
صورة توضيحية عامة حول طريقة عمل نموذجَي MediaPipe وTensorFlow في أوقات التشغيل المختلفة باستخدام ميزة FaceDetection

بالعودة إلى تنفيذ Tokopedia، تتمثل الخطوة الأولى في تهيئة النموذج على النحو التالي. عندما يحمِّل المستخدم صورة، يتم تمرير HTMLImageElement كإدخال إلى أداة الرصد.

// Create the detector.
const model = faceDetection.SupportedModels.MediaPipeFaceDetector;
const detectorConfig = {
  runtime: 'tfjs'
};

const detector = await faceDetection.createDetector(model, detectorConfig);

// Run inference to start detecting faces.
const estimationConfig = {flipHorizontal: false};
const faces = await detector.estimateFaces(image, estimationConfig);

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

[
  {
    box: {
      xMin: 304.6476503248806,
      xMax: 502.5079975897382,
      yMin: 102.16298762367356,
      yMax: 349.035215984403,
      width: 197.86034726485758,
      height: 246.87222836072945
    },
    keypoints: [
      {x: 446.544237446397, y: 256.8054528661723, name: "rightEye"},
      {x: 406.53152857172876, y: 255.8, "leftEye },
      ...
    ],
  }
]

يمثّل box مربّع حدود الوجه في مساحة بكسل الصورة، حيث يشير xMin وxMax إلى الحدود x وyMin وyMax إلى الحدود y وwidth وheight هي أبعاد مربّع الحدود. بالنسبة إلى keypoints وx وy، يمثلان موضع النقطة الرئيسية الفعلي في مساحة بكسل الصورة. توفّر السمة name تصنيفًا للنقطة الرئيسية، وهي 'rightEye' و'leftEye' و'noseTip' و'mouthCenter' و'rightEarTragion' و'leftEarTragion' على التوالي. كما ذكرنا في بداية هذه المشاركة، على البائع تحميل مستند تعريف الهوية الوطنية وصورة ذاتية مع مستند تعريف الهوية لإكمال عملية إثبات هوية البائع. ثم يُستخدم مخرجات النموذج للتحقق من معايير القبول، أي للحصول على مطابقة للنقاط الرئيسية الست المذكورة سابقًا باعتبارها بطاقة تعريف صالحة وصورة ذاتية.

بعد التحقق بنجاح، يتم تمرير معلومات البائع ذات الصلة إلى الخلفية. وإذا أخفقت عملية التحقق، يتم عرض رسالة إخفاق على البائع وخيار لإعادة المحاولة. لن يتم إرسال أي معلومات إلى الخلفية.

رسم بياني لصفحة Mitra KYC ونموذج TensorFlow.js وخادم يتفاعل مع بعضها البعض.
كيفية تفاعل صفحة Mitra KYC ونموذج TensorFlow.js والخادم مع بعضها

اعتبارات الأداء للأجهزة ذات المواصفات المنخفضة

يبلغ حجم هذه الحزمة 24.8 كيلوبايت فقط (يتم تصغيرها ودمجها في gzip)، ما لا يؤثّر بشكل كبير في مدّة التنزيل. ومع ذلك، تستغرق معالجة وقت التشغيل وقتًا طويلاً في الأجهزة ذات المواصفات المنخفضة جدًا. تمت إضافة منطق إضافي للتحقق من ذاكرة الوصول العشوائي للجهاز ووحدة المعالجة المركزية (CPU) قبل تمرير الصورتين إلى نموذج اكتشاف الوجه حسب التعلم الآلي.

إذا كان الجهاز يحتوي على ذاكرة وصول عشوائي (RAM) بسعة أكبر من 4 غيغابايت واتصال شبكة أكبر من 4 غيغابايت ووحدة معالجة مركزية بها أكثر من 6 نوى، يتم نقل الصور إلى الطراز المتوفّر على الجهاز من أجل التحقّق من الوجه. وفي حال عدم استيفاء هذه المتطلبات، يتم تخطي النموذج المتوفّر على الجهاز وإرسال الصور مباشرةً إلى الخادم لإجراء عملية التحقّق باستخدام منهج مختلط لتلبية متطلبات هذه الأجهزة القديمة. مع مرور الوقت، ستتمكن المزيد من الأجهزة من تفريغ الحوسبة من الخادم مع استمرار تطوّر الأجهزة.

التأثير

بفضل دمج تعلُّم الآلة، نجحت Tokopedia في حل مشكلة ارتفاع معدل الرفض وحققت النتائج التالية:

  • انخفض معدّل الرفض بأكثر من 20%.
  • انخفض عدد الموافقات اليدوية بنسبة 70% تقريبًا.

لم يؤدِّ ذلك إلى توفير تجربة مستخدم أكثر سلاسة للبائعين فحسب، بل ساعد أيضًا في تقليل التكلفة التشغيلية لفريق Tokopedia.

الخلاصة

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

يمكنك تجربة ميزة MediaPipe Face Detection بنفسك باستخدام MediaPipe Studio ونموذج الرمز البرمجي لأداة MediaPipe Face Detector for Web.

إذا كنت مهتمًا بتوسيع نطاق إمكانات تطبيق الويب الخاص بك باستخدام تعلُّم الآلة على الجهاز، يمكنك الاطّلاع على المراجع التالية: