Case studies

Case study · AI beauty & wellness

Try My StyleFlorian Hurel Hair Couture

In-salon AI skin & scalp diagnostics on premium kiosk hardware.

Computer-vision analysis, structured OpenAI inference, gpt-image-2 visual overlays, hyper-personalised recommendations, React-PDF reports, and WhatsApp delivery—scoped per salon with a superadmin analytics layer across nine locations.

Core stack

Next.jsDjangoOpenAIUploadThing (CDN)React-PDFWhatsApp
Premium salon and hair care context for Try My Style
Hero visualKiosk + salon photography

01

Executive summary

The Florian Hurel Hair Couture AI Consultation Platform (Try My Style) is a full-stack, in-salon AI experience for personalised skin and scalp diagnostics at point-of-service. It replaces subjective consultations with computer-vision analysis, structured AI inference, and hyper-personalised product recommendations on a premium kiosk-grade touchscreen across Florian Hurel's salon network in India.

This narrative documents product intent, architecture, engineering decisions, operational workflows, and the roadmap to scale the platform to enterprise grade.

02

Business problem

Premium salons often face a gap between client aspiration and consultant capability:

  • Skin and scalp assessments are subjective and consultant-dependent
  • Recommendations lack scientific grounding visible to the client
  • Diagnostic data is not captured or reused across visits
  • No unified interface for consultation quality or product performance across the network
  • Post-consultation engagement is weak without a report or follow-up mechanism

Try My Style addresses these gaps with one AI-driven consultation layer inside each salon.

03

Product vision

The platform is designed to deliver:

  • Clinically credible, camera-based skin and scalp analysis in under two minutes
  • AI-personalised product and treatment recommendations grounded in diagnostic data
  • Branded, shareable PDF reports via WhatsApp as a post-visit touchpoint
  • Premium visual AI overlays that make insights tangible
  • A centralised superadmin analytics layer across all salon locations

04

System architecture

High-level map: the kiosk (Next.js) talks HTTPS to a JWT-gated Django REST API; analysis and image generation call OpenAI; media lands on UploadThing; reports leave via WhatsApp; analytics persist for superadmin dashboards.

Try My Style platform architectureKiosk · Next.js 14Questionnaire · camera · results · PDFDjango REST APIJWT /api · skin · scalp · adminOpenAIgpt-4o-mini · gpt-image-2UploadThingCDN mediaWhatsApp APIPDF deliveryAnalyticsSessions · salonsPostgreSQL / SQLiteper deploymentSalon-scoped JWT · structured AI outputs · CDN-backed media · client-side reports

Platform components

kiosk-app
Next.jsReactTypeScriptTailwind CSSnext-intl

Next.js 14, React, TypeScript, Tailwind CSS, next-intl — questionnaire, camera, results, cart, lead capture.

django-api
DjangoPythonPostgreSQL

Django, Python, Django REST Framework — JWT `/api`, skin/scalp/admin routes, analytics.

openai
OpenAIAxios

gpt-4o-mini (analysis + JSON Schema), gpt-image-2 (8-card skin visualisation, parallel to analysis).

media-pdf
UploadThing (CDN)React-PDFWhatsApp

UploadThing CDN for captures & AI images; React-PDF off-screen; WhatsApp API for report delivery.

Core architecture traits

  • JWT-protected API under `/api` with salon-level authentication
  • Salon-scoped data isolation — each kiosk device uses its own Bearer token
  • Stateless Django API designed for horizontal scale behind a load balancer
  • Client-side PDF via off-screen React-PDF — no server render cost per report
  • UploadThing CDN for AI-generated images and captured face photos
  • OpenAI structured output (JSON Schema) for deterministic analysis parsing
  • Superadmin dashboard with code-gated whitelist (9 authorised salon locations)

Skin analysis flow

Questionnaire → camera → parallel AI → scores → products → PDF.

Skin analysis journeyIntakeQuestionsCaptureCameraParallel AI4o + imageScores8 paramsViz8-cardTipsExpert AIProductsRankLead + PDFWhatsAppParallel analysis + gpt-image-2 visualisation from scan start

Scalp analysis flow

Frontal capture → five sections → metrics → wellness → report.

Scalp analysis journeyQuestionsProfileWalkthroughGuideFrontal3 imgsSections5× multiMetricsRadarWellnessGuideProductsAI rankReportWhatsAppFrontal → five scalp sections → quantitative metrics → treatment + tips

05

Core modules and capabilities

Skin analysis, scalp analysis, AI Look Advisor, Scalp View (microscope), and superadmin analytics—unified in one kiosk application.

skin-analysisscalp-analysisai-look-advisorscalp-viewadmin-analyticsquestionnairecamera-captureproduct-catalogcart-leadwhatsapp-reportsettings-devices

06

User journey (skin analysis)

Ten-step lifecycle from kiosk intake to WhatsApp report.

1/1001

Client at kiosk; stylist opens Skin Analysis.

2/1002

3-step questionnaire: gender, age, skin type, ingredients, concerns.

3/1003

Camera capture with oval face guide; retake before proceed.

4/1004

Proceed → AI scan; gpt-image-2 visualisation starts in parallel with gpt-4o-mini analysis.

5/1005

Eight scored parameters returned; results carousel shown.

6/1006

Next → visualisation page (image often ready due to parallel generation).

7/1007

Follow-up lifestyle questionnaire → AI Expert Tips.

8/1008

Product recommendations (catalog + AI rank, filterable) → Cart.

9/1009

Lead capture (name, phone) → PDF generated → WhatsApp delivery.

10/1010

Thank you → Feedback → Home.

07

AI visualisation engine

The skin visualisation step is the most distinctive product surface—one generative image pass aligned with structured scores.

  • Single gpt-image-2 call produces a full 8-card diagnostic overlay (1024×1536)
  • Client face photo is the edit input — identity preserved across cards
  • Colour-coded overlays per concern (e.g. oiliness, pores, redness) — diagnostic, not beautification
  • Generation starts at scan start, parallel to analysis API — cuts perceived wait
  • quality="medium" balances ~30–40s generation vs fidelity
  • UploadThing hosts the result; URL returned to the kiosk for display

Business impact

  • Premium “wow” moment that justifies in-salon AI positioning
  • Abstract scores become tangible and credible on screen
  • Clear differentiation from standard salon consultations

08

Engineering challenges solved

  • Parallel AI: gpt-image-2 visualisation + gpt-4o-mini analysis — no strictly sequential 50s wait
  • React temporal dead zone: useCallback dependency ordering fixed for stable scan flow
  • Axios 180s timeout on visualisation endpoint vs 60s global default
  • Broken-pipe / long-poll UX: heavy work starts early so the client is not blocked on one slow hop
  • Client-side React-PDF while user moves through post-result steps
  • Dual cameras: normal vs microscope device IDs in localStorage + Settings UI
  • Salon-scoped isolation: every request carries Bearer token; ORM queries scoped to salon
  • Upload-before-analyse: face image to UploadThing; URL persisted for reports and audit
  • JPEG → RGBA PNG normalisation before gpt-image-2 edit (SDK requirement)

09

Security and reliability

Implemented

  • JWT-based API authentication per salon device
  • Salon-level isolation enforced at the ORM query layer
  • Superadmin gated behind separate JWT + salon whitelist (9 access codes)
  • Session analytics decoupled from core analysis (non-blocking)
  • UploadThing for media persistence — no local disk dependency on kiosks

Recommended hardening

  • API rate limiting per salon token
  • Upload validation (type, size, malware scanning)
  • Secret rotation for OPENAI_API_KEY and UPLOADTHING_SECRET
  • OpenAI spend alerts and per-endpoint usage tracking
  • Audit log for lead capture and WhatsApp report sends
  • Retry / DLQ for failed WhatsApp deliveries

10

Scalability strategy

  • Stateless Django — scale horizontally behind a load balancer
  • UploadThing absorbs media load; no filesystem coupling
  • OpenAI calls async from the user’s perspective on the frontend
  • Admin analytics pre-filtered by allowed salon ID set
  • Client-side PDF — zero marginal server cost per report
  • ALLOWED_SALON_CODES in code — expand per deployment safely
  • Future: Celery for AI jobs, Redis catalog cache, WebSocket progress, per-salon cost dashboards

11

Product decision rationale

Why client-side PDF generation?

  • Avoids server-side PDF infrastructure cost
  • Highly dynamic content (scores, images, products, tips) composes naturally in React
  • Off-screen render means PDF is ready by lead capture

Why gpt-image-2 instead of static overlays?

  • Static art cannot cover every skin type × concern combination
  • Image edit uses the real client face — not a generic mannequin
  • One API call yields all eight cards — simpler orchestration

Why parallel generation at scan start?

  • Analysis ~15s; visualisation ~35s — sequential would be ~50s
  • Parallel caps perceived wait at ~max(15, 35) ≈ 35s

Why a Settings page for cameras?

  • Salons use webcam + USB microscope; device IDs change on reconnect
  • Persistent localStorage mapping prevents wrong-camera mistakes
  • No code deploy to swap hardware at a given desk

12

Database design snapshot

Salon

Device authentication and data scoping

SkinAnalysisResult

Raw AI scores, image URL, recommended products

SkinAnalysisReportToken

Time-limited tokens for PDF report retrieval

SkinAnalysisSession

Analytics per session (lead, demographics, completion)

ScalpAnalysisRecord

Full scalp session analytics

SalonSession

Base session tracking across analysis types

Indexing priorities

  • Session `created_at` for date-range analytics
  • `salon_id` FK on all analysis records for isolation
  • `session_completed` for funnel and completion metrics

13

Deployment and operations

Current setup

Django runserver for local/staging; Next.js on kiosk devices (Electron wrapper or browser kiosk mode). Environment variables include OPENAI_API_KEY, UPLOADTHING_SECRET, and SECRET_KEY.

Recommended production setup

  • Backend: Gunicorn + Nginx on VPS or containers (WSGI-compatible)
  • Frontend: Next.js standalone build deployed as PWA or Electron
  • Database: PostgreSQL (migrate from SQLite for production)
  • Media: UploadThing (already CDN-backed)
  • CI/CD: GitHub Actions — backend deploy + Next.js artifact per release

Monitoring targets

  • OpenAI API error rate and latency per endpoint
  • UploadThing upload success rate
  • WhatsApp delivery success rate
  • Session completion funnel drop-offs

14

Contribution and ownership

Example statements for interviews and portfolio accuracy.

Ownership highlights

  • Full-stack skin analysis flow — frontend state machine + Django pipeline
  • gpt-image-2 skin visualisation engine with parallel generation strategy
  • Scalp section analysis with multi-image upload and per-section scoring
  • Client-side React-PDF reports across skin and scalp modules
  • Superadmin analytics with salon filters and timeseries charts
  • Expert tips inference pipeline (images + questionnaire + analysis summary)
  • UploadThing integration for captures and AI outputs
  • Salon whitelist enforcement on admin analytics endpoints
  • Dual-camera device management (webcam + microscope)
  • AI Look Advisor and Scalp View inside the unified kiosk app

15

Tech stack

Production systems as icon clusters—hover or focus each tile for the technology name.

Kiosk frontend

Next.js 14 kiosk UX, Tailwind, next-intl, parallel AI flows.

Next.jsReactTypeScriptTailwind CSSnext-intl

Backend API

Django REST, salon-scoped ORM, JWT device auth.

DjangoPythonPostgreSQL

AI & media

Structured outputs, image edit pipeline, CDN-backed uploads.

OpenAIUploadThing (CDN)Axios

Delivery & reports

Client-side PDF, WhatsApp handoff, analytics APIs.

React-PDFWhatsAppDjango

16

Metrics and outcomes

Quantified outcomes matter for investors and enterprise buyers—replace template lines with live analytics when available.

Metrics to instrument

  • Daily skin and scalp analyses per salon
  • Full-flow completion rate (camera → lead capture)
  • Lead capture conversion rate
  • WhatsApp report delivery success rate
  • AI visualisation generation time (target < 40s)
  • Product recommendation engagement (cart adds)
  • Repeat sessions by phone number
  • Expert tips satisfaction ratings

Impact statement templates

  • Parallel AI generation reduced perceived wait from ~50s to ~35s per consultation.
  • AI-ranked recommendations increased average products viewed per session from N to M.
  • WhatsApp PDF reports maintained X% open rate as a post-visit retention touchpoint.
  • Skin visualisation step improved consultation satisfaction from A to B stars.

18

Deployment and market validation

Live footprint

Deployed across nine Florian Hurel Hair Couture locations in India—embedded as a core in-salon service, not a standalone consumer app.

  • Walkeshwar, Bandra, Waterfield (×2), Juhu, Mumbai
  • Pune
  • Ahmedabad — Sindhubhavan & Ambli
  • Hyderabad — Jubilee Hills

Validation indicators

  • Multi-location deployment across nine salons signals enterprise readiness
  • Skin + scalp modules prove extensible dual-service architecture
  • WhatsApp PDF creates measurable post-visit brand touchpoint
  • Superadmin analytics shows network-level operational maturity

19

Roadmap

PHASE 1

Phase 1: Stabilisation and foundation

  • Production stack: Gunicorn + PostgreSQL + HTTPS
  • Integration tests for all AI paths (skin, scalp, visualisation, expert tips)
  • Error monitoring (e.g. Sentry) and alerting
  • OpenAI spend tracking and per-endpoint cost attribution

PHASE 2

Phase 2: Operational excellence

  • Analytics: funnel visualisation, repeat-client tracking
  • Visualisation prompt tuning from real client imagery
  • Celery (or similar) for async AI inference off the HTTP cycle
  • Structured audit logs for leads and WhatsApp sends

PHASE 3

Phase 3: Scale and intelligence

  • Multi-brand / white-label configuration
  • Longitudinal profiling by phone across visits
  • Live product catalog sync vs static JSON
  • Per-location demand analytics (volume, peaks, mix)
  • Fine-tuning on Florian Hurel catalog and treatment outcomes

20

Conclusion

Try My Style is not a single feature—it is a coordinated AI product ecosystem spanning kiosk UX, computer vision, generative visualisation, personalised recommendations, automated report delivery, and network-wide analytics. Parallel generation, structured outputs, and client-side PDF are engineering-grade choices that support Florian Hurel's premium positioning.

Next step

Ship an AI product at this bar—with us.

Share flows, compliance needs, or kiosk constraints—we respond with a pragmatic plan.

Get in touch