Alternativa a Pixelorama: dibuja sprites en el navegador y genéralos cuando prefieras no hacerlo

Si buscas una alternativa a Pixelorama, el motivo suele ser uno de tres: el equipo es un Chromebook, la instalación está bloqueada por política, o necesitas un sprite terminado antes de tener tiempo para dibujarlo. Pixelorama es un editor de pixel art gratuito, de código abierto y de escritorio, con animación, capas y una herramienta de tilemaps, y es bueno en las tres cosas. Esta página trata sobre el espacio de trabajo en el navegador que cubre el dibujo, añade una vía de describir-para-generar y luego hace lo que Pixelorama no puede: colocar el sprite dentro de una escena 3D por la que puedes caminar.

Agent Sprite Forge es el editor de sprites. Escribes una frase nominal, eliges una dirección de orientación y obtienes una hoja; o tomas un lápiz de un píxel y dibujas los fotogramas tú mismo en 16×16, 32×32 o lo que use el proyecto. La exportación es un PNG simple, de un solo fotograma o en tira. A partir de ahí, el constructor de juegos 3D toma ese PNG como material sobre un plano o un cartel dentro de Mini World, The Cyclops' Island, o una escena generada a partir de un párrafo. Sin descargas y sin cuenta para probarlo.

Qué es Pixelorama y qué no es

Pixelorama es un editor de pixel art gratuito y de código abierto que se ejecuta en el escritorio. Está construido sobre el motor Godot, se abre como una ventana de aplicación normal y cubre las partes del trabajo con sprites que de verdad consumen tiempo: una pila de capas con opacidad y modos de fusión, una línea de tiempo de animación con etiquetas de fotogramas y piel de cebolla, un panel de paletas que importa archivos de paleta existentes y una herramienta de tilemaps para construir tilesets que encajan sin costuras. Para mucha gente es la respuesta honesta a «Aseprite cuesta dinero y todavía no voy a pagarlo».

También es un programa de dibujo en sentido estricto. Cada píxel de un archivo de proyecto está ahí porque una mano movió un cursor. No hay un camino de una frase escrita a un sprite, ninguna operación por lotes que produzca cuarenta variaciones de reposo y ningún renderizador. Lo que sale del programa es un PNG, una hoja empaquetada o un GIF: un rectángulo de píxeles sin cámara, sin suelo y sin luz.

Esa distinción importa al definir el alcance de un proyecto. Una herramienta de dibujo responde a «qué aspecto debería tener este personaje». No responde a «dónde está colocado este personaje». La segunda pregunta necesita una escena, una cámara, un plano de suelo y una decisión de iluminación, y Pixelorama deliberadamente no tiene ninguna de ellas. Mantén ese límite en mente durante el resto de la página, porque es donde las dos herramientas dejan de solaparse.

Dónde se detiene Pixelorama

Primera parada: es software de escritorio. Hay compilaciones para Windows, macOS y Linux, y esa es la lista completa. Un Chromebook no puede instalarlo. Un equipo de estudio o escuela con una lista de aplicaciones permitidas no puede instalarlo. Un portátil de trabajo bloqueado que no ejecutará un binario sin firma no puede instalarlo. Si el ordenador que tienes durante los próximos veinte minutos es una pestaña del navegador, Pixelorama no está disponible para ti, por bueno que sea.

Segunda parada: cada píxel sale de tu mano. Un personaje de 32×32 con una caminata de cuatro fotogramas son aproximadamente cuatro mil píxeles de decisiones. Un artista de píxeles con práctica lo termina en 30 a 60 minutos. Alguien que no lo ha hecho antes tarda horas, y la mayor parte de esas horas se va en la silueta —la lectura a tamaño pequeño—, no en el sombreado ni en el color. Generar un borrador no elimina la habilidad. La traslada a la selección y la corrección, que es un bucle mucho más corto.

Tercera parada: la salida es una imagen sin ningún lugar donde estar. Un PNG de un caballero no es un caballero en una escena. Pasar de uno a otro requiere un motor, un paso de importación, un material, una decisión de escala y una cámara. No es una crítica a Pixelorama; es el alcance correcto para un editor. Pero cuando lo que hay que entregar esta semana es «una calle por la que pueda caminar», un editor 2D es uno de cinco pasos.

Nada de eso es un ataque al software. La herramienta de tilemaps es realmente buena: baldosas en cuadrícula, formas de colisión que defines por baldosa y un flujo de tileset que sobrevive a la exportación. La línea de tiempo de animación con etiquetas es la razón por la que los animadores se quedan. Tiene seguidores porque el núcleo es sólido, no porque sea gratis.

Pixelorama frente a una herramienta de sprites en el navegador, lado a lado

La tabla compara las dos en las cosas que deciden un proyecto, no en el número de funciones. Lee las filas en las que gana Pixelorama como pérdidas reales de la herramienta del navegador, porque eso es lo que son.

Las dos filas que deciden la mayoría de los proyectos

Los scripts son la brecha que molestará a cualquiera con un pipeline. Si tu flujo de trabajo implica renombrar cada fotograma, rellenar la hoja hasta una cuadrícula fija o emitir un atlas JSON junto al PNG, Pixelorama se puede ampliar para hacer ese trabajo y la herramienta del navegador no. Es una interfaz, no una biblioteca.

El control exacto de la paleta es el otro. Pixelorama te permite bloquear una paleta indexada y auditar cada color contra ella. La generación devuelve colores que no elegiste, y o los ajustas a mano a la paleta del proyecto o aceptas una deriva a lo largo de la hoja. Para un solo personaje eso son diez minutos de trabajo. Para un tileset de cuarenta sprites es toda la tarde.

Prueba aquí el editor del navegador

Agent Sprite Forge se abre con un lienzo, un lápiz, un borrador, un relleno, una herramienta de línea, un panel de capas, una tira de fotogramas y un campo de generación. No hay nada que instalar y no hace falta cuenta para empezar a dibujar.

La ruta más rápida hacia algo usable pasa por el campo de generación, y la forma de escribir importa. Escribe una frase nominal, no una oración: «caballero con armadura y lanza» devuelve un sprite más coherente que «un caballero que está de pie en un bosque con aspecto valiente». Elige después una dirección de orientación. La dirección no es cosmética: un juego cenital o en tres cuartos necesita cuatro, y cada una es una hoja separada con su propia silueta.

Dibujar frente a describir: dos formas de obtener un sprite

Dibujar y describir no son métodos que compitan. Fallan en direcciones distintas, y por eso el flujo de trabajo útil pone uno sobre la debilidad del otro.

Dibujar te da disciplina de paleta y una silueta que decidiste tú en lugar de una que aceptaste. Si declaras que el personaje tiene cinco colores más transparencia, impones cinco colores, y cada sprite del proyecto se mantiene coherente porque todos obedecen la misma restricción. El coste es el tiempo, y el techo es tu mano ese día.

Generar te da un primer borrador en segundos y, más útil aún, un abanico de opciones. Ejecuta la misma frase nominal con una semilla distinta y obtendrás variaciones que difieren en proporción y equipo: hombros más anchos, un casco en lugar de una capucha, un arma más pesada. Elegir entre cuarenta es más rápido que dibujar uno, y te enseña qué es realmente el personaje. El coste es la inconsistencia: a lo largo de cuatro fotogramas generados, el mismo personaje puede desviarse dos píxeles en altura y vagar en la paleta.

Un flujo de trabajo alternativo a Pixelorama: genera la hoja y corrige a mano

Genera la hoja primero, luego reprodúcela a la velocidad objetivo y busca los fotogramas que se leen mal a tamaño pequeño. En una tira de cuatro fotogramas suelen ser dos. Redibuja esos dos y deja el resto: iguala la altura de los fotogramas vecinos, toma un color existente en lugar de elegir uno nuevo y corrige los pies para que el personaje no se deslice ni flote. Son quince minutos en lugar de dos horas, y el resultado es un sprite que de verdad has mirado.

Fotogramas, tiras y hojas

Los formatos de animación que sobreviven al contacto con un motor obedecen las mismas cuatro reglas. Tamaño de fotograma fijo: cada fotograma tiene exactamente el mismo ancho y alto, incluso cuando el personaje solo ocupa el centro. Fotogramas en una sola fila: una tira horizontal, de izquierda a derecha, sin empaquetado, sin recorte y sin una disposición ingeniosa que un importador malinterprete. Un bucle cuyo último fotograma enlaza con el primero: al fotograma cuatro le sigue el uno sin duplicado entre medias, así que la pose del cuatro debe ser un paso antes de la pose del uno, no la misma pose. Un número de fotogramas documentado: cuatro, seis u ocho, anotado junto al archivo, porque una tira no documentada es un juego de adivinanzas para quien la importa.

Por qué una caminata de cuatro fotogramas se lee como caminata mientras un reposo de cuatro fotogramas se lee como temblor: un ciclo de caminata tiene cuatro cambios grandes de silueta —contacto, paso, contacto opuesto, paso opuesto— y el ojo acepta cuatro muestras de un movimiento amplio. El reposo apenas cambia la silueta, así que cuatro fotogramas significan que las únicas diferencias son desplazamientos de un píxel en los hombros, que el ojo lee como ruido. El reposo quiere dos fotogramas, o de seis a ocho con un movimiento secundario real, como un pecho que respira o el borde de una tela que se mece. No uses cuatro para ambos porque en el panel de ajustes parezca simétrico.

Un personaje de 16 píxeles de alto tiene unos catorce píxeles utilizables una vez dibujado el contorno. Eso basta para la dirección de orientación, la forma de la cabeza, un objeto sostenido, un casco y la posición de las piernas. No basta para la expresión facial, los dedos, los pliegues de la ropa ni un arma que deba identificarse por tipo en lugar de apuntarse. Presupuesta antes de dibujar —cabeza 5, torso 6, piernas 5— y acepta que la cara son dos píxeles oscuros y nada más. A 32 píxeles de alto tienes boca, cinturón y un arma de dos tonos. A 64 ya estás dibujando en lugar de sugiriendo, y una caminata de cuatro fotogramas empieza a verse rígida porque el detalle añadido exige más muestras del movimiento.

Del sprite a una calle por la que caminar

Este es el paso que un editor 2D no da. En el constructor de juegos 3D, un PNG es una textura. Colocas un plano, asignas el sprite, pones el material sin iluminar o con iluminación ligera, y el personaje ocupa el mismo espacio de coordenadas que la calle, las paredes y la cámara. The Cyclops' Island es la demo que hay que mirar: personajes de píxeles, isla de bajo poligonaje y una cámara que tú diriges. Mini World hace lo mismo a menor escala, y una escena de pixel art de Opus muestra la disposición contraria, donde el propio entorno está limitado a píxeles y los sprites son los únicos bordes nítidos del encuadre.

Dos modos de colocación cubren casi todos los casos. Un plano es un cuadrilátero vertical en el mundo, rotado a un ángulo fijo. Se lee como un personaje en un diorama, y revela su delgadez en cuanto la cámara orbita más de unos 60 grados, así que encaja con ángulos de cámara fijos o limitados. Un cartel gira para mirar a la cámara. Para un juego cenital en tres cuartos, usa un cartel solo en el eje Y: gira alrededor del eje vertical y bloquea la inclinación, o el sprite se inclina hacia atrás cuando la cámara desciende y el personaje parece estar tumbado en el suelo.

La escala es donde la mayoría de los primeros intentos se ven mal. Fija un píxel del sprite a una fracción conocida de una unidad del mundo y no la cambies nunca. Si el personaje mide 32 píxeles de alto y debe medir 1,8 unidades, el plano mide 1,8 unidades de alto y 1,8 de ancho para un fotograma cuadrado. Mantén el multiplicador en un número entero. Un plano a 1,35× la cuadrícula de píxeles nativa produce anchos de píxel desiguales —algunas columnas caen en dos píxeles de pantalla y otras en uno— y todo el personaje vibra cuando la cámara se mueve. Luego ancla: los pies se apoyan en el borde inferior del plano, y ese borde toca el suelo, no el centro del plano.

Por qué los bordes de píxel duros junto a un entorno suave son una elección

El lado 3D tiene cielo con degradado, sombras filtradas y geometría con antialiasing. El sprite no tiene nada de eso. El desajuste es una señal de profundidad: el personaje resalta del fondo porque es el único elemento del encuadre que está cuantizado. También es más barato de crear que un personaje 3D con esqueleto y animaciones. Si suavizas el sprite con un desenfoque o un mipmap para «igualar» el entorno, pierdes el resalte y conservas el coste.

• Filtro de texturaNearest. Muestreo por puntos, nunca lineal.
• MipmapsDesactivados. Los mipmaps promedian píxeles vecinos y convierten un contorno duro en una papilla gris a distancia.
• Filtrado anisotrópicoDesactivado, o 1×. Reintroduce la suavidad que acabas de quitar.
• Escala del planoUn múltiplo entero del tamaño de píxel nativo, con el pivote en los pies.

Gratis, sin instalación y sin cuenta

La parte gratuita cubre todo el bucle descrito arriba: el editor de sprites, el campo de generación, las herramientas de dibujo, capas, fotogramas, exportación PNG como un solo fotograma o como tira horizontal, y la colocación de ese PNG en una escena 3D por la que puedes caminar. No hace falta cuenta para probarlo y no hay marca de agua en la exportación.

Vale la pena nombrar los límites antes de dedicarle una tarde:

Dónde es peor una alternativa a Pixelorama

Sin API de scripts. Si necesitas renombrar fotogramas por lotes, hornear un atlas o controlar el editor desde un script de compilación, no hay nada a lo que engancharse.

Sin ecosistema de plugins. La vía de extensión de Pixelorama permite que otras personas añadan exportadores y herramientas; aquí obtienes lo que se publicó.

Sin un editor de tilemaps profundo. No hay cuadrícula de autotiling, ni creación de colisiones por baldosa, ni empaquetado de tilesets. Si el proyecto es un juego 2D de tilemaps, construye el mapa en un motor.

Límites de lienzo. El espacio de trabajo está pensado para lienzos del tamaño de un sprite. De 16×16 a 128×128 por fotograma es el rango cómodo y 256×256 funciona, pero esta no es la herramienta para una ilustración de 4000 píxeles con cuarenta capas; el conjunto de herramientas y el comportamiento del zoom dejan de ser agradables mucho antes de eso.

La generación no es determinista ni está libre de correcciones. Mismo prompt, semilla distinta, resultado distinto. Descartarás más de lo que conserves, y descartar es el trabajo.

Una herramienta solo es una alternativa si puedes nombrar dónde es peor. Esto es lo nuestro. Usa esta para el bucle de sprite a escena y mantén Pixelorama instalado para el trabajo que necesita una vía de extensión real, edición sin conexión y una paleta indexada que puedas bloquear.

Entra en el mundo al que pertenece

Una hoja de sprites es un material sin ningún lugar donde estar. El último paso de esta página es el que un editor de escritorio no puede ofrecer: colocar la hoja en un mundo por el que alguien pueda caminar; cada mundo del constructor se creó a partir de una descripción escrita y se publicó como una página con un enlace.

FAQ