PROJEKT

AI měnič účesů pro virtuální náhled účesu

Vývoj softwaru na míru, Skenování obličeje, Živé AR z kamery, AI doporučení účesů, Virtuální vyzkoušení, Vývoj mobilní aplikace, Vývoj webové aplikace

  • Obor: Kosmetické služby
  • Spojené království Lokalita: Spojené království
  • Doba dodání: 10 týdny
  • Technologie: JavaScript / TypeScript (Node.js), Python
3 měsíců

Tento kosmetický salon pomáhá klientům vybírat účesy před návštěvou, ale písemný popis ani statický obrázek neukáže, jak účes sedí na skutečném obličeji. AI měnič účesů přijme selfie, nahranou fotografii nebo živý obraz z kamery a vrátí náhled účesu se zachovanými rysy obličeje uživatele. Stylista i klient mohou porovnávat možnosti, zobrazit živý efekt kamery a uložit vybraný snímek pro další konzultaci.

Shrnutí

Problém

Salon potřebuje srozumitelnější způsob, jak klientům před návštěvou ukázat, jak mohou různé účesy vypadat.

Řešení

Řešením se stala aplikace pro skenování obličeje a virtuální vyzkoušení účesů ze selfie, nahraných fotografií a živého obrazu z kamery.

Výsledek

Software má salonu pomoci zvýšit zájem o stylingové služby díky názornějším odpovědím před rozhodnutím.

Příběh klienta

Klientem je kosmetický salon ze Spojeného království. Pracuje s lidmi, kteří chtějí před návštěvou porovnat možnosti účesů.

Salon potřebuje zobrazovat účesy ze selfie, nahrané fotografie nebo živého obrazu z kamery. Řešení podporuje klienty i stylisty při výběru účesu.

Požadavek byl jednoduchý: přijímat několik typů obrazových a kamerových vstupů, sledovat rysy obličeje, poskytovat náhledy účesů v reálném čase a vytvářet snímky se zachovaným vzhledem klienta.

Řešení bylo postaveno na krátké cestě od skenování obličeje přes výběr účesu a živý náhled až po doporučení a uložený výsledek. Zážitek podporuje salonní stylisty i klienty.

Klient požadoval

  1. Přijímat selfie, nahrané soubory, živý obraz z kamery a údaje o vzhledu.
  2. Pomocí AI sledovat obličeje, rysy obličeje, tělesné atributy nebo ruce.
  3. Zobrazovat AR náhledy kosmetických efektů a účesů v reálném čase.
  4. Vytvářet snímky, kompozice, avatary nebo náhledy uživatele.

Proč nestačil hotový software

Hotové platformy rozšířené reality vkládají virtuální objekty do obrazu kamery, zatímco obecná řešení virtuálního vyzkoušení se zaměřují na generované snímky. Obecný systém porovnávání obličejů sice obličeje porovná, ale nespojuje přenos účesu, zachování rysů obličeje, živé náhledy a doporučení účesů do jednoho salonního prostředí.

Přehled projektu

Řešení bylo navrženo jako responzivní prohlížečová aplikace s mobilní verzí pro iOS a Android. Přehledná úvodní obrazovka přijímá sken z kamery nebo nahranou selfie a před spuštěním náhledu zobrazí katalog účesů.

Pro analýzu obličeje slouží skenování obličeje a obličejové body jako základ pro zarovnání. Živý náhled umístí vybraný účes na sledovaný obličej a zároveň zachová jeho rysy i odstín pleti ve zpracovaném obrazu.

Obrazovka s doporučeními umožňuje porovnávat účesy podle fotografie obličeje uživatele. Karty doporučení, náhledy, aplikovaný náhled a vysvětlení propojují volbu s jeho skutečným vzhledem.

Závěrečná obrazovka soustředí vybraný náhled na jedno místo pro pořízení snímku, stažení nebo sdílení. Modulární struktura ponechává prostor pro budoucí doporučení účesů, katalogy a administrativní propojení.

Dodané klíčové funkce

  • Selfie, nahrání fotografie a živý vstup z kamery
  • Skenování obličeje s naváděním sledování
  • Živý překryv účesu na sledovaném obličeji
  • AI doporučení účesů
  • Extrahování rysů obličeje pro párování stylu
  • Zachování rysů obličeje a odstínu pleti
  • Katalog účesů a výběr stylu
  • Pořízení snímku obrazovky
  • Obrázky ke stažení a sdílení

Lze přidat

+ Nahrávání krátkých videí + Úprava videa + Přenos účesu mezi snímky obličeje + Kosmetické překryvy + Propojení s katalogem účesů + Administrativní nástroje

Kdo další může toto řešení využít

Tyto firmy řeší podobný úkol spojený s vizuálním výběrem a stejné řešení lze přizpůsobit jejich produktům, stylům a cestě zákazníka.

Módní a stylingová služba

Úkol Doporučuje oblečení, barvy, doplňky nebo kompletní vzhled podle atributů a preferencí uživatele.
Jak řešení pomáhá Řešení může propojit analýzu obličeje či vzhledu s vizuálními doporučeními a náhledy ke sdílení.

Prodejce brýlí, nehtové nebo vlasové studio

Úkol Potřebuje zákazníkům před nákupem nebo ošetřením ukázat, jak může produkt či styl vypadat.
Jak řešení pomáhá Stejný základ kamery a sledování obličeje může zobrazovat virtuální náhledy vybraných produktů nebo stylů.

Módní prodejce

Úkol Potřebuje vizuální obsah vytvořený AI nebo založený na avatarech bez fyzického focení.
Jak řešení pomáhá Řešení může vytvářet náhledy podle vzhledu a pořizovat vizuální obsah pro použití směrem k zákazníkům.

Technologický stack

JavaScript / TypeScript (Node.js)

Webová a mobilní aplikační vrstva

Tato jazyková rodina podporuje prohlížečové rozhraní a multiplatformní mobilní aplikaci.

Python

Zpracování strojového učení a obrazu

Python podporuje knihovny pro analýzu obličeje a strojové učení použité v projektu.

vue

Responzivní webové rozhraní

vue (framework pro tvorbu moderních webových rozhraní) strukturuje prostředí prohlížeče.

react

Komponenty uživatelského rozhraní

react (knihovna pro tvorbu uživatelských rozhraní) podporuje potřebné komponenty rozhraní.

deepar

AR efekty v prohlížeči

deepar (webové SDK pro kamerové efekty a rozšířenou realitu) poskytuje živé překryvy účesů a kosmetických efektů.

opencv

Zpracování počítačového vidění

opencv (knihovna počítačového vidění) podporuje zpracování obrázků a kamerových snímků.

tensorflow

Modely strojového učení

tensorflow (open-source framework strojového učení) podporuje zpracování obrázků a rysů pomocí AI.

mediapipe

Řešení strojového učení

mediapipe (sada nástrojů pro tvorbu řešení strojového učení na mobilních zařízeních, edge, v cloudu a na webu) podporuje zpracování obličeje v projektu.

dlib

Analýza rysů obličeje

dlib (sada nástrojů strojového učení a počítačového vidění) podporuje zpracování rysů obličeje.

@capacitor/ios and @capacitor/android

Balení pro iOS a Android

Capacitor balí JavaScriptové a webové prostředí jako mobilní aplikace pro iOS a Android.

Integrace

Device camera

Aplikace přijímá živé video z kamery a pořizuje snímky pro skenování obličeje a náhledy.

iOS and Android

Capacitor propojuje aplikaci s podporovanými mobilními zařízeními a jejich kamerami.

Web browser

Responzivní verze v prohlížeči zpracovává nahrané selfie a živý obraz z kamery.

Výsledek

Přehledný začátek každého výběru účesu

První obrazovka zjednodušuje výchozí bod klienta salonu: sken z kamery nebo nahraná selfie vede do katalogu účesů. Obrazovka obsahuje navádění při skenování obličeje a náhledovou dlaždici vybraného stylu.

Jak to funguje

  1. Kamera poskytuje živý obraz nebo aplikace přijme nahranou selfie.
  2. Modul skenování obličeje načte obličej a zobrazí stav skenování.
  3. Katalog účesů poskytne vzorky a vybraný styl se zobrazí v náhledové dlaždici.
  • Vstup z kamery a fotografie
  • Navádění při skenování obličeje
  • Výběr účesu
Naskenujte obličej a vyberte účes

Naskenujte obličej a vyberte účes

Funkce na této obrazovce
Pořízení snímků pomocí kamery Skenování obličeje AI doporučení účesu

Živý náhled zarovnaný se sledovaným obličejem

Druhá obrazovka promění vybraný styl v kamerový náhled v reálném čase. Body obličeje nebo obličejová síť udržují překryv účesu zarovnaný při změnách obrazu kamery.

Náhled je určen k rychlému porovnání a ve stejném zobrazení nabízí výběr stylu, resetování a pořízení snímku.

Jak to funguje

  1. Živý obraz z kamery poskytuje aktuální snímek.
  2. deepar (SDK pro webové AR efekty) a modul sledování obličeje určují polohu obličeje a jeho body.
  3. Vybraný účes se přenese na sledovaný obličej, přičemž rysy obličeje zůstanou ve zpracovaném náhledu zachovány.
  • Snímek se sledovaným obličejem
  • Aplikovaný překryv účesu
  • Ovládání pořízení snímku a resetování
Prohlédněte si živý náhled účesu

Prohlédněte si živý náhled účesu

Funkce na této obrazovce
Detekce obličeje v reálném čase Zpracování obrázků v reálném čase Přenos účesů Zachování rysů obličeje

Doporučení propojená s obličejem uživatele

Obrazovka s doporučeními zobrazí možnosti účesů vytvořené podle fotografie obličeje uživatele. Karty, náhledy a aplikovaný náhled umožní klientovi salonu porovnat styly.

Oblast s vysvětlením zobrazí zdůvodnění doporučení vedle aplikovaného náhledu.

Jak to funguje

  1. Nahraná nebo pořízená fotografie obličeje slouží jako vstup pro extrakci rysů.
  2. Modul doporučení analyzuje rysy obličeje a vrátí doporučené účesy.
  3. Aplikovaný náhled účesu a vysvětlení doporučení zobrazí vybraný výsledek.
  • Náhled obličeje
  • Karty doporučení
  • Náhledy účesů
Porovnejte doporučené účesy

Porovnejte doporučené účesy

Funkce na této obrazovce
Extrakce rysů obličeje AI doporučení účesu Vysvětlení doporučení

Uložený výsledek pro další konzultaci

Závěrečná obrazovka promění vybraný náhled ve obrázek ke sdílení. Stylista nebo klient může pořídit snímek obrazovky, připravit krátký záznam, stáhnout výsledný obrázek nebo jej sdílet.

Obrazovka poskytuje vybraný náhled ke stažení nebo sdílení.

Jak to funguje

  1. Vygenerovaný náhled účesu se zobrazí jako konečný náhled.
  2. Modul pro záznam vytvoří snímek obrazovky nebo krátké upravené video.
  3. Aplikace poskytne výsledný obrázek ke stažení a sdílení.
  • Pořízení snímku obrazovky
  • Ovládání nahrávání videa
  • Stažení a sdílení
Uložte a sdílejte výsledek účesu

Uložte a sdílejte výsledek účesu

Funkce na této obrazovce
Pořizování snímků obrazovky

Co řešení přináší

Díky tomuto řešení může salon:

  • Ukázat možnosti účesů na vlastním obličeji klienta
  • Nabídnout živé náhledy z kamery během konzultace stylingu
  • Porovnat účesy doporučené AI podle fotografie obličeje
  • Zachovat rysy obličeje ve vygenerovaných náhledech účesů
  • Ukládat obrázky ke stažení nebo sdílení
  • Vytvořit názornější cestu k rozhodnutí o stylingové službě

Na závěr

Řešení má odstranit nejistotu na cestě od vzhledu klienta k rozhodnutí o účesu a podpořit větší zájem o stylingové služby.

ČASTÉ DOTAZY

Uvažujete o vytvoření podobného systému? Přečtěte si odpovědi níže a zjistěte, jak do sebe zapadají hlavní produktová rozhodnutí.