Pixelador de Imágenes

Acerca del Pixelador de Imágenes

El Pixelador de Imágenes convierte cualquier fotografía o ilustración en pixel art reduciéndola a una cuadrícula pequeña y volviéndola a ampliar con interpolación de vecino más cercano, lo que produce el icónico aspecto de bloques gruesos de los juegos de 8 y 16 bits. El control de tamaño de bloque define cuántos píxeles reales se fusionan en cada bloque de salida: un valor de 16 significa que cada parche de 16 por 16 se vuelve un cuadrado de color sólido. Una paleta median-cut opcional reduce toda la imagen a entre 2 y 64 colores, imitando la memoria de color limitada de consolas clásicas como NES, Game Boy y Master System. La cuadrícula opcional ayuda al diseño de sprites. Todo se ejecuta localmente en tu navegador con la API Canvas: la foto nunca sale de tu dispositivo, ideal para avatares, recursos de juegos, fondos retro e imágenes sensibles.

¿Qué es la pixelación de imágenes y en qué se diferencia del desenfoque?

La pixelación reduce la imagen a una cuadrícula de baja resolución donde cada celda contiene un único color, creando el aspecto bloque a bloque de los videojuegos antiguos. El desenfoque distribuye el color de cada píxel entre sus vecinos con un núcleo gaussiano o de caja, suavizando los bordes en lugar de cuantificarlos en cuadrados nítidos. La pixelación preserva la disposición espacial a baja resolución, mientras que el desenfoque pesado simplemente promedia los detalles locales. Ambas técnicas se usan para censura de privacidad (caras, matrículas) y efectos estilísticos, pero solo la pixelación impone también la cuantización del color en los límites de cada bloque, por eso el pixel art suele combinarse con una paleta limitada.

¿Qué tamaño de píxel debo elegir para un avatar o un sprite?

Para avatares de redes sociales de 64 a 128 píxeles, un tamaño de bloque de 6 a 12 conserva suficiente estructura facial sin perder el aire pixelado. Para sprites estilo NES, un tamaño de 4 a 8 con paleta de 8 a 16 colores se ajusta a la estética histórica. Para iconos móviles más gruesos o retratos tipo Game Boy, sube el tamaño a 12-24 y usa paleta de 4 colores para imitar la escala de grises de 2 bits original. Regla práctica: divide el lado mayor de la imagen entre 16 para un look minimalista, entre 32 para un sprite equilibrado y entre 64 para detalle fino. La cuadrícula te ayuda a contar bloques si vas a redibujar el sprite en un editor.

¿Cómo funciona la cuantización median cut?

Median cut es un algoritmo clásico que empieza agrupando todos los píxeles en una sola caja 3D de rojo, verde y azul. Encuentra el eje con mayor dispersión, ordena los píxeles según ese eje y parte la caja por la mediana. Repite el proceso sobre la caja con mayor dispersión hasta alcanzar el número de colores deseado. Cada caja final aporta un color de la paleta, calculado como la media de los píxeles que contiene. La ventaja frente a la cuantización uniforme es que median cut concentra más colores donde la imagen tiene más variedad: un retrato recibe muchos tonos de piel y pocos de cielo, en vez de repartir uniformemente el cubo de color. El pixelador muestrea unos miles de píxeles por velocidad; el resultado es visualmente indistinguible de cuantificar cada píxel.

¿La herramienta sube mi imagen a un servidor?

No. La imagen se lee con FileReader y se dibuja en un Canvas íntegramente dentro de tu pestaña del navegador. La pixelación, la cuantización y la exportación PNG ocurren localmente: no se envían datos por la red. Puedes verificarlo abriendo la pestaña Network de DevTools antes de usar la herramienta. Este diseño 'solo local' la hace segura para fotos sensibles (DNI, imágenes médicas, mockups confidenciales) y permite usarla offline una vez cacheada la página. El único límite es la memoria del navegador; 20 MB es un techo práctico para la mayoría de portátiles, aunque casi cualquier móvil puede pixelar fotos de su propia cámara sin problemas.

¿Por qué mi PNG resultante tiene el mismo tamaño que el original?

La pixelación reduce y vuelve a ampliar la imagen, por lo que el canvas de salida coincide con la vista previa visible y no con el archivo original. Si necesitas un sprite real de baja resolución (por ejemplo 32x32 píxeles), haz una captura del canvas o abre el PNG descargado y redimensiónalo a la cuadrícula pequeña (clic derecho, Redimensionar, elige 'Vecino más cercano' para mantener los bloques nítidos). Una versión futura añadirá un botón 'Guardar en la rejilla nativa'. Mientras tanto, el tamaño de bloque visible multiplicado por la resolución de la rejilla pequeña determina el tamaño del PNG guardado: una vista previa de 600 píxeles con bloque de 10 produce una imagen de 60 bloques de ancho, escalada a 600 píxeles.

¿Puedo usar esto para hacer pixel art comercial o NFTs?

Sí: la herramienta no añade marcas de agua y aplica una transformación matemática determinista sin material propio susceptible de copyright. La situación legal del resultado coincide con la del original: si tienes derechos sobre la foto o licencia permisiva, el pixelado hereda esos mismos derechos. Para desarrollo de juegos, los assets generados así suelen retocarse después a mano en un editor de pixel art (Aseprite, Piskel, Photoshop) para limpiar formas, afinar siluetas y ajustar la paleta. Para proyectos NFT, recuerda que en la mayoría de jurisdicciones una transformación algorítmica simple sobre la imagen de otra persona no genera un nuevo copyright, así que empieza siempre desde imágenes que poseas o tengas permiso para usar.