18 · Illustration Style

18 — Illustration Style

Versión: 0.1 Última actualización: 2026-04-24

Filosofía

Las ilustraciones son el signal anti-AI-default más visible. La mayoría de productos que usan AI image generation salen con estéticas clichés (futurismo purple, hologramas, 3D brillante). Academia Agentes rechaza eso explícitamente.

Nuestro estilo: ilustración editorial flat con geometría inspirada en muralismo mexicano moderno. Piensa Pictoline conocido mundialmente por su estilo; Rufino Tamayo abstracciones; papel picado geométrico; revistas editoriales mexicanas cuidadas.

El estilo en 5 principios

1. Geometría intencional, no orgánica ni 3D

Figuras con silhouettes claras, aristas definidas, planes de color uniforme. Nada “orgánico flowing” ni “realistic rendered”.

2. Paleta limitada del brand

Máximo 4-5 colores por ilustración, todos de nuestra paleta:

Base: ink o paper
Primary: terracotta
Secondary: añil
Optional accents: nopal, cempazúchil, oxblood
NUNCA mezclar con neones, gradients glow, o colores fuera de paleta

3. Bold silhouettes sobre background calmado

La composición tiene un sujeto claro y un espacio negativo respetuoso. Nada de “fondo lleno de detalles”.

4. Simbolismo funcional, no decorativo

Cada elemento de la ilustración significa algo específico del concept. Si es para “CLAUDE.md”, el pergamino con letras es más directo que una abstracción genérica.

5. Subtle paper / screen print texture

Ligera textura de impresión serigrafía (grain, ligero misprint) — no fotorealista, pero tangible.

Referencias canónicas

Estudiar, internalizar, NO copiar:

Pictoline (@pictoline) — journalism gráfico mexicano, flat + bold + limited palette
Rufino Tamayo — abstracciones con color dense, figuras geométricas
Miguel Covarrubias — caricatura mexicana mid-century
Mid-century editorial illustration — The New Yorker 1950-60s, Saul Steinberg
Tom Froese illustrations — geometric mid-century contemporary
Brian Rea (NYT editorial illustrator) — rough but refined
Malika Favre — bold geometric shapes, limited palette

Rechazar explícitamente:

❌ Midjourney/DALL-E default aesthetic (cinematic lighting, shallow DOF)
❌ Vector illustrations de Freepik/Flaticon (genéricos corporate)
❌ 3D renders (Spline/Blender style)
❌ Cyberpunk / futuristic UI
❌ Hand-drawn cutesy (tipo Notion illustrations genéricas)

Cuándo usar ilustración (vs diagrama vs screenshot)

Tipo	Cuándo	Ejemplo
Ilustración custom	Concepts abstractos, hero de chapter, momentos emocionales	”El problema del iceberg” en Ch1
Diagrama técnico	Flujos de datos, arquitectura, relaciones entre entidades	Jerarquía settings.json
Screenshot / mockup	Mostrar exactamente UI/output real	Terminal con `claude --help`
Icono simple	Navegación, etiqueta, badge	Emoji del theme de chapter

Regla de oro: si la imagen sirve para decoración (no clarifica concept), no va. Cada ilustración gana su lugar.

Templates de prompts para Gemini Imagen

Template base (SIEMPRE incluir)

An editorial illustration in the style of modern Mexican graphic journalism
(like Pictoline), flat geometric shapes with bold silhouettes, limited
palette of terracotta (#d67a3c), deep indigo (#2a3a6b), and warm cream
(#f4ecdf), subtle paper screen-print texture.

Composition: [subject] on [spatial arrangement].

Style: NOT 3D, NOT photorealistic, NOT neon, NOT digital glow, NOT
cyberpunk, NOT generic AI futurism. Inspired by Tamayo abstraction and
mid-century editorial illustration. Bold outlines, flat color, intentional
geometry.

No text, no watermark, no signatures.

Sub-templates por tipo

Hero illustration de chapter (grande, evocativo)

[Base template]

Subject: a visual metaphor for [concept — e.g., "an ecosystem of
interconnected layers shown as stacked geometric forms like papel picado"].
The illustration should fill a 16:9 frame with ample negative space.
Single-color dominant (terracotta) with accent secondary (indigo).

Concept spot illustration (mediana, clarifica un punto)

[Base template]

Subject: a stylized representation of [specific concept — e.g., "a
scroll-like document labeled as the 'instruction book' being read by
a robotic hand"]. Central composition, balanced. 1:1 or 4:3 frame.

Chapter marker / thematic icon (pequeña, identifica)

[Base template]

Subject: a single iconic shape representing [chapter topic — e.g.,
"a layered hexagonal form like stacked roof tiles"]. Monochrome in
[chapter accent color]. Simple silhouette. 1:1 frame, minimal.

Ejemplos completos (para Lesson 1)

Ch1 hero — “El ecosystem”

An editorial illustration in the style of modern Mexican graphic
journalism (like Pictoline), flat geometric shapes with bold silhouettes,
limited palette of terracotta (#d67a3c), deep indigo (#2a3a6b), and warm
cream (#f4ecdf), subtle paper screen-print texture.

Composition: Five stacked geometric layers rising from a base, each layer
a different shape (rectangle, hexagon, circle, triangle, rhombus) — like
tiers of a Mesoamerican pyramid but abstract and modern. Each layer is a
slightly different shade of terracotta and indigo. A small simple figure
stands at the base looking up. Ample negative space above.

Style: NOT 3D, NOT photorealistic, NOT neon, NOT digital glow. Inspired
by Tamayo abstraction. Bold outlines, flat color, intentional geometry.

No text, no watermark, no signatures.

Ch4 hero — “CLAUDE.md: instrucciones que Claude recuerda”

[Base template]

Composition: A scroll-like rolled document with visible text lines (shown
as simple horizontal strokes, no readable characters) resting on a simple
wooden-looking desk surface. Next to it, a simple geometric figure (the
robotic helper) leans in to read. The scroll has a warm cream color with
indigo text marks. Terracotta accents on desk edges. Composition 4:3.

[Base style rules]

DO / DON’T — examples concretos

✅ DO

Flat colors con slight texture grain
Silhouettes claras con max 1-2 secondary elementos
Paleta de 3-4 colores max por ilustración
Negative space intencional (35-50% del frame vacío OK)
Symbolism directo pero no obvio (pergamino para instrucciones, no icono de libro)
Composition con balance asimétrico (regla de tercios, no centered boring)

❌ DON’T

Gradientes smooth hi-fi (evita lo “AI-rendered”)
Shadows heavy realistic (flat = flat, incluso si hay depth)
Brillos / highlights / glow / light rays
Full scenes pobladas (tipo “bustling office”) — todo debe ser enfocado
Mezcla de styles (ilustración + 3D + foto = no)
Copy pasted generic icons from Freepik/SVG repos
Character design tipo Notion / Alegria (muñequitos corporate genéricos)
“Tech aesthetic” futurista — hologramas, grids infinitos, matrix

Iteración y refinamiento

Cuando Gemini Imagen entrega algo:

Primera pasada: ¿respeta el prompt?
Test anti-AI: ¿tiene alguno de los tells? (gradientes, glow, 3D, neon)
Test de marca: ¿usa la paleta correcta? ¿se siente editorial?
Si falla 1 de los 2 tests: refinar prompt con más negatives (“no gradient, no glow, no 3D, no neon”)
Si falla ambos: probablemente el prompt base no es lo suficientemente específico; re-estilizar

Max 3 intentos por imagen. Si después de 3 Gemini no da, pasar a:

Stock curado (Iconduck, Blush.design con filtro manual)
SVG simple dibujado por Claude con reglas estrictas
O simplemente usar un icono limpio + bold typography (no todo necesita ilustración)

Verificación antes de publicar

Cada ilustración pasa 5 checks:

Usa SOLO colores de la paleta del brand
No tiene tells de AI default (gradient smooth, glow, 3D render, neon)
Tiene purpose (clarifica el concept, no es decoración)
Tamaño apropiado (no bloquea el flow de lectura)
Se ve bien en dark mode (la mayoría de views)

Si cualquiera falla → regenerar o reemplazar.