GuidesLeads & CRMSet Up Selfie Analysis

Set Up Selfie Analysis Web Component

Configure and deploy the Selfie Analysis web component on your website so that visitors can complete an AI-powered hair analysis and become leads automatically.

Prerequisites

  • OrganizationAdmin role
  • Access to Organization Settings
  • A website or app where you want to embed the component

Steps

  1. Navigate to Organization Settings → Web Components.
  2. Generate (or copy the existing) Organization API key — this key authenticates the web component.
  3. Add your website’s domain(s) to the Allowed Domains list. The component will show “Access Denied” on non-allowed domains.
  4. Configure embed settings (theme, form fields, locale, camera masks) as needed.
  5. Copy the embed code (script tag + component element) and add it to your website’s HTML.

Notes

  • There is one Organization-level API key shared across all web components (Selfie Analysis and Appointment Booking).
  • For multi-clinic organizations: visitors must select a clinic during the selfie analysis flow. This selection is mandatory — the flow cannot be completed without choosing a clinic.
  • For single-clinic organizations: the clinic selection step is skipped and leads are auto-assigned to the only active clinic.
  • The component handles: camera capture, lead form, questions, AI analysis, and report display.
  • In AUTO_ASSIGN mode, leads are immediately assigned to the selected clinic. In MANUAL_ASSIGN mode, leads are created as Unassigned pending OrganizationAdmin confirmation.
  • Only OrganizationAdmins can generate/revoke API keys and configure web component settings.
Configure WebhooksAssign Leads to Clinics