Mixels

Qué es

En el pixel art, cada píxel de la obra debería tener el mismo tamaño en pantalla. Un mixel (píxel mezclado) rompe eso: un sprite se dibuja con píxeles de pantalla gruesos de 4×4 mientras otro a su lado usa 2×2, o un objeto se rota o escala de modo que sus píxeles quedan desiguales.

Causas comunes:

• Ampliar un sprite 2× para hacer una versión «grande».
• Mezclar assets hechos a distintas resoluciones, por ejemplo un tileset de 16 píxeles con personajes de 32 píxeles dibujados al mismo tamaño en el mundo.
• Rotar sprites en el motor en ángulos distintos de 90°.
• Escalar todo el juego por un número no entero, de modo que algunos píxeles del arte se convierten en dos píxeles de pantalla y otros en tres.
• Tramado o contornos a un tamaño de píxel distinto del resto del sprite.

Por qué lo evitan los artistas

La cuadrícula forma parte del aspecto. Cuando todo comparte un mismo tamaño de píxel, el ojo acepta la baja resolución como un estilo. Cuando los tamaños se mezclan, las partes gruesas parecen descuidadas y las finas parecen fuera de lugar. Se ve como varios conjuntos de arte pegados.

Errores comunes

• Escalar un jefe. Un enemigo grande hecho escalando uno pequeño 3× tiene píxeles tres veces más grandes que todo lo demás. Los sprites grandes hay que dibujarlos grandes.
• Escalar la cámara de forma suave. Un zoom de 1.5× produce píxeles desiguales en toda la pantalla. Usa escalas de números enteros.
• Rotación libre. Rotar un sprite 30° en el motor lo remuestrea y rompe la cuadrícula. Dibuja o renderiza fotogramas rotados en su lugar.
• Partículas e interfaz a otra escala. Los efectos dibujados con una cuadrícula más fina que la de los personajes desentonan.

Cómo evitarlo a mano

1. Decide una única resolución artística para el mundo del juego, por ejemplo una vista de 320×180 o 640×360.
2. Dibuja cada asset para esa resolución, al tamaño previsto en pantalla.
3. Muestra el juego a múltiplos enteros de esa resolución.
4. Cuando necesites una versión más grande de algo, vuelve a dibujarla al tamaño mayor con el mismo tamaño de píxel.
5. Para la rotación, dibuja fotogramas separados para cada ángulo.

Cómo lo hace Pixor

Da a las cámaras de un proyecto unos Píxeles/m fijos y Pixor lo renderiza todo a esa única escala (de forma predeterminada, cada cámara ajusta su sprite a su propio tamaño). Un caballero de dos metros y una caja de un metro salen con tamaños proporcionados entre sí, con el mismo tamaño de píxel, así que los assets de un mismo proyecto encajan juntos sin mixels. Un sprite más grande se renderiza más grande, con más detalle, en lugar de escalarse. La rotación la resuelven las cámaras: cada lado se renderiza como sus propios fotogramas, así que no hay que rotar nada en el motor. El pivote queda fijo en un píxel en cada fotograma y lado, lo que mantiene los sprites en la cuadrícula mientras se animan.

Relacionado

• Tamaños de sprite: elegir una escala y escalar por números enteros
• Animación subpíxel
• Direcciones y el manual de ajustes