Guía de viñeteado de imágenes
Al capturar una fotografía, el sensor de la cámara registra todo dentro del encuadre con igual prioridad. Esto a menudo genera elementos que distraen cerca de los bordes.
Al capturar una fotografía, el sensor de la cámara registra todo dentro del encuadre con igual prioridad. Esto a menudo genera elementos que distraen cerca de los bordes (como una rama perdida, una farola brillante o una superficie altamente reflectante) que desvían la mirada del espectador del sujeto principal.
Qué necesitas
Para aplicar un viñeteado a tus imágenes, no necesitas software de diseño gráfico complejo ni formación extensa.
Un archivo de imagen compatible: La herramienta admite formatos ráster web estándar, específicamente JPG, JPEG, PNG y WEBP. * Un navegador web moderno: Cualquier navegador actualizado en tu computadora o dispositivo móvil funcionará para cargar y procesar tu archivo. Soporte para WebAssembly: Tu navegador carga el módulo WebAssembly de libvips para procesar todo localmente.
Un archivo dentro del límite de tamaño: El archivo de origen no debe exceder el límite admitido de 20 MB.
El límite de 20 MB se aplica estrictamente. Los archivos que superen el límite admitido no se procesarán y fallarán. Además, los formatos vectoriales como SVG o formatos RAW de cámara (como CR2 o NEF) no son compatibles directamente.
Debes convertir estos formatos sin procesar a un formato ráster estándar como PNG o JPG antes de intentar aplicar el viñeteado.
Aplicar un viñeteado
Inicia tu navegador y navega a la interfaz de la herramienta Image Vignette. Localiza el archivo de imagen en tu dispositivo local. Asegúrate de que esté en un formato compatible (JPG, JPEG, PNG o WEBP) y que su tamaño no exceda el límite de 20 MB.
Haz clic en el área de carga para buscar en tus carpetas locales o arrastra y suelta tu archivo directamente en la ventana del navegador. * *Radio*: Ajusta este control para determinar qué tan lejos llega el viñeteado hacia el centro de tu imagen. Un radio más pequeño mantiene el viñeteado confinado a las esquinas exteriores, mientras que un radio más grande acerca la oscuridad al centro.
* *Intensidad*: Modifica la fuerza del efecto de oscurecimiento. Una intensidad alta hace que los bordes sean significativamente más oscuros, mientras que una intensidad baja mantiene el efecto sutil. * *Difuminado*: Este ajuste controla la suavidad del degradado de transición.
Los valores altos de difuminado crean una mezcla gradual e imperceptible de claro a oscuro. Los valores bajos de difuminado producen un borde nítido y marcado. Haz clic en el botón para iniciar la conversión a través de libvips.
libvips aplicará los ajustes matemáticos a la cuadrícula de píxeles de tu archivo. Una vez que finalice el procesamiento, haz clic en el botón de descarga para guardar la imagen con el nuevo estilo en tu almacenamiento local.
Cómo funciona
libvips procesa tu imagen realizando cálculos matemáticos directos a nivel de coordenadas de píxeles. No simplemente superpone una plantilla de imagen oscura estática sobre tu archivo. En cambio, analiza dinámicamente las dimensiones de la imagen cargada para encontrar el punto central geométrico exacto.
Una vez que libvips establece las coordenadas centrales, calcula la distancia desde ese punto central hasta cada píxel individual en la cuadrícula de la imagen. libvips utiliza una función de decaimiento matemático para determinar cuánto oscurecer cada píxel. Para los píxeles ubicados dentro del radio interior designado, el multiplicador de escala es 1.0, lo que significa que los colores originales permanecen completamente intactos.
A medida que la distancia desde el centro aumenta más allá del umbral del radio, libvips aplica la fórmula de difuminado. Esta fórmula reduce los valores de los canales de color rojo, verde y azul (RGB) de cada píxel progresivamente. Cuanto más lejos esté un píxel del centro, más se reducirán sus valores RGB hacia el negro.
Para archivos PNG que contienen transparencia, libvips debe manejar el canal alfa con cuidado. Aplica el factor de oscurecimiento solo a los canales de color RGB mientras mantiene intacto el canal de transparencia, asegurando que los fondos transparentes no se conviertan en bloques negros sólidos. Una vez que estos ajustes matemáticos se aplican a toda la cuadrícula de píxeles, libvips empaqueta los datos de píxeles modificados en el formato de salida elegido (JPG, JPEG, PNG o WEBP) para que los descargues.
Cuando algo sale mal
Si tu archivo no se carga, la razón más común es que el tamaño del archivo supera el límite admitido de 20 MB. Cuando un archivo es demasiado grande, el navegador o libvips terminan la conexión. Para solucionar esto, verifica las propiedades del archivo y reduce las dimensiones de tu imagen antes de cargarla.
Otro problema común es el bandeado de color, donde el viñeteado parece una serie de anillos distintos y bloqueados en lugar de un degradado suave. Esto ocurre porque el archivo de origen tiene poca profundidad de color o ha sido muy comprimido en el pasado. Cuando libvips intenta calcular transiciones suaves en una imagen con datos de color limitados, se queda sin tonos intermedios, lo que resulta en "pasos" visibles.
Para evitar esto, carga siempre archivos de origen de alta calidad y sin comprimir.
Si tu sujeto aparece oscuro y oscurecido, el problema radica en la composición de la imagen. libvips calcula el viñeteado desde el centro geométrico absoluto del encuadre. Si tu sujeto está posicionado fuera del centro (como en una composición de regla de tercios), un viñeteado amplio se superpondrá y los oscurecerá.
Para resolver esto, recorta tu imagen para colocar a tu sujeto más cerca del centro antes de procesarla, o usa un radio de viñeteado más pequeño con un valor de difuminado alto.
### ¿Por qué mi imagen procesada muestra anillos concéntricos distintos en lugar de un degradado oscuro suave? Este error visual se conoce como bandeado de color. Ocurre cuando tu archivo de origen tiene datos de color altamente comprimidos.
libvips no tiene suficiente profundidad de color para renderizar la transición suave de claro a oscuro, lo que lo obliga a agrupar tonos similares en bandas visibles. Usa un archivo de origen de alta calidad y sin comprimir para solucionar esto. ### ¿Por qué falló la carga cuando intenté procesar mi foto de alta resolución?
La carga falló porque tu archivo supera el límite admitido de 20 MB. libvips aplica este límite. Los archivos por encima del tamaño admitido no se procesarán.
Debes reducir las dimensiones de la imagen o guardarla en un formato más eficiente antes de cargarla. ### ¿Por qué el viñeteado está oscureciendo al sujeto principal de mi foto? libvips calcula el viñeteado comenzando desde el centro geométrico absoluto de la imagen.
Si tu sujeto está encuadrado fuera del centro, el efecto de oscurecimiento se extenderá naturalmente sobre él. Recorta tu imagen para centrar a tu sujeto antes de cargarla en la herramienta.
Frequently Asked Questions
Q: ¿Cómo funciona Image Vignette?
Image Vignette procesa archivos completamente en tu navegador usando WebAssembly. Tus archivos nunca abandonan tu dispositivo.
Q: ¿Es gratuito el uso de Image Vignette?
Sí, Image Vignette es completamente gratuito y no requiere registro ni cuenta.