La IA aplicada al diseño
MasterClass · Decom Caquetá

La IA aplicada al diseño

Cómo usar JSON para estructurar la IA

Jonatan Arzayús · GENIAL.STUDIO
Diseñador visual
el ADN visual de tu diseño
La trampa del lenguaje natural

Todo se ve igual

La IA nos dio superpoderes… y a todos el mismo estilo.

Afiche hecho con IA
Afiche hecho con IA
Afiche hecho con IA
Afiche hecho con IA
Afiche hecho con IA
Afiche hecho con IA
Afiche hecho con IA
Afiche hecho con IA
Afiche hecho con IA
mismo encuadre, misma luz,
mismo brillo plástico
Quién te habla

Jonatan
Arzayús

Diseñador visual

FICHA
rol: "diseñador visual"
marca: "GENIAL.STUDIO"
superpoder: "velocidad"
herramienta: "IA + JSON"
GENIAL.STUDIO
mi propia marca ↗
No vengo a hacerte diseñador.
Vengo a hacerte rápido.
¡zas!
Parte 01

Fundamentos

Qué es un prompt y por qué el JSON cambia el juego.

Fundamento 01

Qué es un prompt

Un prompt es hablar con la computadora.

CHAT · IA
hazme un diseño bonito para un evento juvenil
¡Listo! …el mismo de siempre.
La pregunta no es qué le pides.
Es cómo se lo dices.
Fundamento 02

El hackeo del ADN visual

Deja de pedir en lenguaje natural.

¡Especifica!!
Menos
alucinaciones
Lenguaje natural
92%
Instrucción en JSON
18%
Probabilidad de que la IA “invente” — gráfico ilustrativo
Fundamento 03 · Específica

Pedir vs. instruir

PROMPT SUELTO
«un diseño bonito para un evento juvenil»
¿bonito según quién?
¿qué luz? ¿qué color? ¿qué lente?
→
INSTRUCCIÓN EN JSON
{
  "escena": "retrato editorial",
  "luz": "hora dorada, lateral",
  "lente": "85mm, f/1.8",
  "paleta": ["#0D0D0D", "#BFF549"],
  "textura": "grano de película",
  "texto": "ninguno"
}
cada llave = una decisión
Parte 02

El proceso

De una referencia a una campaña animada en 6 pasos.

Las herramientas

Tu equipo

01 · Analiza
GGPTC
Gemini · ChatGPT · Claude

Extrae el ADN de la imagen en JSON. Último modelo pro.

02 · Crea
FL
Flow

Subes la referencia, pegas el JSON y genera imagen y video.

03 · Modelo
NB2
Nano Banana 2

El modelo de imagen que crea el nuevo diseño.

La ruta

6 pasos

1Preparar el lienzo
2Extracción del ADN
3Hackeo de variables
4Itero
5Animación
6Pulir
1
Paso 1 · Referencia

Paso 1 · Preparar el lienzo

  1. aBusco una imagen que me sirva como referencia.
  2. bLa llevo a la IA: Gemini, ChatGPT o Claude (último modelo pro).
Referencia · Vasijas.jpg
Referencia
una que ya te encante ✓
2
Paso 2 · Gemini / ChatGPT / Claude

Paso 2 · Extracción del ADN

PROMPT
Analyze this image containing typography and branding elements, and extract the details into a structured JSON format. Focus heavily on exact text content, font styling, and logo characteristics…
Referencia
texto · título
fecha
logo
vasija
1 · Subo la imagen
SALIDA · JSON
{
  "background_context": {
    "main_visual_subject": "Round clay vessel… liquid gold…",
    "mood": "Divine abundance…"
  },
  "text_elements": [ {
    "exact_text_string": "OVER",
    "font_style": "calligraphic swash…",
    "color": "#8B5A1B"
  }, … ],
  "logo_elements": [ … ]
}
0 / 3
clic para empezar
3
Paso 3 · Flow + Nano Banana 2

Paso 3 · Hackeo de variables

SALIDA.MD · LA EDITO CON MI INFO
"exact_text_string": "OVER Flow" Lema
"exact_text_string": "VINE BRANCH CHURCH" Iglesia
"exact_text_string": "17TH MAY · 9AM" Fecha
"exact_text_string": "Vine Branch Church Apata…" Versículo
Generar · Nano Banana 2
Referencia
Referencia
Resultado · Vasijas Llenas
Resultado
0 / 5
clic para hackear
nota: las variables dependen de lo que haya en la referencia
4
Paso 4 · Flow

Paso 4 · Itero

PROMPT
Borra el logo…
PIDO REVISO AJUSTO ×N
Iterar: repetir un proceso varias veces para acercarte a un objetivo, mejorando el resultado en cada ciclo.
V1 · logo inventado por la IA
V1 · logo inventado
la IA inventó
el logo ✗ →
5
Paso 5 · IA + Flow

Paso 5 · Animación

ENTRADA · A LA IA
genera un json prompt para tener una animación, respetando todos los parámetros de la imagen…
PROMPT_ANIMACION · A FLOW
{
  "input": { "type": "image_to_video", "use_as_first_frame": true },
  "output": { "aspect_ratio": "3:4", "duration_seconds": 8 },
  "camera": { "movement": "very slow push-in…" },
  "negative_prompt": ["text distortion", "morphing letters", …]
}
"timeline" · 8 s
0–2 sFundido desde luz suave; brilla la boca de la vasija.
2–5 sEl aceite fluye, ondas en el charco, chispas doradas.
5–8 sRayos de luz; cierra en una composición estable.
texto y logo: ¡que no se muevan!
Imagen sin logo para animar
Sin logo → Flow
6
Paso 6 · Acabado

Paso 6 · Pulir

Logo IPUC
A · Logo al final

Subo el logo real al final, para que la IA no lo cambie.

Versión horizontal
B · Versión horizontal

Hago la otra versión: horizontal, misma identidad.

Video con logo
C · Logo en el video

Pongo el logo en el video.

El resultado

De referencia a campaña

Referencia
Antes
→
Versión horizontal
Horizontal
6 pasos. Un sistema.
Ahora te toca

Deja de pedir. Especifica.

decom.genial.studio
Prompts, JSON y recursos de esta clase
Jonatan Arzayús · GENIAL.STUDIO
Diseñador visual
WhatsApp318 831 6814 Escanea
GENIAL.STUDIO · La IA aplicada al diseño
01 / 19
←→ avanzar · F pantalla completa · clic: ampliar

ESC · CERRAR