2.5. Aseprite (DOC)

Introducción

Aseprite es una aplicación de escritorio para la creación de pixelart y animación creada por David Capello en 2014 y en funcionamiento hasta día de hoy con mejoras y updates constantes. Es a día de hoy uno de los programas más utilizados para Pixelart, siendo recomendado en 2017 como uno de los 6 mejores programas por la revista PC Gamer.
A pesar de que es una aplicación cerrada y de venta, existe la posibilidad una vez adquirido, de modificar el código fuente para adaptarlo a las necesidades del estudio o equipo de desarrollo. Aseprite tiene todo lo que necesita cualquier programa de edición gráfica, desde frames para animación, hasta la opción “pixel-perfect” que nos evita el tedioso jagging* en los trazos. Además permite crear scripts en lenguaje LUA para automatizar tareas. A continuación os dejo un enlace donde existe una lista con la mayoría de scripts creados hasta el momento:

https://community.aseprite.org/t/aseprite-scripts-collection/3599

Esta es una lista completa de todos los formatos de archivo que soporta Aseprite, ordenados de más común a menos común:

ASE/ASEPRITE: Nativa. permite guardar capas, animaciones, Color de 32 bits, transparencias de 8 bits, paletas y otras configuraciones.
BMP
JPEG/JPG
PNG
GIF
ICO
PCX
PCCSVG
TGA
WEBPFLC/FLI

Actualmente puedes adquirir Aseprite a un precio de 14.99$ desde su propia web o página de Steam (opción recomendada). También puedes descargar su versión de prueba con la posibilidad de guardar proyectos pero la limitación de no poder exportarlos (https://www.aseprite.org/) ó descargar la versión gratuita (0.9.5), pero sin mantenimiento/actualizaciones desde google code (https://code.google.com/archive/p/aseprite/downloads).

(*)El Jagging es un problema común que aparece cuando las esquinas de una pieza pixelart son irregulares o dentadas afeando la pieza.

Estas son algunas de las características más habituales que encontraremos y utilizaremos en Aseprite.

A pesar de que estas son las más comunes que usaremos, existen otras de igual importancia que hay que tener en cuenta a la hora de trabajar con Aseprite:

Onion Skin (PAPEL CEBOLLA)
Como si de una mesa de luz profesional para animación se tratara, puedes ver los fotogramas anteriores al fotograma en el que estás, e incluso los posteriores.

Control de paleta
Copia y pega colores, redimensiona tu paleta, o limítala a una paleta concreta. Aseprite además trae de por si una extensa biblioteca de paletas con sistemas populares como Game Boy, Commodore 64, o ¡Incluso los colores del TELETEXTO!

Asimismo puedes controlar el canal alpha de tu color, es decir la transparencia que puede tener o no ese mismo color. Una de las características más interesantes en cuanto a la paleta de colores que Aseprite aporta lo que denominan “Shading Mode” en el que partiendo de un color base, el programa te genera una paleta con la cantidad de colores que tú decidas, para crear sombras y luces.

Pixel perfect brush
Con esta característica nos olvidaremos del tedioso jagging. Aunque en este curso haremos un pequeño alto para mencionar esta feature, no la vamos a utilizar.

Rotación “rotsprite”
Aseprite utiliza el algoritmo RotSprite para rotar objetos pixeles sin una gran perdida de calidad. Obviamente nosotros como artistas tendremos que reajustar esos píxeles pero es un buen comienzo.

Modo Tile
Con esta opción podremos crear un tile y pre visualizar como quedaría una vez tileado. Parece algo confuso pero creedme cuando os digo que es de lo más útil cuando lo veamos durante el curso.

Modos de fusión
Como en otros programas de edición de imagen como Photoshop, Aseprite puede usar modos de fusión entre capas. Desde Superponer, Negativo, Sobreexposición de color, y un largo etcétera.

Sprite sheet
Podemos exportar nuestras creaciones (en el caso de que sean animadas) a un spritesheet totalmente adaptado para ser integrado en los engines o motores que utilicemos.

Atajos de teclado

Los atajos de teclado son algo que debemos aprender sí o sí. En la industria donde nos movemos, cuenta mucho la agilidad que tenemos para trabajar. Por muy bueno que seas haciendo Pixelart o cualquier otro arte digital, si no tienes velocidad a la hora de trabajar solo te quedarán dos opciones: Hacer Crunch* o convertirte en Solodev. Y como normalmente vamos a trabajar con un Publisher y un productor detrás, más nos conviene utilizar todos los métodos para agilizar nuestras tareas.
Dicho esto, a continuación dejo una tabla con los atajos de teclado BÁSICOS que debemos aprendernos. Al final de este módulo deberías ser capaz de recordar todas las nomenclaturas y para que sirven.

Aconsejo trabajar siempre con una mano en el teclado y otra en el ratón (o lápiz digital). Y acostumbraros a utilizar la mano del teclado exclusivamente para los atajos de teclado o para darle sorbos a vuestra taza de café.

(*)El “Crunch” es una mala práctica que se ha popularizado y estandarizado en el mundo de los videojuegos que consiste en echar horas extra como si no hubiera un mañana. Quedándose incluso a dormir dentro de la oficina varios días.

Herramientas básicas

En este apartado hablaremos de las herramientas básicas que utilizaremos más comúnmente a la hora de trabajar nuestro pixelart. Obviamente hay entresijos y consejos que veremos más adelante, pero la idea es que te familiarices con la herramienta.

Esta parte del curso es un apoyo al video titulado “2.d – Herramientas básicas de Aseprite”. En el podrás ver un poco más en profundidad como funciona cada herramienta y las características que tiene.

Trucos y consejos

¿Cómo crear tus propios pinceles?
A pesar de que estemos acostumbrados a herramientas como Photoshop donde crear un pincel significa poderle dar muchas opciones como el grueso de la línea, la presión de pluma, etc… en Aseprite funcionan de una forma distinta. Crear un pincel significa que podemos crear un “pincel” con el motivo de imagen que queramos. Algo así como pintar con un patrón.

Esto es aplicable también a las líneas. Por ejemplo si quisieras hacer una valla de madera que cruce la pantalla, con hacer un tile de 16px (o la resolución que estés usando) podrías lanzar una línea recta y que ese tile se repitiera a través de la pantalla. De igual forma puedes “rellenar” con ese patrón.

¿Crear una paleta de LUCES Y SOMBRAS con solo un brush?
Me parece que este es el mejor truco o consejo que puedo dar en este curso acerca de este programa. Considero que dominar esta técnica te hará mejorar muchísimo en tu workflow y en velocidad de trabajo. La idea es que en tu propia paleta de colores tengas todos los tonos del color que quieres utilizar. Pongamos el ejemplo de que quiero hacer luces y sombras partiendo de un verde hoja. Pues añadiríamos nuestros colores a la paleta para hacer ese color.

Digamos que 3 sombras y 3 luces. Si nos dirigimos a la herramienta brush podremos desplegar en el menú la opción “shading” que nos permitirá seleccionar todos los colores que hemos creado previamente para hacer las luces y sombras de ese verde y tan solo con la herramienta brush podrás sombrear e iluminar con ese tono. Cada vez que uses el click derecho pintarás más claro, y cada vez que pintes con el click izquierdo pintarás más oscuro. Es una cosa que con texto es difícil de explicar pero para eso he creado el video de trucos y consejos que dejo más abajo y que no puedes perderte.

Reemplazar colores
Parece una tontería pero no te dejes engañar. Imagina que por un momento en el estudio donde estás trabajando, estáis haciendo un juego de un mago que lanza magias de fuego, y tú, con la mejor de las intenciones del mundo has dibujado las magias de fuego de color… fuego. Tu productor, art director o quien te comenta por encima que el mago debería lanzar los fuegos de color azul.

Obviamente no vas a rehacer y reanimar todos los sprites y animaciones que tienes, ¿No? Para eso tenemos la herramienta de reemplazar color (Control + R). La idea es que elijas el color que quieres reemplazar con el color picker, y con la tecla (X) invertir el orden de color, frontal y trasero, para que el color trasero venga adelante y puedas seleccionar un segundo color (el que vas a utilizar azul). Ahora que ya tienes los dos colores (el naranja antiguo y el azul) y seleccionando todos los frames de tu timeline, con la herramienta de reemplazar color cambiarás TODOS los colores naranja a azul de TODOS los fotogramas.

Outline
Actualmente no hace falta hacer el outline (negro o de un color plano) a mano pixel a pixel. Aseprite ofrece la posibilidad desde el panel “Edit > FX > Outline…” (Shift+Q) de hacer un outline con diferentes opciones. Esto solo es aplicable a la capa que estés usando, no a todas a la vez.