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

Dendi Sunardi
Dendi Sunardi
Geoffrey Prasetyo
Geoffrey Prasetyo
Swetha Gopalakrishnan
Swetha Gopalakrishnan
Thomas Steiner
Thomas Steiner

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

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

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

من خلال إضافة إمكانات تعلُّم الآلة إلى عملية إثبات الهوية والأهلية هذه ضمن تطبيق الويب، تمكّنت شركة Mitra Tokopedia من تحقيق تجربة أفضل للمستخدمين مع تسجيل حوالى ‎20% من حالات تقليل حالات تعذُّر إثبات الهوية والأهلية. وحقّقت الشركة أيضًا تخفيضات في التكاليف التشغيلية من خلال خفض الموافقات اليدوية بنسبة %70 تقريبًا.

التحدي

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

الحل

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

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

  • تحسين معدّل الرفض في عملية إثبات الهوية والأهلية
  • تحذير المستخدمين من احتمال رفض صورهم استنادًا إلى الجودة التي يقيّمها النموذج

لماذا نختار الذكاء الاصطناعي بدلاً من الحلول الأخرى؟

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

نقاط يجب أخذها في الاعتبار عند اختيار نموذج

تم أخذ العوامل التالية في الاعتبار عند اختيار نموذج الذكاء الاصطناعي.

التكلفة

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

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

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

الأداء

وقد أخذوا في الاعتبار حجم المكتبة (بالكيلوبايت) ووقت استجابة عملية المعالجة. يستخدم معظم مستخدمي 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 إنشاء ونشر حلول الذكاء الاصطناعي (AI) على الأجهزة على مستوى الأجهزة الجوّالة (Android وiOS) والويب وأجهزة الكمبيوتر المكتبي والأجهزة الطرفية وإنترنت الأشياء.

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

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

بالعودة إلى عملية التنفيذ في 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' على التوالي. كما ذكرنا في بداية هذا المنشور، على البائع تحميل مستند هُويته المدني وصورة ذاتية له مع مستند الهوية لإكمال عملية verifying العميل. بعد ذلك، يتم استخدام نتائج النموذج للتحقّق من استيفاء معايير القبول، أي أن تتطابق النقاط الرئيسية الستة المذكورة سابقًا لتكون البطاقة والهوية الذاتية صالحتين.

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

مخطّط بياني لصفحة التحقّق من هوية العميل في Mitra ونموذج TensorFlow.js والخادم أثناء التفاعل مع بعضها
كيفية تفاعل صفحة التحقّق من الهوية والأهلية في Mitra ونموذج TensorFlow.js والخادم معًا

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

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

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

التأثير

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

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

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

الخاتمة

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

يمكنك تجربة ميزة "اكتشاف الوجوه" من MediaPipe بنفسك باستخدام MediaPipe Studio وعيّنة الرمز البرمجي لميزة MediaPipe Face Detector للويب.

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