luisfer-cli/pixel-art-pix-skill

Pixel Art con pix

Usa esta habilidad cuando el usuario solicite pixel art, sprites, iconos, logos, activos de juego, fotogramas de animación, hojas de sprites, GIFs o archivos .pix.

Principios no negociables

• Priorizar la legibilidad sobre el detalle.
• Trabajar en resolución nativa; nunca diseñar arte de alta resolución y luego reducirlo mentalmente.
• Usar bordes duros, coordenadas enteras y sin antialiasing.
• Usar una paleta limitada con roles explícitos de contorno, sombra, base, brillo y acento.
• Construir grupos de color intencionados en lugar de píxeles dispersos.
• Mantener una dirección de luz consistente en todo el activo y en todos los fotogramas de animación.
• No afirmar finalización solo con la validación de sintaxis. Renderizar e inspeccionar visualmente el resultado.

Regla antirruido

No agregues estrellas flotantes, destellos, polvo, partículas, acentos en esquinas o píxeles decorativos aislados a menos que el usuario los solicite explícitamente.

Para logos, iconos, activos de interfaz y sprites con fondo transparente:

• por defecto, cero componentes decorativos desconectados;
• mantener un margen de seguridad limpio alrededor del sujeto;
• preferir una silueta primaria compacta;
• no usar el espacio vacío del lienzo como una invitación para agregar decoración;
• no agregar un grupo llamado sparkles, stars, dust, particles o similar a menos que se haya solicitado o sea esencial para el sujeto.

Cada grupo visible debe cumplir al menos un propósito claro:

1. silueta o estructura;
2. forma, iluminación o material;
3. una característica identificativa;
4. decoración ambiental solicitada.

Si un grupo no se puede justificar en una oración corta, elimínalo. Los píxeles individuales son aceptables solo cuando son funcionales, como una pupila, un brillo especular, el final de una diagonal o un rasgo facial necesario.

Flujo de trabajo requerido

1. Aclarar el brief. Establecer tamaño del lienzo, sujeto, tipo de activo, estilo, restricciones de paleta, fondo y exportaciones. Si no se solicitó decoración, asumir ninguna.
2. Establecer criterios de aceptación. Elegir las reglas relevantes de Criterios específicos por activo.
3. Planificar antes de dibujar. Definir la silueta, formas principales, roles de paleta, dirección de luz, punto focal y poses clave de animación.
4. Crear o editar el archivo fuente .pix. Nombrar grupos según su función semántica. Mantener la atmósfera opcional separada del sujeto.
5. Validar la fuente. Ejecutar pix check.
6. Renderizar a escala nativa. La salida nativa es la verificación visual autorizada.
7. Renderizar una vista previa ampliada. Usar escalado entero por vecino más cercano, normalmente --scale 8.
8. Inspeccionar visualmente. Verificar tanto los renders nativos como los ampliados contra fondos transparentes, claros y oscuros cuando el activo pueda aparecer en superficies variadas.
9. Ejecutar la pasada de limpieza. Clasificar cada componente desconectado y grupo de color sospechosamente pequeño. Eliminar cualquier cosa no intencional.
10. Auditar cuando sea posible. Ejecutar scripts/audit_png.py sobre el PNG nativo. Tratar las advertencias como indicaciones de revisión, no como prueba automática de un error.
11. Revisar y renderizar de nuevo. Completar al menos una iteración de limpieza deliberada antes de finalizar una obra de arte nueva.
12. Exportar entregables finales. Generar los PNGs solicitados, fotogramas de animación, GIFs, hojas de sprites y metadatos.

Comandos principales

Validar y renderizar:

pix check asset.pix
pix render asset.pix -o asset-1x.png
pix render asset.pix -o asset-8x.png --scale 8

Renderizar un fotograma nombrado:

pix render asset.pix --frame frame-name -o frame-1x.png
pix render asset.pix --frame frame-name -o frame-8x.png --scale 8

Auditar un PNG nativo desde la raíz del repositorio de la habilidad:

python3 skills/pixel-art-pix/scripts/audit_png.py asset-1x.png

Exportar entregables de animación:

pix anim asset.pix -a animation-name --out-dir frames/
pix sheet asset.pix -a animation-name -o sheet.png --json sheet.json
pix gif asset.pix -a animation-name -o animation.gif

Criterios específicos por activo

Logos e iconos

• Usar una silueta dominante y un espacio negativo fuerte.
• Por defecto, cero componentes flotantes y cero partículas ambientales.
• Evitar acentos de un píxel en las esquinas a menos que aclaren la marca a 1x.
• Probar sobre fondos transparentes, claros y oscuros.
• Confirmar el reconocimiento a tamaño nativo y al tamaño de visualización de interfaz previsto.

Sprites de personajes y objetos

• La silueta rellena de negro debe seguir siendo reconocible.
• Ojos, armas, extremidades y otros identificadores deben leerse a 1x.
• Evitar texturas que compitan con la característica focal.
• Mantener las sombras de contacto adjuntas o claramente alineadas con el sujeto a menos que una sombra separada sea intencional.

Escenas y fondos

• Establecer jerarquía de primer plano, plano medio y fondo.
• Las partículas ambientales solo están permitidas cuando apoyan el entorno, la profundidad o el movimiento.
• Usar patrones de textura repetidos de manera intencionada; evitar el moteado aleatorio uniforme.

Animación

• Usar poses clave distintas en lugar de pequeños cambios arbitrarios de píxeles.
• Mantener paleta, iluminación y volúmenes consistentes entre fotogramas.
• Verificar la transición del bucle e inspeccionar cada fotograma individualmente.
• Asegurarse de que las partículas decorativas no parpadeen accidentalmente entre fotogramas.

Lista de verificación de limpieza obligatoria

No marcar el trabajo como completado hasta que cada respuesta sea satisfactoria:

• ¿El sujeto es reconocible a 1x?
• ¿La silueta comunica el sujeto sin detalle interior?
• ¿Cada componente desconectado tiene un propósito explícito?
• ¿Todas las marcas de un píxel son funcionales en lugar de relleno?
• ¿Se omitieron destellos, estrellas, polvo y acentos en esquinas no solicitados?
• ¿Los brillos están agrupados y alineados con una fuente de luz?
• ¿Las sombras y los puntos de contacto son intencionales?
• ¿La paleta es limitada y basada en roles?
• ¿El activo tiene márgenes limpios sin recortes accidentales?
• ¿Se inspeccionó a escala 1x y ampliada?
• ¿Se verificó sobre colores de fondo apropiados?
• ¿Se completó al menos una revisión de limpieza después del primer render?
• Para animación, ¿las poses clave son legibles y los bucles limpios?
• Para hojas de sprites, ¿los fotogramas están ordenados y nombrados claramente?

Informe de revisión visual

Al informar finalización, indicar brevemente:

• tamaño nativo del lienzo;
• exportaciones generadas;
• verificaciones visuales realizadas;
• si quedan componentes desconectados o grupos de color pequeños y por qué;
• cualquier decoración solicitada intencionalmente.

No describir pix check como validación visual. Esto valida la fuente, mientras que el renderizado y la inspección validan la obra de arte.

Referencias

Leer cuando sea útil una guía más profunda:

• Conceptos de pixel art
• QA visual y antirruido
• Referencia del DSL pix

Activos de ejemplo

• Slime animado limpio
• Antipatrón de insignia ruidosa
• Corrección de insignia limpia