Pixel art · Probado
Crea un tileset de pixel art sin costuras con IA (y arregla las juntas)
Un tileset es el conjunto de pequeñas imágenes cuadradas que un juego 2D repite para construir su mapa: hierba, caminos, agua, suelos. Los modelos de imagen ya dibujan hojas de tileset convincentes en segundos. La pregunta para quien hace un juego es si las casillas encajan de verdad cuando el motor las repite.
El 28 de septiembre de 2026 generamos en Ciyo un tileset para Mossfall, un juego acogedor de granja ficticio. Después probamos la hoja como la usa un motor de juego, casilla a casilla, y arreglamos la peor junta con Quick Edit (edición rápida) de Ciyo.
La hoja en un solo prompt
Pedimos una hoja de 4 por 4 con 16 casillas, cada una de 16 por 16 píxeles de juego, con una paleta de 16 colores y todas las casillas sin costuras. GPT Image 2.5 Flare en el Image Generator (el generador de imágenes) de Ciyo devolvió una hoja de 1024 × 1024 por 2 créditos.
A primera vista es justo lo que pedimos: hierba, flores, caminos, agua, una orilla, piedra, tablones, una valla, un arbusto y tierra labrada, en un estilo de pixel art limpio con vista cenital.
Una hoja de tileset en pixel art para un acogedor juego de granja 2D con vista cenital llamado Mossfall: una cuadrícula de 4 por 4 con 16 casillas cuadradas sin huecos entre ellas. Cada casilla mide 16 por 16 píxeles de juego, dibujada con píxeles cuadrados y nítidos, una paleta limitada de 16 colores y sin antialiasing. Casillas: hierba lisa, hierba con flores, camino de tierra horizontal, camino de tierra vertical, cuatro esquinas de camino de tierra, cruce de caminos de tierra, agua, orilla de agua con hierba, suelo de piedra, suelo de tablones de madera, valla de madera, arbusto pequeño, tierra labrada. Cada casilla debe encajar sin costuras con sus vecinas. Sin texto, sin etiquetas, sin líneas de cuadrícula.Cinco comprobaciones antes de importarla
Un motor de juego no ve una imagen. Corta la hoja en cuadrados y repite cada cuadrado. Así que cortamos la hoja de la misma manera y la medimos. La cuadrícula era correcta: los bordes de las casillas caen exactamente en los píxeles 256, 512 y 768. Casi todo lo demás necesitaba trabajo.
| Comprobación | Pedido | Obtenido |
|---|---|---|
| Cuadrícula | 4 × 4 casillas | 4 × 4 casillas de 256 px, exacta |
| Píxeles de juego por casilla | 16 × 16 | Unos 32 × 32 (bloques casi siempre de 7–8 px de ancho) |
| Colores | 16 | 143,372 (bordes suaves y textura) |
| Líneas entre casillas | Ninguna | Una línea oscura de 1–2 px en cada borde de casilla |
| Casillas independientes | Cada casilla por sí sola | Algunos caminos pasan por dos casillas |
La prueba de las juntas
Una casilla no tiene costuras cuando su borde izquierdo continúa su borde derecho, y su borde superior continúa el inferior. Medimos el salto de color a través de cada borde y lo comparamos con el paso normal entre dos píxeles vecinos dentro de la casilla.
En la hierba lisa, el salto en el borde era de 3 a 4 veces el paso normal, y en el agua, unas 7 veces. El suelo de piedra era el peor: 38.1 en el borde lateral frente a un paso normal de 3.4, once veces más. Repetido en 3 × 3, muestra líneas verticales y horizontales claras donde las piedras quedan cortadas por la mitad.
Arregla la junta con Quick Edit
El arreglo clásico es desplazar la casilla la mitad de su tamaño en las dos direcciones, para que los bordes antiguos se encuentren en una cruz en el centro, reparar el centro y volver a desplazarla. Hicimos la copia desplazada, la subimos al tablero de Ciyo y pedimos a Quick Edit que redibujara solo la cruz. Cada ejecución de Quick Edit aparecía marcada con +5 créditos, y cada resultado volvió a 2048 × 2048, el doble del tamaño de entrada.
La primera ejecución unió los bordes superior e inferior: esa junta bajó de 34.2 a 8.3. Pero dibujó una línea de mortero oscura y recta por el centro, lo que empeoró la junta lateral, de 37.9 a 45.4. Una segunda ejecución que nombraba el problema eliminó la línea.
Hay una línea vertical oscura y recta que baja por el centro exacto, de arriba abajo. Elimínala: deja que las piedras de ambos lados se unan en piedras enteras que crucen el centro, con un mortero que zigzaguee de forma natural. Mismo estilo de pixel art, mismo tamaño de píxel y mismos colores. Deja sin cambios el cuarto exterior de cada lado.El resultado, repetido
Después de la segunda ejecución volvimos a desplazar la casilla y la medimos otra vez. La junta lateral da 2.2 y la superior 8.1, frente a un paso normal de 3.9, así que ahora los dos bordes quedan cerca de la propia textura de la casilla. Repetido en 3 × 3, el suelo de piedra se lee como una sola superficie continua.
Quick Edit también cambió un poco las partes exteriores de la casilla, no solo el centro, así que compara la casilla entera con la original antes de sustituirla en tu juego.
Un flujo de trabajo que se sostiene
Usa la hoja generada como guía de estilo y como fuente de casillas sueltas, no como un recurso terminado. Para cada casilla que conserves, quita la línea del borde, prueba las juntas repitiéndola en 3 × 3, arregla una junta cada vez con un Quick Edit preciso y ajusta la casilla final a tu tamaño de píxel y a tu paleta reales.
Genera las piezas de camino como casillas separadas y no como una sola hoja. En nuestra hoja, las esquinas y el camino vertical alto cruzaban los bordes de las casillas, así que solo funcionan en la disposición exacta que dibujó el modelo.
Tilesets de pixel art con IA
¿Puede la IA hacer un tileset sin costuras?
Puede dibujar una hoja convincente, pero en nuestra prueba del 28 de septiembre de 2026 los bordes de las casillas no encajaban: la junta de la casilla de piedra era 11 veces su paso normal entre píxeles. Prueba cada casilla repitiéndola antes de usarla.
¿Respeta el modelo mi tamaño de píxel y mi paleta?
No exactamente. Pedimos casillas de 16 × 16 y 16 colores, y obtuvimos unos 32 × 32 píxeles de juego por casilla y 143,372 colores. Ajusta después las casillas a tu cuadrícula y a tu paleta.
¿Cómo arreglo una junta?
Desplaza la casilla la mitad de su tamaño, para que la junta pase por el centro, repara el centro con un Quick Edit preciso y vuelve a desplazarla. Necesitamos dos ejecuciones de Quick Edit para arreglar la casilla de piedra.
¿Cuánto costó?
La hoja costó 2 créditos de Ciyo y cada ejecución de Quick Edit aparecía marcada con +5 créditos.
Dibuja tus casillas en Ciyo
Genera un tileset con el estilo de tu juego y después repara cada junta con Quick Edit en el mismo lienzo.