AI-виртуальная примерка макияжа: от прототипа до продакшена

Реализация AI-виртуальной примерки макияжа

Beauty-бренды сталкиваются с дилеммой: как дать покупателю примерить косметику, не контактируя с продуктом физически? Наивное наложение 2D-изображений выглядит неестественно — не учитываются блики, текстура кожи и мимика. Мы решаем это с помощью гибридной архитектуры: landmark-based детекция для real-time и AI-генеративные модели для фото высокого качества. Наш опыт в Computer Vision (5+ лет, 20+ проектов для beauty-сегмента) показывает, что такой подход снижает возвраты косметики на 30% за счёт более точного подбора оттенков. В результате клиенты получают не просто примерку, а инструмент, который увеличивает конверсию в корзину на 25% и сокращает количество возвратов.

Для real-time сцен используем MediaPipe Face Mesh [^1] — решение от Google, обеспечивающее детекцию 468 ключевых точек лица с задержкой менее 5 мс. Для фото с высоким качеством применяем Stable Diffusion Inpainting с маской зон нанесения.

Сравнение подходов: landmark-based vs AI-генеративный

Почему гибридный подход эффективнее чистого AI?

Для real-time сцен критична задержка: MediaPipe даёт 100-кратное преимущество по скорости перед генеративными моделями. При этом точность позиционирования губ, век и скул достаточно высока, чтобы сгладить резкие границы с помощью билинейной фильтрации. Мы гарантируем стабильный фреймрейт 30 FPS даже на мобильных устройствах среднего сегмента. Для фото, где качество важнее скорости, используем Stable Diffusion XL Inpainting с предварительной сегментацией лица — модель получает маску зон нанесения и генерирует текстуру, учитывая рельеф кожи и падающий свет. Это даёт эффект живого макияжа, а не плоского наложения. Время обработки — 5–15 секунд на картинку, что приемлемо для пользовательских фото в приложении.

Как мы обеспечиваем real-time при 30 FPS?

Ключевое — использование WebGL для рендеринга и оптимизированный WASM-билд MediaPipe. Мы избегаем копирования данных между CPU и GPU за счёт прямого доступа к текстурам через WebGL2. В результате на среднем смартфоне (Snapdragon 865+) получаем стабильные 30 FPS с задержкой менее 5 мс. Дополнительно применяем билинейную фильтрацию для сглаживания границ и адаптивный битрейт для видеопотока.

MediaPipe подход (real-time)

import mediapipe as mp import cv2 import numpy as np from PIL import Image class RealTimeMakeupAR: def __init__(self): self.face_mesh = mp.solutions.face_mesh.FaceMesh( static_image_mode=False, max_num_faces=1, min_detection_confidence=0.5, min_tracking_confidence=0.5 ) LIPS_INDICES = [61, 185, 40, 39, 37, 0, 267, 269, 270, 409, 291, 375, 321, 405, 314, 17, 84, 181, 91, 146] UPPER_LID_L = [362, 382, 381, 380, 374, 373, 390, 249, 263, 466, 388, 387, 386, 385, 384, 398] CHEEKS_L = [36, 31, 228, 229, 230, 231, 232, 233, 244, 245, 188, 174, 177, 215, 213, 192] def apply_lipstick(self, frame, color, opacity=0.6): rgb = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB) results = self.face_mesh.process(rgb) if not results.multi_face_landmarks: return frame landmarks = results.multi_face_landmarks[0] h, w = frame.shape[:2] lip_points = np.array([ [int(landmarks.landmark[i].x * w), int(landmarks.landmark[i].y * h)] for i in self.LIPS_INDICES ], dtype=np.int32) overlay = frame.copy() cv2.fillPoly(overlay, [lip_points], color[::-1]) return cv2.addWeighted(frame, 1 - opacity, overlay, opacity, 0) 

Как работает AI-генеративная примерка?

Для фото, где качество важнее скорости, мы используем Stable Diffusion XL Inpainting с предварительной сегментацией лица. Модель получает маску зон нанесения (губы, веки, скулы) и генерирует текстуру, учитывая рельеф кожи и падающий свет. Это даёт эффект живого макияжа, а не плоского наложения. Время обработки — 5–15 секунд на картинку, что приемлемо для пользовательских фото в приложении.

AI-генеративный подход (высокое качество)

from diffusers import StableDiffusionXLInpaintPipeline import torch from PIL import Image import io class AIPhotoMakeupTryOn: def __init__(self): self.pipe = StableDiffusionXLInpaintPipeline.from_pretrained( "diffusers/stable-diffusion-xl-1.0-inpainting-0.1", torch_dtype=torch.float16 ).to("cuda") self.face_parser = FaceParser() def apply_makeup_ai(self, photo, makeup_style, intensity=0.7): img = Image.open(io.BytesIO(photo)).convert("RGB") face_mask = self.face_parser.get_makeup_zone_mask(img) result = self.pipe( prompt=f"beautiful makeup, {makeup_style}, natural skin texture", negative_prompt="unnatural, heavy, clown, overdone", image=img, mask_image=face_mask, strength=intensity, num_inference_steps=30, guidance_scale=8.0 ).images[0] buf = io.BytesIO() result.save(buf, format="PNG") return buf.getvalue() 

Этапы разработки виртуальной примерки

Что входит в работу

Наш сертифицированный опыт в Computer Vision позволяет выполнить проект под ключ. В результате вы получаете:

• документацию: архитектурная схема, описание API, руководство по интеграции
• исходный код с комментариями и CI/CD пайплайном
• обучение вашей команды работе с системой
• поддержку на этапе промышленной эксплуатации (SLA не ниже 99.9%)

Архитектура продукта

Веб/мобильное приложение ├── Camera/Photo mode │ ├── Real-time: MediaPipe WASM + WebGL (< 5мс) │ └── Photo: AI inpainting API (10–15 сек) ├── Product catalog (оттенки помады, теней) ├── Shade picker + color mixer └── Share / Download result 

Сроки: браузерный real-time AR макияж (MediaPipe) — 3–4 недели. AI фото-примерка с API — 1–2 недели. Полное мобильное приложение с каталогом — 3–4 месяца.

Браузерная real-time реализация

import * as faceMesh from '@mediapipe/face_mesh'; import * as drawingUtils from '@mediapipe/drawing_utils'; const faceMeshInstance = new faceMesh.FaceMesh({locateFile: (file) => { return `https://cdn.jsdelivr.net/npm/@mediapipe/face_mesh/${file}`; }}); faceMeshInstance.setOptions({ maxNumFaces: 1, minDetectionConfidence: 0.5, minTrackingConfidence: 0.5 }); function renderLipstick(ctx, landmarks, color, opacity) { const lipIndices = [61, 185, 40, 39, 37, 0, 267, 269, 270, 409, 291, 375]; ctx.globalAlpha = opacity; ctx.fillStyle = color; ctx.beginPath(); lipIndices.forEach((idx, i) => { const lm = landmarks[idx]; if (i === 0) ctx.moveTo(lm.x * canvas.width, lm.y * canvas.height); else ctx.lineTo(lm.x * canvas.width, lm.y * canvas.height); }); ctx.closePath(); ctx.fill(); ctx.globalAlpha = 1.0; } 

Свяжитесь с нами для пилотного проекта — получите demo за 5 дней. Закажите консультацию — подберём оптимальную архитектуру под ваши задачи.

[^1]: MediaPipe Face Mesh — библиотека для детекции и отслеживания ключевых точек лица.