PROGETTO

Cambia acconciatura con l'AI per anteprime virtuali

Sviluppo software personalizzato, Scansione del volto, AR con fotocamera dal vivo, Suggerimenti AI per acconciature, Virtual try-on, Sviluppo di app mobile, Sviluppo di applicazioni web

  • Settore: Servizi di bellezza
  • Regno Unito Località: Regno Unito
  • Tempi di consegna: 10 settimane
  • Tecnologie: JavaScript / TypeScript (Node.js), Python
3 mesi

Questo salone di bellezza aiuta i clienti a scegliere l'acconciatura prima dell'appuntamento, ma una descrizione scritta o un'immagine statica non mostrano come lo stile si adatti a un volto reale. Il cambia-acconciatura AI acquisisce un selfie, una foto caricata o un video dalla fotocamera e restituisce un'anteprima dell'acconciatura mantenendo i tratti del volto dell'utente. Stylist e cliente possono confrontare le opzioni, visualizzare un effetto dalla fotocamera dal vivo e salvare un'immagine da discutere.

Riepilogo

Problema

Il salone ha bisogno di un modo più chiaro per mostrare ai clienti come potrebbero apparire diverse acconciature prima dell'appuntamento.

Soluzione

La soluzione è diventata un'applicazione per la scansione del volto e il virtual try-on delle acconciature, con supporto per selfie, foto caricate e video dalla fotocamera.

Risultato

Il software è pensato per aiutare il salone ad aumentare l'interesse verso i servizi di styling offrendo risposte più visive prima della decisione.

Storia del cliente

Il cliente è un salone di bellezza del Regno Unito. Lavora con persone che desiderano confrontare diverse acconciature prima dell'appuntamento.

Il salone deve mostrare gli stili a partire da un selfie, una foto caricata o un video dalla fotocamera. La soluzione supporta clienti e stylist nella scelta dell'acconciatura.

La richiesta era semplice: accettare diversi input da immagini e fotocamera, tracciare i tratti del volto, offrire anteprime delle acconciature in tempo reale e generare immagini che preservassero l'aspetto del cliente.

La soluzione è stata costruita attorno a un percorso breve, dalla scansione del volto alla selezione dello stile, all'anteprima dal vivo, ai suggerimenti e al salvataggio del risultato. L'esperienza supporta stylist e clienti del salone.

Il cliente ha richiesto

  1. Accettare selfie, caricamenti, video dalla fotocamera e dati sull'aspetto.
  2. Tracciare volti, tratti facciali, attributi corporei o mani con l'AI.
  3. Mostrare anteprime AR in tempo reale di effetti di bellezza e acconciature.
  4. Generare immagini, composizioni, avatar o anteprime dell'utente.

Perché il software pronto all'uso non era adatto

Le piattaforme di realtà aumentata pronte all'uso inseriscono oggetti virtuali nella visuale della fotocamera, mentre i prodotti generici di virtual try-on si concentrano sulle immagini generate. Un sistema generico di corrispondenza dei volti confronta i visi, ma non combina trasferimento dell'acconciatura, conservazione dei tratti facciali, anteprime dal vivo e suggerimenti di stile in un'unica esperienza per il salone.

Panoramica del progetto

La soluzione è stata progettata per un'esperienza browser responsive, con un percorso mobile per iOS e Android. Una schermata iniziale chiara accetta una scansione tramite fotocamera o un selfie caricato e mostra un catalogo di acconciature prima di avviare l'anteprima.

Per gestire l'analisi del volto, la scansione facciale e i punti di riferimento del viso sono stati utilizzati come base per l'allineamento. L'anteprima dal vivo sovrappone l'acconciatura selezionata al volto tracciato, preservando i tratti del viso e il tono della pelle nella rappresentazione elaborata.

La schermata dei suggerimenti è stata progettata per confrontare gli stili in base all'immagine del volto dell'utente. Schede di suggerimento, miniature, un'anteprima applicata e un'area esplicativa mantengono la scelta collegata all'aspetto reale dell'utente.

La schermata finale riunisce l'anteprima selezionata per acquisirla, scaricarla o condividerla. La struttura modulare lascia inoltre spazio a futuri suggerimenti di stile, cataloghi e integrazioni amministrative.

Funzionalità principali realizzate

  • Selfie, caricamento di foto e input dalla fotocamera dal vivo
  • Scansione del volto con guida al tracciamento
  • Sovrapposizione dal vivo dell'acconciatura sul volto tracciato
  • Suggerimenti AI per acconciature
  • Estrazione dei tratti facciali per l'abbinamento dello stile
  • Conservazione dei tratti facciali e del tono della pelle
  • Catalogo delle acconciature e selettore degli stili
  • Acquisizione di screenshot
  • Immagini finali scaricabili e condivisibili

Funzionalità aggiungibili

+ Registrazione di brevi video + Montaggio video + Trasferimento dell'acconciatura tra immagini del volto + Sovrapposizioni beauty + Integrazione con il catalogo degli stili + Strumenti amministrativi

Chi altro può usare questa soluzione

Queste attività hanno un'esigenza simile di scelta visiva e la stessa soluzione può essere adattata ai loro prodotti, stili e percorsi cliente.

Un servizio di moda e styling personale

Esigenza Consiglia outfit, colori, accessori o look completi in base agli attributi e alle preferenze dell'utente.
Come aiuta la soluzione La soluzione può collegare l'analisi del volto o dell'aspetto a suggerimenti visivi e anteprime condivisibili.

Un'attività di occhiali, cura delle unghie o capelli

Esigenza Deve mostrare ai clienti come potrebbe apparire un prodotto o uno stile prima dell'acquisto o del trattamento.
Come aiuta la soluzione La stessa base di fotocamera e tracciamento del volto può offrire anteprime di virtual try-on per prodotti o stili selezionati.

Un rivenditore di moda

Esigenza Ha bisogno di contenuti visivi generati dall'AI o basati su avatar senza servizi fotografici fisici.
Come aiuta la soluzione La soluzione può generare anteprime basate sull'aspetto e acquisire contenuti visivi destinati ai clienti.

Stack tecnologico

JavaScript / TypeScript (Node.js)

Livello applicativo web e mobile

Questa famiglia di linguaggi supporta l'interfaccia browser e l'applicazione mobile multipiattaforma.

Python

Elaborazione di machine learning e visione

Python supporta le librerie di analisi facciale e machine learning utilizzate nel progetto.

vue

Interfaccia web responsive

vue (un framework per la creazione di interfacce web moderne) struttura l'esperienza browser.

react

Componenti dell'interfaccia utente

react (una libreria per la creazione di interfacce utente) supporta i componenti dell'interfaccia dove necessario.

deepar

Effetti AR nel browser

deepar (un SDK web per effetti della fotocamera e realtà aumentata) fornisce sovrapposizioni dal vivo per acconciature ed effetti beauty.

opencv

Elaborazione di computer vision

opencv (una libreria di computer vision) supporta l'elaborazione delle immagini e dei fotogrammi della fotocamera.

tensorflow

Modelli di machine learning

tensorflow (un framework open source di machine learning) supporta l'elaborazione di immagini e tratti basata sull'AI.

mediapipe

Soluzioni di machine learning

mediapipe (un toolkit per creare soluzioni di machine learning su mobile, edge, cloud e web) supporta l'elaborazione facciale del progetto.

dlib

Analisi dei tratti facciali

dlib (un toolkit di machine learning e computer vision) supporta l'elaborazione dei tratti facciali.

@capacitor/ios and @capacitor/android

Pacchettizzazione per iOS e Android

Capacitor impacchetta l'esperienza JavaScript e web come applicazioni mobile per iOS e Android.

Integrazioni

Device camera

L'applicazione riceve video dalla fotocamera dal vivo e acquisisce immagini per la scansione del volto e le anteprime.

iOS and Android

Capacitor collega l'applicazione ai dispositivi mobile supportati e alle relative fotocamere.

Web browser

La versione browser responsive elabora selfie caricati e video dalla fotocamera dal vivo.

Il risultato

Un punto di partenza chiaro per ogni scelta di acconciatura

La prima schermata mantiene semplice il punto di partenza del cliente: una scansione tramite fotocamera o un selfie caricato conduce al catalogo delle acconciature. La schermata include una guida alla scansione del volto e un riquadro di anteprima dello stile selezionato.

Come funziona

  1. La fotocamera fornisce un video dal vivo oppure l'applicazione riceve un selfie caricato.
  2. Il modulo di scansione del volto legge il viso e mostra lo stato della scansione.
  3. Il catalogo delle acconciature fornisce esempi e lo stile selezionato appare nel riquadro di anteprima.
  • Input da fotocamera e foto
  • Guida alla scansione del volto
  • Selezione dell'acconciatura
Scansiona il volto e seleziona un'acconciatura

Scansiona il volto e seleziona un'acconciatura

Funzioni di questa schermata
Acquisizione di immagini tramite fotocamera Scansione del volto Suggerimenti AI per acconciature

Un'anteprima dal vivo allineata al volto tracciato

La seconda schermata trasforma lo stile scelto in un' anteprima dalla fotocamera in tempo reale. I punti di riferimento del volto o una mesh facciale mantengono allineata la sovrapposizione dell'acconciatura mentre l'immagine della fotocamera cambia.

L'anteprima è pensata per confronti rapidi, con un selettore dello stile, un comando di ripristino e un'opzione di acquisizione nella stessa vista.

Come funziona

  1. Il video della fotocamera dal vivo fornisce l'immagine corrente.
  2. deepar (un SDK web per effetti AR) e il modulo di tracciamento del volto identificano la posizione e i punti di riferimento del viso.
  3. L'acconciatura selezionata viene trasferita sul volto tracciato, mantenendo rappresentati i tratti facciali nel fotogramma elaborato dell'anteprima.
  • Fotogramma con tracciamento del volto
  • Sovrapposizione dell'acconciatura applicata
  • Comandi di acquisizione e ripristino
Visualizza l'anteprima dal vivo dell'acconciatura

Visualizza l'anteprima dal vivo dell'acconciatura

Funzioni di questa schermata
Rilevamento del volto in tempo reale Elaborazione delle immagini in tempo reale Trasferimento delle acconciature Conservazione dei tratti facciali

Suggerimenti collegati al volto dell'utente

La schermata dei suggerimenti presenta opzioni di acconciatura generate dall'immagine del volto dell'utente. Schede, miniature e un'anteprima applicata consentono al cliente del salone di confrontare gli stili.

Un'area esplicativa presenta il motivo del suggerimento accanto all'anteprima applicata.

Come funziona

  1. L'immagine del volto caricata o acquisita fornisce l'input per l'estrazione dei tratti.
  2. Il modulo di suggerimento analizza i tratti facciali e restituisce le acconciature consigliate.
  3. L'anteprima dell'acconciatura applicata e la spiegazione del suggerimento mostrano il risultato selezionato.
  • Anteprima del volto
  • Schede dei suggerimenti
  • Miniature delle acconciature
Confronta le acconciature consigliate

Confronta le acconciature consigliate

Funzioni di questa schermata
Estrazione dei tratti facciali Suggerimenti AI per acconciature Spiegazione dei suggerimenti

Un risultato salvato per la conversazione successiva

La schermata finale trasforma un'anteprima selezionata in un' immagine condivisibile. Lo stylist o il cliente possono acquisire uno screenshot, preparare una breve registrazione, scaricare l'immagine finale o condividerla.

La schermata fornisce l'anteprima selezionata per il download o la condivisione.

Come funziona

  1. L'immagine generata dell'anteprima dell'acconciatura appare come anteprima finale.
  2. Il modulo di acquisizione crea uno screenshot o un breve video modificato.
  3. L'applicazione fornisce un'immagine finale scaricabile e condivisibile.
  • Acquisizione di screenshot
  • Comandi per la registrazione video
  • Download e condivisione
Salva e condividi il risultato dell'acconciatura

Salva e condividi il risultato dell'acconciatura

Funzioni di questa schermata
Acquisizione di screenshot

Cosa offre la soluzione

Con questa soluzione, il salone può:

  • Mostrare le acconciature sul volto reale del cliente
  • Offrire anteprime dalla fotocamera dal vivo durante la consulenza di styling
  • Confrontare acconciature consigliate dall'AI a partire da un'immagine del volto
  • Preservare i tratti facciali nelle anteprime generate delle acconciature
  • Salvare immagini per il download o la condivisione
  • Creare un percorso più visivo verso la scelta dei servizi di styling

In conclusione

In conclusione, la soluzione è stata creata per ridurre l'incertezza nel percorso dall'aspetto del cliente alla scelta dell'acconciatura e sostenere un maggiore interesse verso i servizi di styling.

FAQ

Stai pensando di creare un sistema simile? Leggi le risposte qui sotto per capire come si integrano le principali decisioni di prodotto.