PROJET

Changeur de coiffure IA pour prévisualiser virtuellement des coiffures

Développement logiciel sur mesure, Scan facial, Réalité augmentée caméra en direct, Recommandations de coiffures par IA, Essayage virtuel, Développement d'applications mobiles, Développement d'applications web

  • Secteur: Services de beauté
  • Royaume-Uni Localisation: Royaume-Uni
  • Délai de livraison: 10 semaines
  • Technologies: JavaScript / TypeScript (Node.js), Python
3 mois

Ce salon de beauté aide ses clients à choisir une coiffure avant leur rendez-vous, mais une description écrite ou une image statique ne montre pas comment un style s'adapte à un vrai visage. Le changeur de coiffure IA utilise un selfie, une photo importée ou le flux d'une caméra en direct pour générer une prévisualisation qui conserve les traits du visage de l'utilisateur. Le styliste et le client peuvent comparer les options, voir un effet caméra en direct et enregistrer une image pour en discuter.

Résumé

Problème

Le salon a besoin d'un moyen plus clair de montrer aux clients à quoi pourraient ressembler différentes coiffures avant leur rendez-vous.

Solution

La solution est devenue une application de scan facial et d'essayage virtuel de coiffures pour selfies, photos importées et flux caméra en direct.

Résultat

Le logiciel aide le salon à susciter davantage d'intérêt pour ses services de coiffure grâce à des réponses plus visuelles avant la prise de décision.

Histoire du client

Le client est un salon de beauté du Royaume-Uni. Il accompagne des clients qui souhaitent comparer des coiffures avant leur rendez-vous.

Le salon doit présenter des styles à partir d'un selfie, d'une photo importée ou d'un flux caméra en direct. La solution accompagne les clients et les stylistes lors du choix de la coiffure.

La demande était simple : accepter plusieurs sources d'images et de caméra, suivre les traits du visage, fournir des prévisualisations de coiffures en temps réel et générer des images qui préservent l'apparence du client.

La solution a été conçue autour d'un parcours court, du scan facial à la sélection du style, à la prévisualisation en direct, aux recommandations et à l'enregistrement du résultat. L'expérience accompagne les stylistes et les clients du salon.

Le client demandait

  1. Accepter les selfies, les importations, les flux caméra en direct et les données d'apparence.
  2. Suivre les visages, les traits du visage, les attributs corporels ou les mains avec l'IA.
  3. Afficher en temps réel des prévisualisations AR d'effets beauté et de coiffures.
  4. Générer des images, compositions, avatars ou prévisualisations de l'utilisateur.

Pourquoi les logiciels prêts à l'emploi ne convenaient pas

Les plateformes de réalité augmentée prêtes à l'emploi placent des objets virtuels dans une vue caméra, tandis que les produits génériques d'essayage virtuel se concentrent sur les images générées. Un système générique de comparaison faciale compare les visages, mais ne réunit pas le transfert de coiffure, la préservation des traits, les prévisualisations en direct et les recommandations de coiffure dans une seule expérience pour salon.

Présentation du projet

La solution a été conçue autour d'une expérience navigateur responsive, avec une version mobile pour iOS et Android. Un écran d'accueil clair accepte un scan caméra ou un selfie importé, puis présente un catalogue de coiffures avant le lancement de la prévisualisation.

Pour analyser le visage, le scan facial et les points de repère du visage servent de base à l'alignement. La prévisualisation en direct superpose la coiffure sélectionnée sur le visage suivi, tout en préservant les traits et le teint dans l'image traitée.

L'écran de recommandations permet de comparer les styles à partir de l'image du visage de l'utilisateur. Les cartes de recommandations, les miniatures, la prévisualisation appliquée et la zone d'explication relient le choix à l'apparence réelle de l'utilisateur.

L'écran final rassemble la prévisualisation sélectionnée pour la capturer, la télécharger ou la partager. Sa structure modulaire permet également d'ajouter ultérieurement des recommandations de coiffure, des catalogues et des connexions administratives.

Fonctionnalités clés livrées

  • Selfie, importation de photo et entrée caméra en direct
  • Scan facial avec indications de suivi
  • Superposition en direct d'une coiffure sur un visage suivi
  • Recommandations de coiffures par IA
  • Extraction des traits du visage pour faire correspondre les styles
  • Préservation des traits du visage et du teint
  • Catalogue de coiffures et sélecteur de styles
  • Capture d'écran
  • Images finales téléchargeables et partageables

Fonctionnalités ajoutables

+ Enregistrement de courtes vidéos + Montage vidéo + Transfert de coiffure entre images de visages + Superpositions beauté + Connexion à un catalogue de coiffures + Outils administratifs

Qui d'autre peut utiliser cette solution

Ces entreprises rencontrent un besoin similaire de choix visuel. La même solution peut être adaptée à leurs produits, styles et parcours client.

Un service de mode et de conseil en style

Besoin La solution recommande des tenues, couleurs, accessoires ou looks complets à partir des attributs et préférences de l'utilisateur.
Comment la solution aide La solution peut relier l'analyse du visage ou de l'apparence à des recommandations visuelles et à des prévisualisations partageables.

Une entreprise d'optique, de manucure ou de coiffure

Besoin L'entreprise doit montrer aux clients à quoi un produit ou un style pourrait ressembler avant l'achat ou le traitement.
Comment la solution aide La même base de caméra et de suivi facial peut présenter des prévisualisations d'essayage virtuel pour les produits ou styles sélectionnés.

Un distributeur de mode

Besoin L'entreprise a besoin de contenu visuel généré par IA ou basé sur des avatars, sans séance photo physique.
Comment la solution aide La solution peut générer des prévisualisations basées sur l'apparence et capturer du contenu visuel destiné aux clients.

Stack technologique

JavaScript / TypeScript (Node.js)

Couche applicative web et mobile

Cette famille de langages prend en charge l'interface navigateur et l'application mobile multiplateforme.

Python

Traitement par apprentissage automatique et vision

Python prend en charge les bibliothèques d'analyse faciale et d'apprentissage automatique utilisées dans le projet.

vue

Interface web responsive

vue (un framework pour créer des interfaces web modernes) structure l'expérience navigateur.

react

Composants d'interface utilisateur

react (une bibliothèque pour créer des interfaces utilisateur) prend en charge les composants d'interface lorsque nécessaire.

deepar

Effets AR dans le navigateur

deepar (un SDK web pour les effets caméra et la réalité augmentée) fournit les superpositions de coiffures et d'effets beauté en direct.

opencv

Traitement par vision artificielle

opencv (une bibliothèque de vision artificielle) prend en charge le traitement des images et des images caméra.

tensorflow

Modèles d'apprentissage automatique

tensorflow (un framework d'apprentissage automatique open source) prend en charge le traitement d'images et de caractéristiques basé sur l'IA.

mediapipe

Solutions d'apprentissage automatique

mediapipe (une boîte à outils pour créer des solutions d'apprentissage automatique sur mobile, périphérie, cloud et web) prend en charge le traitement facial du projet.

dlib

Analyse des traits du visage

dlib (une boîte à outils d'apprentissage automatique et de vision artificielle) prend en charge le traitement des traits du visage.

@capacitor/ios and @capacitor/android

empaquetage pour iOS et Android

Capacitor transforme l'expérience JavaScript et web en applications mobiles pour iOS et Android.

Intégrations

Device camera

L'application reçoit la vidéo de la caméra en direct et capture des images pour le scan facial et les prévisualisations.

iOS and Android

Capacitor connecte l'application aux appareils mobiles compatibles et à leurs caméras.

Web browser

La version navigateur responsive traite les selfies importés et les flux caméra en direct.

Le résultat

Un point de départ clair pour chaque choix de coiffure

Le premier écran simplifie le point de départ du client : un scan caméra ou un selfie importé mène au catalogue de coiffures. L'écran comprend des indications de scan facial et une vignette de prévisualisation du style sélectionné.

Fonctionnement

  1. La caméra fournit un flux en direct ou l'application reçoit un selfie importé.
  2. Le module de scan facial lit le visage et affiche l'état du scan.
  3. Le catalogue de coiffures fournit des exemples et le style sélectionné apparaît dans la vignette de prévisualisation.
  • Entrée caméra et photo
  • Indications de scan facial
  • Sélection de coiffure
Scanner un visage et sélectionner une coiffure

Scanner un visage et sélectionner une coiffure

Fonctions de cet écran
Capturer des images avec la caméra Scan facial Recommandation de coiffure par IA

Une prévisualisation en direct alignée sur le visage suivi

Le deuxième écran transforme le style choisi en prévisualisation caméra en temps réel. Les points de repère ou le maillage facial maintiennent la superposition alignée lorsque l'image caméra change.

La prévisualisation facilite la comparaison rapide, avec un sélecteur de styles, une commande de réinitialisation et une option de capture dans la même vue.

Fonctionnement

  1. Le flux caméra en direct fournit l'image actuelle.
  2. deepar (un SDK web d'effets AR) et le module de suivi facial identifient la position et les points de repère du visage.
  3. La coiffure sélectionnée est transférée sur le visage suivi, tandis que les traits du visage restent représentés dans l'image prévisualisée.
  • Cadre de suivi facial
  • Superposition de coiffure appliquée
  • Commandes de capture et de réinitialisation
Voir la prévisualisation de la coiffure en direct

Voir la prévisualisation de la coiffure en direct

Fonctions de cet écran
Détection faciale en temps réel Traiter les images en temps réel Transférer des coiffures Préserver les traits du visage

Des recommandations reliées au visage de l'utilisateur

L'écran de recommandations présente des options de coiffure générées à partir de l'image du visage de l'utilisateur. Les cartes, miniatures et prévisualisations appliquées permettent au client de comparer les styles.

Une zone d'explication présente la recommandation à côté de la prévisualisation appliquée.

Fonctionnement

  1. L'image du visage importée ou capturée sert de base à l'extraction des caractéristiques.
  2. Le module de recommandation analyse les traits du visage et renvoie des coiffures recommandées.
  3. La prévisualisation de la coiffure appliquée et l'explication de la recommandation affichent le résultat sélectionné.
  • Prévisualisation du visage
  • Cartes de recommandations
  • Miniatures de coiffures
Comparer les coiffures recommandées

Comparer les coiffures recommandées

Fonctions de cet écran
Extraction des traits du visage Recommandation de coiffure par IA Explication de la recommandation

Un résultat enregistré pour la prochaine discussion

L'écran final transforme la prévisualisation sélectionnée en image partageable. Le styliste ou le client peut capturer une capture d'écran, préparer un court enregistrement, télécharger l'image finale ou la partager.

L'écran fournit la prévisualisation sélectionnée pour le téléchargement ou le partage.

Fonctionnement

  1. L'image générée de la prévisualisation de coiffure apparaît comme prévisualisation finale.
  2. Le module de capture crée une capture d'écran ou une courte vidéo montée.
  3. L'application fournit une image finale téléchargeable et partageable.
  • Capture d'écran
  • Commandes d'enregistrement vidéo
  • Téléchargement et partage
Enregistrer et partager le résultat

Enregistrer et partager le résultat

Fonctions de cet écran
Capturer des captures d'écran

Ce que la solution apporte

Avec cette solution, le salon peut :

  • Présenter des coiffures sur le visage du client
  • Proposer des prévisualisations caméra en direct pendant une discussion sur le style
  • Comparer des coiffures recommandées par IA à partir d'une image du visage
  • Préserver les traits du visage dans les prévisualisations générées
  • Enregistrer des images pour les télécharger ou les partager
  • Créer un parcours plus visuel vers la décision concernant les services de coiffure

En conclusion

En conclusion, la solution a été conçue pour réduire l'incertitude entre l'apparence du client et le choix d'une coiffure, tout en suscitant davantage d'intérêt pour les services de coiffure.

FAQ

Vous envisagez de créer un système similaire ? Consultez les réponses ci-dessous pour comprendre comment les principales décisions produit s'articulent.