Come Tokopedia ha ridotto i costi operativi migliorando l'app web per venditori tramite il machine learning

Dendi Sunardi
Dendi Sunardi
Geoffrey Prasetyo
Geoffrey Prasetyo
Swetha Gopalakrishnan
Swetha Gopalakrishnan

Tokopedia è una società di tecnologia indonesiana con uno dei più grandi marketplace di e-commerce, che ospita oltre 40 prodotti digitali e più di 14 milioni di venditori registrati sulla propria piattaforma.

Mitra Tokopedia, che fa parte dei verticali di business di Tokopedia, è un'applicazione web che aiuta i proprietari di piccole imprese a vendere prodotti digitali come crediti e coupon per giochi, pacchetti di dati, token per l'elettricità, bollette sanitarie nazionali e altro ancora. Il sito web è uno dei canali principali per i venditori Mitra Tokopedia in più di 700 città, pertanto è fondamentale garantire un'esperienza utente fluida.

Un passaggio chiave della procedura di onboarding richiede a questi venditori di verificare la propria identità. Per completare la verifica del venditore, il venditore deve caricare il proprio documento di identità nazionale e un selfie con il documento. Questa procedura è nota come procedura di "Conosci i tuoi clienti" (KYC).

Aggiungendo funzionalità di machine learning a questa procedura di verifica dell'identità fondamentale all'interno della propria app web, Mitra Tokopedia è riuscita a ottenere un'esperienza utente migliore con una riduzione di oltre il 20% degli errori di verifica. Ha inoltre ottenuto risparmi operativi riducendo le approvazioni manuali di quasi il 70%.

Sfida

La maggior parte dei dati relativi alla verifica dell'identità veniva rifiutata, generando migliaia di richieste settimanali per il team operativo per la verifica manuale. Ciò non solo ha comportato costi operativi elevati, ma ha anche generato un'esperienza utente negativa per i venditori, la cui procedura di verifica viene ritardata. Il motivo principale del rifiuto è che i venditori non hanno caricato correttamente i selfie con i documenti di identità. Mitra Tokopedia era molto interessata a risolvere questo problema in modo scalabile utilizzando le funzionalità web moderne.

Soluzione

Il team di Tokopedia ha deciso di utilizzare l'IA con TensorFlow.js per risolvere questo problema nel primo passaggio della procedura di verifica dell'identità, quando l'utente carica le immagini. Hanno utilizzato MediaPipe e la libreria di rilevamento dei volti di TensorFlow per rilevare il volto del venditore con sei punti chiave quando il venditore carica la carta di identità e le immagini del selfie. L'output del modello viene poi utilizzato per verificare la conformità ai criteri di accettazione. Al termine della verifica, le informazioni vengono inviate al backend. Se la verifica non va a buon fine, al venditore viene fornito un messaggio di errore e la possibilità di riprovare. È stato utilizzato un approccio ibrido in cui il modello esegue l'inferenza sul dispositivo o lato server, a seconda delle specifiche dello smartphone. Un dispositivo di fascia inferiore eseguirà l'inferenza sul server.

L'utilizzo di un modello di ML nelle prime fasi della procedura di verifica dell'identità consente di:

  • Migliorare il tasso di rifiuto nella procedura di verifica dell'identità.
  • Avvisare gli utenti del possibile rifiuto delle loro immagini, in base alla qualità valutata dal modello.

Perché scegliere l'IA rispetto ad altre soluzioni?

L'IA può automatizzare le attività ripetitive che altrimenti richiederebbero molto tempo o non sarebbero pratiche da svolgere manualmente. Nel caso di Tokopedia, l'ottimizzazione dell'attuale soluzione non basata sul machine learning non ha prodotto risultati significativi, mentre una soluzione di ML poteva ridurre notevolmente il carico sul team operativo che doveva elaborare manualmente migliaia di approvazioni settimanali. Con una soluzione di ML, i controlli delle immagini possono essere eseguiti quasi istantaneamente, offrendo un'esperienza utente migliore e migliorando l'efficienza operativa. Scopri di più sulla definizione del problema per determinare se l'AI è una soluzione adatta al tuo problema.

Considerazioni per la scelta di un modello

I seguenti fattori sono stati presi in considerazione per la scelta del modello ML.

Costo

Hanno valutato il costo complessivo dell'utilizzo del modello. Poiché TensorFlow.js è un pacchetto open source ben gestito da Google, risparmiamo sui costi di licenza e manutenzione. Un'altra considerazione riguarda il costo dell'inferenza. Essere in grado di eseguire l'inferenza lato client consente di risparmiare molto rispetto all'elaborazione lato server con GPU costose, soprattutto se i dati risultano non validi e inutilizzabili.

Scalabilità

Hanno preso in considerazione la scalabilità del modello e della tecnologia. È in grado di gestire la crescita della complessità dei dati e dei modelli man mano che il progetto si evolve? Può essere esteso per soddisfare altri progetti o casi d'uso? L'elaborazione sul dispositivo è utile perché il modello può essere ospitato su una CDN e pubblicato sul lato client, il che è molto scalabile.

Prestazioni

Sono state prese in considerazione le dimensioni della libreria (in KB) e la latenza del processo di runtime. La maggior parte della base utenti di Mitra Tokopedia utilizza dispositivi di fascia media e bassa con velocità e connettività internet moderate. Pertanto, le prestazioni in termini di download e tempo di esecuzione (ovvero la velocità con cui il modello può produrre un output) sono una priorità assoluta per soddisfare le loro esigenze specifiche e garantire un'esperienza utente ottimale.

Altre considerazioni

Conformità alle normative:dovevano assicurarsi che la libreria scelta fosse conforme alle normative pertinenti sulla protezione dei dati e sulla privacy.

Competenze:ha valutato le competenze e le conoscenze del team. Alcuni framework e librerie di ML possono richiedere competenze o linguaggi di programmazione specifici in un determinato ambito. Prendendo in considerazione questi fattori, ha preso una decisione consapevole quando ha scelto il modello giusto per il suo progetto di machine learning.

Tecnologia scelta

TensorFlow.js ha soddisfatto le sue esigenze, dopo aver preso in considerazione questi fattori. È in grado di funzionare completamente sul dispositivo utilizzando il proprio backend WebGL per usare la GPU del dispositivo. L'esecuzione di un modello sul dispositivo consente di fornire un feedback più rapido all'utente grazie alla riduzione della latenza del server e al calo dei costi di calcolo del server. Scopri di più sull'ML on-device nell'articolo Vantaggi e limitazioni dell'ML on-device.

"TensorFlow.js è una libreria di machine learning open source di Google rivolta agli sviluppatori JavaScript ed è in grado di eseguire il codice lato client nel browser. È l'opzione più matura per l'IA web con un supporto completo degli operatori di backend WebGL, WebAssembly e WebGPU che può essere utilizzato all'interno del browser con prestazioni rapide." - In che modo Adobe ha utilizzato Web ML con TensorFlow.js per migliorare Photoshop per il web

Implementazione tecnica

Mitra Tokopedia ha utilizzato MediaPipe e la libreria di rilevamento dei volti di TensorFlow, un pacchetto che fornisce modelli per l'esecuzione del rilevamento dei volti in tempo reale. In particolare, per questa soluzione è stato utilizzato il modello MediaPipeFaceDetector-TFJS fornito in questa libreria, che implementa il runtime tfjs.

Prima di passare all'implementazione, ecco un breve riepilogo di MediaPipe. MediaPipe ti consente di creare e implementare soluzioni di ML on-device su dispositivi mobili (Android, iOS), web, desktop, edge e IoT.

Al momento della stesura di questo post, MediaPipe offre 14 diverse soluzioni. Puoi utilizzare un runtime mediapipe o tfjs. Il runtime tfjs è realizzato in JavaScript e fornisce un pacchetto JavaScript che può essere scaricato dall'applicazione web. È diverso da un runtime mediapipe, che viene creato con C++ e compilato in un modulo WebAssembly. Le differenze principali sono le prestazioni, la possibilità di eseguire il debug e il raggruppamento. Il pacchetto JavaScript può essere aggregato con i classici aggregatori come webpack. Al contrario, il modulo Wasm è una risorsa binaria più grande e separata (il che è attenuato dal fatto che non è una dipendenza dal tempo di caricamento) e richiede un flusso di lavoro di debug di Wasm diverso. Tuttavia, viene eseguita più velocemente per contribuire a soddisfare i requisiti tecnici e di rendimento.

Diagramma del funzionamento dei modelli MediaPipe e TensorFlow per i diversi ambienti di runtime, utilizzando FaceDetection come esempio.
Un'illustrazione generale del funzionamento dei modelli MediaPipe e TensorFlow per i diversi runtime, utilizzando FaceDetection come esempio

Tornando all'implementazione di Tokopedia, il primo passaggio consiste nell'inizializzare il modello come segue. Quando l'utente carica una foto, un HTMLImageElementviene trasmesso come input al rilevatore.

// 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);

Il risultato dell'elenco dei volti contiene i volti rilevati per ogni volto nell'immagine. Se il modello non riesce a rilevare alcun volto, l'elenco sarà vuoto. Per ogni volto, contiene un riquadro di delimitazione del volto rilevato, nonché un array di sei punti chiave per il volto rilevato. Sono inclusi elementi come occhi, naso e bocca. Ogni punto di riferimento contiene x e y, oltre a un nome.

[
  {
    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 rappresenta il riquadro di delimitazione del volto nello spazio dei pixel dell'immagine, con xMin, xMax che indicano i limiti x, yMin, yMax che indicano i limiti y e width, height che sono le dimensioni del riquadro di delimitazione. Per keypoints, x e y, la posizione effettiva del punto di riferimento nello spazio in pixel dell'immagine. name fornisce un'etichetta per il punto chiave, ovvero 'rightEye', 'leftEye', 'noseTip', 'mouthCenter', 'rightEarTragion' e 'leftEarTragion'. Come accennato all'inizio di questo post, il venditore deve caricare il suo documento di identità nazionale e un selfie con il documento per completare la verifica. L'output del modello viene poi utilizzato per verificare la conformità ai criteri di accettazione, ovvero la corrispondenza dei sei punti chiave menzionati in precedenza per essere considerata una carta di identità e un'immagine selfie valide.

Al termine della verifica, le informazioni pertinenti sul venditore vengono trasmesse al backend. Se la verifica non va a buon fine, al venditore viene mostrato un messaggio di errore e viene data la possibilità di riprovare. Non verranno inviate informazioni al backend.

Diagramma della pagina di verifica dell'identità di Mitra, del modello TensorFlow.js e del server che interagiscono tra loro.
In che modo la pagina Mitra KYC, il modello TensorFlow.js e il server interagiscono tra loro

Considerazioni sulle prestazioni per i dispositivi di fascia bassa

Questo pacchetto ha solo 24,8 KB (minimizzato e compresso con gzip), il che non influisce in modo significativo sul tempo di download. Tuttavia, per i dispositivi di fascia molto bassa, l'elaborazione in fase di esecuzione richiede molto tempo. È stata aggiunta una logica aggiuntiva per verificare la RAM e la CPU del dispositivo prima di passare le due immagini al modello di rilevamento dei volti di machine learning.

Se il dispositivo ha più di 4 GB di RAM, una connessione di rete superiore al 4G e una CPU con più di 6 core, le immagini vengono passate al modello on-device per la verifica del volto. Se questi requisiti non sono soddisfatti, il modello sul dispositivo viene ignorato e le immagini vengono inviate direttamente al server per la verifica utilizzando un approccio ibrido per soddisfare le esigenze di questi dispositivi meno recenti. Con il tempo, un numero maggiore di dispositivi potrà scaricare il calcolo dal server man mano che l'hardware continuerà a evolversi.

Impatto

Grazie all'integrazione dell'IA, Tokopedia è riuscita a risolvere il problema dell'alto tasso di rifiuto e ha ottenuto i seguenti risultati:

  • Il tasso di rifiuto è diminuito di oltre il 20%.
  • Il numero di approvazioni manuali è diminuito di quasi il 70%.

Ciò non solo ha creato un'esperienza utente più fluida per i venditori, ma ha anche ridotto il costo operativo per il team di Tokopedia.

Conclusione

Nel complesso, i risultati di questo caso di studio hanno dimostrato che, per i casi d'uso giusti, le soluzioni di ML on-device sul web possono essere utili per migliorare l'esperienza utente e l'efficacia delle funzionalità, nonché per generare risparmi sui costi e altri vantaggi per l'attività.

Prova la funzionalità di rilevamento dei volti di MediaPipe utilizzando MediaPipe Studio e il codice di esempio per MediaPipe Face Detector per il web.

Se ti interessa estendere le funzionalità della tua app web con l'ML on-device, consulta le seguenti risorse: