Clase 173 — Dirección de arte y coherencia visual

Parte: 9 — Arte, animación y pipeline de assets · Fuente: "The Art of Game Design" (Schell); guías de estilo de estudios (GDC talks de art direction) ⏱️ Duración estimada: 75 min · Nivel: Intermedio


🎯 Objetivo

Un juego puede tener buenos assets individuales y aun así verse incoherente si cada pieza "habla otro idioma" visual. La dirección de arte es la disciplina que define ese idioma común —paleta, formas, proporciones, texturas— y lo documenta para que todo el equipo (o tú solo, en distintas semanas) produzca material consistente. En esta clase pasas de decisiones intuitivas a un sistema explícito.

Al terminar habrás armado un moodboard que captura la intención visual de un juego y una mini style guide con paleta, lenguaje de formas y una tabla de "do / don't". Estos documentos son el ancla que evita que tu proyecto derive hacia el caos visual a medida que crece.

📚 Resultados de aprendizaje

Al finalizar, el alumno podrá:

  1. Definir pilares visuales que traduzcan el tono del juego en decisiones concretas.

  2. Construir un moodboard de referencia coherente y no meramente decorativo.

  3. Documentar una paleta maestra y un lenguaje de formas en una style guide.

  4. Especificar reglas de "do / don't" que hagan la guía accionable.

  5. Auditar assets existentes contra la guía para detectar incoherencias.

🗺️ Temas

# Tema Por qué importa
1 Qué es la dirección de arte Define el criterio unificador del proyecto.
2 Pilares visuales Convierten un "feeling" en reglas verificables.
3 Moodboard Alinea al equipo antes de producir assets.
4 Paleta maestra Garantiza que todo comparta el mismo color base.
5 Coherencia de formas y proporciones Hace que los assets "pertenezcan al mismo mundo".
6 Style guide Documenta las reglas para reproducirlas.
7 Do / Don't Evita errores repetidos y facilita el onboarding.
8 Uso de referencias Ancla el estilo en algo real y comunicable.

📖 Definiciones y características

🧰 Herramientas y preparación

Para el moodboard puedes usar Krita (https://krita.org/) o cualquier lienzo grande donde pegar recortes; para la style guide bastará una lámina en Krita o incluso un documento con capturas. Reúne primero 8–12 imágenes de referencia (juegos, ilustración, fotografía) que compartan el tono que buscas. Importante: las referencias son para analizar, no para copiar píxel a píxel.

Crea un lienzo de 1920×1080 px para el moodboard y otro de 1280×1280 px para la guía. Ten definido de antemano el género y el tono del juego ficticio que dirigirás (por ejemplo: "plataformas relajante, mundo vegetal").

🧪 Laboratorio guiado

Dirigiremos el arte de un juego ficticio y lo dejaremos documentado.

  1. Define en una frase los pilares visuales. Ejemplo para un plataformas relajante: "colores pastel, formas redondeadas, cero puntas agresivas, contornos suaves". Escríbelos en una capa de texto.

  2. Monta el moodboard: en el lienzo de 1920×1080 coloca tus 8–12 referencias en una cuadrícula. Agrúpalas por criterio: una fila de paleta/atmósfera, una de personajes, una de entornos.

  3. Extrae la paleta maestra del moodboard: usa el selector de color de Krita sobre las referencias y toma 6–8 muestras representativas. Píntalas como una tira de swatches con su código hex anotado.

  4. Abre el lienzo de la style guide. Coloca arriba el título y los pilares; debajo, la tira de paleta maestra con nombres ("verde follaje", "crema", "acento coral").

  5. Documenta el lenguaje de formas: dibuja 3 siluetas de ejemplo (héroe, enemigo, objeto) usando solo las formas permitidas por tus pilares. Anota junto a cada una la regla ("héroe: base circular, sin ángulos > 90°").

  6. Fija proporciones: define una relación de cabeza-cuerpo (p. ej. 1:2, estilo chibi) y dibújala como referencia. Esto evita que un asset salga realista y otro caricaturesco.

  7. Crea la tabla Do / Don't: dos columnas de mini-ejemplos. "Do: contornos redondeados y paleta pastel". "Don't: puntas afiladas, colores saturados fuera de paleta, gradientes ruidosos".

  8. Exporta ambos lienzos a PNG. Tendrás tu moodboard y tu mini style guide, listos para dirigir la producción de las clases siguientes.

Entregable visual: dos PNG —un moodboard organizado por criterio y una mini style guide con pilares, paleta maestra, lenguaje de formas, proporciones y una tabla do/don't.

✍️ Ejercicios

  1. Reescribe tus pilares visuales para un tono opuesto (p. ej. terror) y observa cómo cambia la paleta.

  2. Amplía el moodboard con una fila específica de "iluminación y atmósfera".

  3. Nombra cada color de la paleta con un término evocador y justifícalo.

  4. Diseña una cuarta silueta (un aliado) respetando el lenguaje de formas ya definido.

  5. Agrega dos filas más a la tabla do/don't sobre tipografía o UI.

  6. Toma un asset ajeno y decide si "pertenece" a tu guía; explica qué habría que cambiarle.

📝 Reto verificable

Dirige el arte de un juego ficticio entregando una mini style guide de una sola página que incluya: los pilares visuales, una paleta maestra de 6–8 colores con códigos hex, tres siluetas que respeten el lenguaje de formas, una referencia de proporciones y una tabla do/don't de al menos 3 filas.

Criterio de aceptación: las tres siluetas usan únicamente colores de la paleta declarada y respetan las reglas de forma y proporción de los pilares; la tabla do/don't muestra pares coherentes; un tercero podría producir un asset nuevo consistente usando solo la guía.

⚠️ Errores comunes

Síntoma Causa y arreglo
El moodboard es "bonito" pero no guía nada Referencias sin criterio. Agrúpalas por función (paleta, personaje, entorno).
Cada asset usa colores distintos Falta paleta maestra fija. Deriva todo de 6–8 colores y prohíbe salirse de ellos.
Personajes que no parecen del mismo mundo Proporciones inconsistentes. Define una relación cabeza-cuerpo y respétala.
La guía se ignora en la práctica Reglas vagas. Sustituye texto abstracto por ejemplos do/don't visuales.
El estilo deriva a mitad del proyecto No hay documento ancla. Mantén la style guide actualizada y consúltala.

❓ Preguntas frecuentes

❓ ¿No basta con tener "buen gusto"? El gusto ayuda, pero un equipo (o tú en distintas semanas) necesita reglas explícitas para no divergir.

❓ ¿Un moodboard es copiar referencias? No. Se usan para extraer paleta, tono y formas, no para reproducirlas literalmente.

❓ ¿Cuánto debe ocupar una style guide? Empieza con una página; crece solo si el proyecto lo exige. Una guía que nadie lee no sirve.

❓ ¿Puedo cambiar la dirección de arte a mitad de camino? Sí, pero implica revisar todos los assets contra la nueva guía; por eso conviene decidirla temprano.

🔗 Referencias

⬅️ Clase anterior

Clase 172 - Fundamentos de arte para desarrolladores

➡️ Siguiente clase

Clase 174 - Pixel art: fundamentos y Aseprite