Object Detection and Augmentation

J'ai beaucoup joué avec [Shape Detection API](https://paul.kinlan.me/face-detection/ https://paul.kinlan.me/barcode-detection/ https://paul.kinlan.me/detecting-text-in-an-image/) dans Chrome et j'aime beaucoup son potentiel. Par exemple, un QRCode detector très simple QRCode detector j'ai écrit il y a longtemps possède un polyfill JS, mais utilise l'API new BarcodeDetector() si elle est disponible.

Vous pouvez voir certaines des autres démos que j'ai construites ici en utilisant les autres fonctionnalités de l'API de détection de forme: Face Detection , Barcode Detection et Text Detection .

J'ai été agréablement surpris lorsque je suis tombé sur Jeeliz le week-end et j'ai été extrêmement impressionné par les performances de leur boîte à outils - sachant que j'utilisais un Pixel3 XL, mais la détection des visages semblait nettement plus rapide que ce qui est possible avec l'API FaceDetector .

Checkout some of their demos .

Cela m'a beaucoup fait réfléchir. Cette boîte à outils pour la détection d'objets (et d'autres outils similaires) utilise des API largement disponibles sur le Web, notamment l'accès aux caméras, WebGL et WASM, contrairement à l'API de détection des formes de Chrome (disponible uniquement dans Chrome et non cohérente sur toutes les plateformes sur lesquelles Chrome est installé). ) peuvent être utilisés pour créer facilement des expériences riches et atteindre des milliards d'utilisateurs avec une expérience cohérente sur toutes les plateformes.

L'augmentation est l'endroit où cela devient intéressant (et vraiment ce que je voulais montrer dans cet article) et où vous avez besoin de bibliothèques de middlewares qui arrivent maintenant sur la plate-forme, nous pouvons créer des applications amusantes de filtrage des visages de Snapchat sans que les utilisateurs installent des applications MASSIVE. qui recueille une énorme quantité de données sur le périphérique de l'utilisateur (car il n'y a pas d'accès sous-jacent au système).

En dehors des démonstrations amusantes, il est possible de résoudre des cas d'utilisation très avancés rapidement et simplement pour l'utilisateur, tels que:

  • Sélection de texte directement à partir de l'appareil photo ou photo de l'utilisateur
  • Traduction en direct des langues de la caméra
  • Détection de QRCode en ligne pour que les gens n'aient pas à ouvrir WeChat tout le temps :)
  • Extraire automatiquement les URL du site Web ou l'adresse d'une image
  • Détection de carte de crédit et extraction de numéro (permet aux utilisateurs de s'inscrire rapidement sur votre site)
  • Recherche de produit visuelle dans l'application Web de votre magasin.
  • Recherche de code à barres pour plus de détails sur les produits dans l'application Web de votre magasin.
  • Recadrage rapide des photos de profil sur les visages des personnes.
  • Fonctions A11Y simples permettant à l’utilisateur d’entendre le texte contenu dans les images.

Je viens de passer 5 minutes à réfléchir à ces cas d'utilisation - je sais qu'il y en a beaucoup plus - mais je me suis rendu compte que nous ne voyons pas beaucoup de sites ou d'applications Web utiliser la caméra, mais que beaucoup de sites demandent à leur les utilisateurs à télécharger une application, et je ne pense pas que nous devions le faire plus.

** Mise à jour ** Thomas Steiner de notre équipe a mentionné dans notre équipe Chat qu'il ShapeDetection que je ShapeDetection API ShapeDetection actuelle. J'aime le fait que cette API nous donne accès aux implémentations d'expédition natives de chacun des systèmes respectifs. Cependant, comme je l'ai écrit dans The Lumpy Web , les développeurs Web recherchent la cohérence dans la plate-forme et de nombreux problèmes liés à l'API de détection de forme peuvent se résumer comme suit:

  1. L'API est uniquement dans Chrome
  2. L'API dans Chrome est très différente sur chaque plate-forme, car ses implémentations sous-jacentes sont différentes. Android n'a que des points pour des repères tels que la bouche et les yeux, où macOS a des contours. Sur Android, TextDetector renvoie le texte détecté, tandis que sur macOS, il renvoie un indicateur de «présence de texte» ... Sans parler de tous les bogues trouvés par Surma.

Le Web, en tant que plate-forme de distribution, a tellement de sens pour des expériences de ce type que je pense que ce serait une négligence de notre part de ne pas le faire, mais les deux groupes de problèmes ci-dessus me poussent à remettre en question le besoin à long terme de mettre en œuvre toutes les fonctionnalités de la plate-forme Web en mode natif, lorsque nous pouvions implémenter de bonnes solutions dans un package livré avec les fonctionnalités de la plate-forme telles que WebGL, WASM et, à l'avenir, le processeur graphique Web.

Quoi qu'il en soit, j'aime le fait que nous puissions le faire sur le Web et je suis impatient de voir les sites expédiés avec eux.

About Me: Paul Kinlan

I lead the Chrome Developer Relations team at Google.

We want people to have the best experience possible on the web without having to install a native app or produce content in a walled garden.

Our team tries to make it easier for developers to build on the web by supporting every Chrome release, creating great content to support developers on web.dev, contributing to MDN, helping to improve browser compatibility, and some of the best developer tools like Lighthouse, Workbox, Squoosh to name just a few.