MakeupFusion AI

Aplicación web de maquillaje virtual que combina detección facial local con edición de imagen generativa mediante IA.

---

Características

Maquillaje local (face-api.js)

Procesa la imagen directamente en el navegador, sin enviar datos a servidores externos.

• Labios — aplica el color seleccionado sobre el contorno exacto detectado, con efecto semitransparente y brillo natural
• Sombra de ojos — degradado suave sobre los párpados superiores de ambos ojos
• Iris — tinte de color sobre la pupila con gradiente radial y destello especular (activable con checkbox)
• Controles de opacidad independientes para cada zona (10 – 80%)
• Paletas de colores predefinidas + selector de color personalizado

Color de cabello (IA — Pollinations API)

Envía la imagen al modelo seleccionado con un prompt que describe el cambio.

• Selector de color con 14 tonos usuales (negro, castaño, rubio, platino, rojo, rosa, violeta, verde, azul, gris, blanco, etc.)
• Selector de intensidad: Sutil / Natural / Vívido / Extremo

Maquillaje completo con IA (✨ Maquillaje con IA)

Construye automáticamente un prompt detallado en inglés con todos los valores seleccionados (labios, ojos, iris, cabello) y los envía en una sola llamada a la API.

---

Tecnologías

---

Requisitos

• Navegador moderno con soporte de Canvas API y fetch
• API Key de Pollinations para las funciones de IA (color de cabello y maquillaje completo con IA)
  • Obtener en: enter.pollinations.ai
• Conexión a internet para descargar los modelos de face-api (~10 MB, solo la primera vez) y para llamadas a la API

---

Uso

1. Abre index.html en el navegador
2. Ingresa tu Pollinations API Key (requerida solo para IA)
3. Arrastra o selecciona una imagen de rostro
4. Ajusta los colores y opciones deseados en el panel izquierdo
5. Elige una acción:

6. Usa los botones del panel derecho para descargar, abrir, guardar en galería o generar galería HTML

---

Panel de controles

├── API Key (Pollinations)
├── Modelo (solo modelos con input de imagen)
├── Cargar imagen (drag & drop o click)
├── Dimensiones de salida
│
├── 💄 Opciones de Maquillaje
│   ├── Color de labios  (12 swatches + picker + opacidad)
│   ├── Sombra de ojos   (12 swatches + picker + opacidad)
│   └── Color de iris    (10 swatches + checkbox activar + opacidad)
│
├── 💇 Color de Cabello (IA)
│   ├── 14 swatches de colores
│   └── Intensidad: Sutil / Natural / Vívido / Extremo
│
└── ✨ Maquillaje Completo con IA

---

Idiomas

La interfaz está disponible en Español, English y Français. La preferencia se guarda en localStorage.

---

Galería

• Guardar en galería — acumula la imagen actual en memoria (con contador)
• Generar y descargar galería — exporta un archivo .html con todas las imágenes en grid, vista ampliada al hacer clic y cierre con Esc

---

Notas técnicas

• Los modelos de face-api se cargan desde CDN (@vladmandic/face-api) la primera vez (~10 MB); quedan en caché del navegador para usos posteriores
• El maquillaje local usa canvas clipping estricto para los labios (sin blur externo que derrame color fuera del contorno)
• El iris se detecta calculando el centro geométrico de los 6 puntos del landmark ocular; el radio es ≈ 33% del ancho del ojo
• Las llamadas a la API de cabello/IA intentan primero POST /v1/images/edits (con base64) y caen en GET con URL pública de ImgBB como fallback

---

Estructura de archivos

makeup_ai/
├── index.html      — Interfaz principal
├── script.js       — Lógica: detección, maquillaje, API calls, galería
├── styles.css      — Estilos
└── README.md       — Este archivo

---

Diseñado por Juan Guillermo Rivera Berrío con tecnología Claude y asistencia de Kiro