Espejo Webcam

Espejo Webcam - Espejo Virtual para Maquillaje y Cabello

Una herramienta completa de espejo webcam online que convierte tu cámara en un espejo virtual. Perfecto para revisar maquillaje, cabello, coordinación de outfit y apariencia general. Las características incluyen volteo de espejo, control de zoom, ajuste de brillo, mejora de contraste, ajustes de saturación y varios filtros. Toma fotos y guárdalas para referencia.

¿Cómo funciona el espejo webcam?

El espejo webcam usa la cámara de tu dispositivo y muestra el feed en pantalla con transformación de espejo:

1. Haz clic en 'Iniciar Espejo' para activar tu cámara
2. El feed de video se muestra en un elemento canvas
3. Canvas transform scale(-1, 1) voltea la imagen horizontalmente
4. Renderizado en tiempo real a 60fps para experiencia de espejo suave
5. Todo el procesamiento ocurre en tu navegador - sin video subido

El efecto espejo hace que se sienta como mirar un espejo real, lo cual es más intuitivo para revisar apariencia, aplicar maquillaje o ajustar cabello.

¿Por qué el espejo está volteado por defecto?

El espejo está volteado (reflejado) por defecto porque:

Experiencia Natural:
- Los espejos en la vida real muestran una imagen invertida
- Cuando te mueves a la derecha, tu reflejo se mueve a la derecha
- Más intuitivo para el cuidado personal y revisiones de apariencia
- Más fácil de aplicar maquillaje o ajustar cabello

Cómo funciona:
- Canvas transform: scale(-1, 1) voltea la imagen horizontalmente
- Tu lado derecho aparece en el lado derecho de la pantalla
- Coincide con la experiencia de mirar en un espejo real

Vista sin voltear:
- Haz clic en 'Voltear Espejo' para alternar el efecto reflejado
- Muestra cómo te ven otros (vista real de cámara)
- Útil para verificar cómo te ves en videollamadas
- Texto y logos aparecen correctos (no invertidos)

¿Para qué puedo usar el espejo webcam?

El espejo webcam es versátil para muchas tareas de cuidado personal:

Aplicación de Maquillaje:
- Verificar aplicación y mezcla de maquillaje
- Verificar aplicación de lápiz labial
- Asegurar cobertura uniforme de base
- Perfeccionar delineador y máscara de pestañas
- Probar diferentes looks de maquillaje

Peinado:
- Revisar peinado desde todos los ángulos
- Verificar raya y estilo de cabello
- Detectar mechones sueltos o secciones desordenadas
- Probar diferentes peinados
- Verificar color y reflejos de cabello

Outfit y Accesorios:
- Coordinar piezas de outfit
- Verificar joyas y accesorios
- Verificar ajuste y estilo de ropa
- Probar combinaciones de colores
- Asegurar apariencia profesional

Aseo:
- Verificar aseo de vello facial
- Verificar apariencia limpia
- Inspeccionar dientes y sonrisa
- Verificaciones generales de higiene

Preparación para Videollamada:
- Verificar apariencia antes de llamadas importantes
- Probar iluminación y fondo
- Verificar ángulo de cámara
- Practicar expresiones y postura

¿Cómo uso la función de zoom?

La función de zoom te ayuda a enfocarte en áreas específicas:

Cómo hacer zoom:
1. Usa el control deslizante de Zoom (100% - 300%)
2. Valores más altos = vista más cercana
3. El zoom se actualiza en tiempo real

Casos de uso:
- 100-150%: Vista completa de cara y parte superior del cuerpo
- 150-200%: Enfoque en cara para maquillaje
- 200-300%: Vista detallada para ojos, labios o cejas

Consejos:
- Acerca el zoom para trabajo detallado (delineador, lápiz labial)
- Aleja el zoom para ver apariencia general
- Combina con buena iluminación para mejores resultados
- Ajusta posición para mantener cara centrada

¿Qué hacen los controles de brillo, contraste y saturación?

Estos controles ajustan la visualización del espejo para mejorar la visibilidad:

Brillo (50-200%):
- Hace la imagen más clara u oscura
- Aumenta si la habitación está muy oscura
- Disminuye si la imagen está lavada
- 100% = brillo normal

Contraste (50-200%):
- Ajusta la diferencia entre áreas claras y oscuras
- Aumenta para apariencia más vívida y dramática
- Disminuye para apariencia más suave y plana
- 100% = contraste normal

Saturación (0-200%):
- Controla la intensidad del color
- 0% = blanco y negro (escala de grises)
- 100% = colores normales
- 200% = colores vibrantes e intensos

Desenfoque (0-10px):
- Suaviza la imagen con desenfoque gaussiano
- Puede ocultar imperfecciones
- Crea efecto de enfoque suave
- 0px = imagen nítida

Estos controles NO cambian tu apariencia real - solo ajustan cómo el espejo muestra la imagen.

¿Cuáles son los efectos de filtro?

Los filtros aplican efectos especiales al espejo:

Ninguno:
- Espejo de color normal
- Sin efectos especiales aplicados
- Colores fieles a la vida

Escala de Grises:
- Espejo en blanco y negro
- Elimina todo el color
- Look vintage clásico
- Ayuda a enfocarse en iluminación y contraste

Sepia:
- Tono marrón cálido
- Efecto de fotografía vintage
- Estética nostálgica

Invertir:
- Invierte todos los colores
- Oscuro se vuelve claro, claro se vuelve oscuro
- Efecto artístico

¿Cómo tomo y guardo fotos?

La función de foto captura tu vista actual del espejo:

Tomar una foto:
1. Ajusta configuraciones del espejo (zoom, brillo, filtros) como desees
2. Haz clic en el botón 'Tomar Foto'
3. El cuadro actual se captura instantáneamente
4. La foto aparece en la vista previa debajo del espejo

Qué se captura:
- Vista actual exacta del espejo
- Todos los filtros y ajustes activos
- Nivel de zoom actual
- Estado de volteo del espejo (reflejado o sin voltear)

Guardar la foto:
1. Revisa la foto capturada
2. Haz clic en el botón 'Descargar'
3. La foto se guarda como archivo PNG
4. El nombre del archivo incluye marca de tiempo

Usos para fotos guardadas:
- Comparar looks de maquillaje con el tiempo
- Compartir con amigos para consejos de outfit
- Referencia para estilista o maquillador
- Comparaciones antes/después
- Documentar progreso de cuidado de la piel

¿Es mi video privado y seguro?

Sí, tu privacidad está completamente protegida:

Procesamiento Local:
- Todo el procesamiento de video ocurre en tu navegador
- Nada se sube a ningún servidor
- El feed de video nunca sale de tu dispositivo
- Sin grabación a menos que tomes una foto
- Sin almacenamiento de datos de video

Qué sucede con tu feed de cámara:
1. Cámara → Memoria de tu navegador (temporalmente)
2. Renderizado a canvas en tiempo real
3. Mostrado en tu pantalla
4. Descartado inmediatamente (no guardado)

Cuando tomas una foto:
- Solo capturada cuando haces clic en 'Tomar Foto'
- Solo guardada si haces clic en 'Descargar'
- Almacenada localmente en tu dispositivo
- Nunca subida a ningún lugar
- Tienes control completo

Nunca solicitamos la cámara hasta que haces clic en 'Iniciar Espejo' (sin aviso de permiso al cargar la página).

¡Aplicación 100% del lado del cliente - Completamente segura y privada!

¿Qué navegadores y dispositivos soportan este test de webcam?

La herramienta usa la API estándar getUserMedia (WebRTC), compatible con todos los navegadores modernos:

Compatibles:
- Chrome / Edge / Brave (escritorio y Android)
- Firefox (escritorio y Android)
- Safari (macOS 11+ e iOS/iPadOS 14.3+)
- Opera y la mayoría de navegadores basados en Chromium

Se requiere contexto seguro:
- getUserMedia solo funciona en páginas HTTPS (o localhost). En una página http:// el navegador oculta por completo navigator.mediaDevices, por lo que la herramienta muestra un mensaje de 'requiere HTTPS' en lugar de la cámara.

Notas de iOS Safari:
- La cámara funciona solo dentro de Safari; algunos navegadores integrados en apps la bloquean
- El elemento de video debe ser en línea (usamos playsinline) o iOS forzaría la reproducción en pantalla completa
- iOS puede etiquetar la cámara frontal como 'user' y la trasera como 'environment'

¿Por qué se ocultan los nombres de las cámaras al principio?
- Por privacidad, los navegadores devuelven etiquetas vacías en enumerateDevices() hasta que concedes el permiso. Por eso el menú muestra 'Cámara 1 / Cámara 2' genéricos antes de empezar, y los nombres reales solo aparecen tras hacer clic en 'Iniciar Espejo' y aprobar el acceso.

La cámara no inicia, ¿cómo soluciono errores de permiso y 'en uso'?

Problemas comunes de cámara y soluciones:

Permiso denegado (NotAllowedError):
- Tú (o tu navegador) bloqueaste el acceso a la cámara
- Haz clic en el icono de cámara/candado en la barra de direcciones → Configuración del sitio → pon Cámara en 'Permitir', luego recarga
- En macOS revisa también Ajustes del Sistema → Privacidad y seguridad → Cámara
- En Windows revisa Configuración → Privacidad → Cámara

Cámara en uso / pantalla negra (NotReadableError):
- Otra app ya tiene la cámara (Zoom, Teams, OBS, Skype, FaceTime)
- Cierra esas apps u otras pestañas que usen la cámara y vuelve a intentar
- Reiniciar libera un controlador de cámara bloqueado en Windows

No se detecta cámara (NotFoundError):
- Revisa el cable / la conexión USB de webcams externas
- Confirma que el dispositivo aparece en el administrador de dispositivos del sistema
- Prueba otro puerto USB

Ajustes no compatibles (OverconstrainedError):
- La resolución seleccionada no la soporta esa cámara; elige un preajuste menor (p. ej. 720p)

Si sigue sin funcionar:
- Prueba otro navegador para distinguir un problema de navegador del de hardware
- Una cámara que falla en todas las apps probablemente necesita reinstalar el controlador o reparación

¿Qué es el panel de Información de la Cámara: resolución solicitada vs. real?

El panel de Información de la Cámara convierte esto de un espejo de vanidad en un instrumento de diagnóstico real. Tras iniciar la cámara lee la pista MediaStreamTrack en vivo con getSettings() y getCapabilities():

Solicitada vs. entregada:
- El menú de resolución envía una 'sugerencia' ideal de ancho/alto al navegador
- El navegador puede darte algo parecido pero distinto (una petición de 1080p suele devolver 1280×720 en un sensor de 720p)
- 'Resolución Real' muestra lo que la cámara entregó de verdad mediante getSettings().width/height, no lo que pediste

Qué significa cada campo:
- Resolución Real: dimensiones reales en píxeles del flujo
- Fotogramas por Segundo: los fps negociados (p. ej. 30 fps)
- Relación de Aspecto: ancho ÷ alto (1.778 = 16:9, 1.333 = 4:3)
- Dispositivo: la etiqueta real de la cámara (tras el permiso)
- Orientación: 'user' (frontal) o 'environment' (trasera) en móviles
- Capacidades: la resolución, fps, zoom y linterna máximos que reporta el hardware vía getCapabilities()

Exportar para registros de QA:
- Haz clic en 'Exportar Info (JSON)' para descargar el informe completo, o 'Copiar' para copiarlo
- Los técnicos de reparación pueden adjuntar este registro verificable a un ticket para probar que una webcam reemplazada o reparada entrega su resolución y fotogramas nominales

Características Clave

• Espejo webcam en tiempo real con renderizado a 60fps
• Canvas transform scale(-1, 1) para volteo de espejo
• Alternar volteo de espejo (vista reflejada/sin voltear)
• Soporte de selección de múltiples cámaras
• Opciones de resolución (HD 720p, Full HD 1080p, SD 480p)
• Control de zoom (100-300%)
• Ajuste de brillo (50-200%)
• Ajuste de contraste (50-200%)
• Control de saturación (0-200%)
• Efecto de desenfoque (0-10px)
• Efectos de filtro (Escala de grises, Sepia, Invertir)
• Restablecimiento de filtros con un clic
• Modo pantalla completa para experiencia inmersiva
• Captura de foto con configuraciones actuales
• Descarga de fotos como PNG
• Marca de tiempo en nombres de archivo
• Actualizaciones de vista previa en tiempo real
• Animación suave a 60fps
• Diseño responsivo para todos los tamaños de pantalla
• Soporte de interfaz de modo oscuro
• 100% procesamiento del lado del cliente
• Sin carga o almacenamiento de video
• Privacidad y seguridad completas
• Funciona sin conexión después de carga inicial
• Sin registro requerido