Aprende pixel art
Lecciones cortas y prácticas con mis propios ejemplos. La mayoría tiene un entrenador interactivo: dibujas en tu navegador, paso a paso. Gratis.
Empieza aquí
Cómo aprender pixel art: una hoja de rutaEl orden en que enseño pixel art, de lo simple a lo complejo, con una lección gratis para cada paso.
Las 3 reglas del pixel art¿Qué hace que el pixel art sea pixel art? Tres reglas simples y una checklist rápida.
SPECC: cómo planear tu pixel art antes de dibujarTamaño, perspectiva, color y luz, composición: las cuatro decisiones antes del primer píxel, con una checklist.
¿Cuánto tiempo se tarda en aprender pixel art?Horas y meses para pixel art pequeño y grande, y qué habilidades necesitas para cada uno.
Términos de pixel art y errores comunesDoubles, jaggies, banding, pillow shading, sel-out y más, en palabras simples, con la solución para cada uno.
Lo básico
Líneas y curvas en pixel art (interactivo)Mi hoja de ejercicios de líneas en tu navegador: líneas rectas con proporciones limpias, luego curvas sin píxeles dobles ni dientes.
Círculos, cuadrados y triángulos en pixel art (interactivo)Mi hoja de ejercicios de formas en tu navegador, de 4 a 32 píxeles, y las reglas para un círculo redondo en cualquier tamaño.
Cómo hacer una paleta de colores para pixel artArma una paleta a partir de un color: tono principal, sombra, luz y tonos intermedios solo donde hagan falta.
Sombreado e iluminación en pixel art (interactivo)Sombrea una esfera en tu navegador y luego mira las mismas reglas de luz en un cubo, un cilindro, una pirámide y un cono.
Dibuja una manzana en pixel art (interactivo)Dibuja mi manzana en tu navegador, paso a paso. Mírame dibujar cada paso y después inténtalo tú.
Naturaleza
- Dibuja fuego en pixel art (interactivo)Dibuja una fogata en tu navegador en cuatro pasos y aprende por qué el fuego es claro abajo y oscuro en los bordes.
Dibuja una bola de fuego en pixel art (interactivo)Dibuja la bola de fuego de un lanzacohetes en tu navegador y aprende por qué el frente es la parte más caliente.
Dibuja agua en pixel art (interactivo)Pinta un tile de agua para juegos RPG y con vista cenital: olas, tres niveles de sombreado y brillos.
Dibuja nubes en pixel art (interactivo)Dibuja una nube en cuatro pasos y descubre por qué cada nube es solo un grupo de esferas.
Dibuja el suelo de un juego de plataformas (interactivo)Dibuja un bloque de suelo para un juego de vista lateral en cuatro pasos y luego agrégale pasto.
Dibuja rocas en pixel art (interactivo)Dibuja un grupo de piedras con musgo y aprende dónde van la luz y la sombra en una roca.
Dibuja un arbusto en pixel art (interactivo)Pinta un arbusto detallado sobre contornos ya hechos: color, sombreado, luz en cada hoja, ramas.
Dibuja un árbol en pixel art (interactivo)Pon un tronco debajo del arbusto: contorno, sombra suave, textura de corteza en espiral y pasto en las raíces.
Materiales
Dibuja una placa de metal en pixel art (interactivo)Dibuja una placa de acero brillante con biseles, reflejos, tornillos y relieve hundido. Un sprite, cuatro placas.
Dibuja una pared de ladrillos en pixel art (interactivo)Arma una pared de ladrillos de concreto, agrega biseles con luz y sombra y luego cámbiale el color a arena.
Dibuja un piso de madera en pixel art (interactivo)Dibuja un piso de madera: tablas, juntas, luz, sombra y veta.
Dibuja tuberías en pixel art (interactivo)Un cilindro de 5 píxeles iluminado desde arriba a la izquierda, luego un codo, una unión y un manguito: cuatro piezas para cualquier recorrido.
Dibuja vidrio en pixel art (interactivo)Vidrio de color en tonos de un solo color, vidrio transparente mostrado con un reflejo. Una puerta de vidrio y una vidriera.
Tiles, tilesets y tilemaps en pixel art (interactivo)Dibuja paso a paso mi tileset de pavimento de 9 piezas y luego mira dos tilemaps hechos con los mismos tiles.
Personajes
Perspectiva e isométrico
Perspectiva en pixel art: cuál usarIsométrica 2:1, oblicua 1:1, y cuándo conviene la perspectiva de uno o dos puntos, con cómo elegir.
Pixel art isométrico para principiantes (interactivo)Aprende la línea isométrica 2:1 y luego dibuja paso a paso un aire acondicionado isométrico.
Dibuja una máquina expendedora isométrica (interactivo)Una caja isométrica con frente de vidrio, bordes que brillan y filas de latas de refresco.
Reto isométrico: balcón, ventana de techo, toldo (interactivo)Dibuja un balcón alrededor de mi bloque de edificio isométrico y luego una ventana de techo y un toldo en el mismo bloque.
Animación isométrica: un letrero que se desplaza (interactivo)Mueve un letrero por el camino isométrico fotograma a fotograma, con Select y Move como en Aseprite.
Escenas de juego
Composición en pixel art: historia, ambiente, foco y equilibrioCuatro preguntas para cualquier escena de juego, respondidas en mis mockups en primera persona, RPG, de plataformas e isométrico.
UI de juego en pixel art: un menú con historiaUna tienda, un mensaje y una pantalla de controles en un solo marco, íconos de objetos y reglas para una UI en píxeles que se lea bien.
Animación
Anima humo en pixel art (interactivo)Tu primera animación: una bocanada de humo en 10 fotogramas, con onion skin y reproducción.
Ciclo de caminata en pixel art (interactivo)Haz caminar al sabio en cuatro fotogramas: pasos, movimientos de cabeza y brazos que se balancean, con onion skin y reproducción.
Ciclo de caminata de perfil en pixel art (interactivo)Cuatro fotogramas de perfil: las piernas, luego la espalda, la cabeza y una túnica que se balancea un poco.
Anticipación, smear y easing (interactivo)Anima al sabio lanzando un hechizo: una sentadilla, ondas de aire, fotogramas más rápidos y puños de manga que se balancean.
Animación sub-pixel (interactivo)Haz el movimiento más suave con rastros de colores vecinos: el sabio respirando, fotograma a fotograma.
El parallax en pixel art, explicadoPor qué las cosas lejanas parecen más lentas y cómo las capas que se mueven de 1 a 4 píxeles por fotograma crean el desplazamiento parallax.