En prensa · Revista Negocios Joan Arbó: «Si preparas bien el sistema, multiplicas la capacidad sin multiplicar el equipo»
Leer ↗ Conocimiento
Todo lo que sabemos, para llevar.
Guías técnicas, herramientas y descargas sobre diseño agéntico. El oficio del Instituto en abierto, en castellano, y creciendo cada pocas semanas. Lo de pago se solicita, no se compra.
Empieza aquí
La ruta del diseñador agéntico
Siete pasos con lo que ya está publicado, en orden. Gratis de punta a punta; al final mides cuánto has subido.
- 01
Entiende el campo
Qué es (y qué no es) un design system agéntico.
Diseño agéntico, la página pilar → - 02
Mide tu punto de partida
Seis preguntas, un score. Guárdalo: lo vas a batir.
El diagnóstico · 3 min → - 03
El cambio de mentalidad
Genotipo y fenotipo: por qué el sistema es la semilla, no el catálogo.
Guía · Genotipo y fenotipo → - 04
Primera práctica
Claude Code contra un design system real, sin ser developer.
Guía · Claude Code para diseñadores → - 05
El material del sistema
Tokens que un agente entiende: DTCG, intención, semántica.
Guía · Tokens que hablan al agente → - 06
Expón el sistema
El MCP server: que el agente consulte tu sistema, no lo recuerde.
Guía · MCP server para tu design system → - 07
Gobierna y evalúa
Controles del output y rúbrica de evaluación. Cierra el círculo: repite el diagnóstico y mide cuánto subiste.
Guía · Cuatro controles del output →
¿Terminaste la ruta? Repite el diagnóstico y compara tu score. Si el sistema ya te pide más que guías, solicita plaza en la Promoción 01.
El Instituto está nominado en los Premios Negocios 2026. Si te sirve lo que hacemos, un voto ayuda a que llegue a más diseñadores.
01El Parte · el diario del oficio
El diario del Instituto: un parte al día sobre estándares, herramientas y prácticas del diseño agéntico. Cada uno cita su fuente y lo firma una persona.
- FIGMA El MCP de Figma deja al agente reutilizar tu código, no recrearlo El MCP de Figma (Dev Mode) expone el diseño al agente en el IDE; con Code Connect, el código generado importa tus componentes reales en vez de inventarlos.
- W3C El formato de design tokens ya tiene versión estable La especificación de Design Tokens del W3C Community Group alcanzó su primera versión estable (2025.10): el vocabulario ya no vive en un JSON propietario.
- DOCUMENTACIÓN llms.txt: el README que tu sistema le da al agente Un fichero de texto en la raíz que ofrece a los modelos un mapa limpio del sitio. Pequeño, pero es la pieza más barata de la capa de exposición.
02Escritos · lo último
Guías técnicas del Instituto, en abierto. Publicamos una cada pocas semanas; vuelve por aquí.
- Cuatro controles que impiden que el agente rompa el sistema Nuevo Un agente produce demasiado rápido para revisarlo a mano. La salida no es inspeccionar cada pantalla, sino escribir cuatro controles automáticos (tokens, regresión visual, accesibilidad y contrato) que rechazan solos lo que se sale del sistema. Las fitness functions del diseño agéntico.
- Tokens que le hablan al agente Un valor de color es mudo: dice el qué, nunca el porqué. Con $extensions del estándar DTCG, cada token lleva su propia gramática (con qué se empareja, qué tiene prohibido, qué contraste garantiza) y el agente compone dentro de raíles en vez de adivinar.
- Genotipo y fenotipo: dejas de diseñar pantallas El diseñador agéntico trabaja el genotipo (tokens, reglas y semántica que la máquina lee), no el fenotipo (las pantallas visibles). El cambio de mentalidad que hace que un agente genere coherente en vez de improvisar.
- Los cuatro tipos de fallo agéntico (y por qué tres son culpa tuya) Cuando un agente rompe tu design system, la causa es una de cuatro: token, composición, contexto o interpretación. Un marco para arreglar la causa, no el síntoma.
- Figma MCP para design systems: el circuito diseño-código sin handoff Qué expone el servidor MCP de Figma, cómo lo consume un agente como Claude Code o Cursor, y qué tiene que tener tu design system para que el circuito funcione de verdad.
- Claude Code para diseñadores: el flujo completo sin ser developer Cómo un diseñador de producto usa Claude Code contra un design system real: configuración, skills, MCP y revisión de lo generado. Sin experiencia previa de terminal.
- Auditoría AI-readiness de un design system en 7 pasos Procedimiento completo para diagnosticar si un design system existente es consumible por agentes: fuentes de verdad, tokens, APIs de componente, principios, exposición, governance y plan de cierre.
- La empresa ante la IA: un manifiesto para el comité de dirección No va de adoptar herramientas: va de reordenar cómo decide, contrata y opera una organización cuando ejecutar deja de ser caro. Diez principios y un plan para el comité de dirección.
- Cómo se implementa un MCP server para tu design system Anatomía mínima de un servidor Model Context Protocol que expone los tokens, principios y componentes de tu sistema a un cliente agéntico.
- Cómo nace la innovación ahora que ejecutar cuesta casi cero La IA no trae la innovación: le quita el coste a ejecutar. Cuando construir cuesta casi cero, el cuello de botella deja de ser hacer y pasa a ser decidir. Un modelo de dónde y cómo nace la innovación cuando los agentes están disponibles.
- Cómo escribir principios de diseño que un agente pueda aplicar Procedimiento para convertir principios aspiracionales en reglas ejecutables: criterio binario, umbrales con números, contraejemplos y codificación en formatos que un agente puede consultar.
03Herramientas
Plantillas, rúbricas y playbooks pensados para usarse, no para guardarse. La versión corta de lo que se enseña a fondo en el programa.
- Contrato Contrato de dupla Quién decide el sistema y quién orquesta a los agentes — por escrito, antes del primer commit.
- Spec Spec de sistema de diseño agéntico La checklist por capas: vocabulario → componentes → reglas → exposición → governance.
- Plantilla Ficha de dupla publicable La plantilla del sello: no se autodescribe, enseña el Caso enviado.
- Playbook Playbook de orquestación agéntica La partitura para dirigir agentes sobre un design system sin perder el control.
- Ritual Protocolo de mesa sin agente La reunión donde la dupla decide solo con criterio humano — y deja acta.
- Rúbrica Rúbrica de evaluación agéntica Cómo juzgar lo que produce un agente: criterios observables, no gusto personal.
- Playbook Bóveda Obsidian para agentes (recolector de oficio) Obsidian no es un second brain de moda: es el genotipo en prosa versionable que el LLM usa para aprender y contrastar ejemplos.
- Playbook Emparejamiento por Caso (no por skill matrix) Cómo formamos duplas dentro del programa: el proyecto manda, no el radar de soft skills.
- Mapa Mapa semanas ↔ herramientas Qué objeto de este catálogo se usa en cada semana del bootcamp.
- Acta El tercero en la dupla (rol del agente) El agente no es silla: es herramienta con permiso acotado. Esta ficha lo nombra.
- Checklist Checklist de pack (venís juntos) Si ya sois pareja de oficio, esto decide si el pack entra o se disuelve en el filtro.
- Plantilla Carta a la empresa · por qué contratáis una dupla Texto listo para el hiring manager: la unidad no se ensambla en un proceso de selección.
- Ritual Rito de apertura de dupla (día 0) Primera hora juntos: inventario de dolores, no tour de herramientas.
- Mapa Registro de genotipo del sistema Lo que el sistema sabe como dato — frente a lo que solo vive en cabezas y capturas.
- Checklist Inventario de fuentes de verdad Qué puede consultar un agente hoy sin pedir permiso a un humano por Slack.
- Mapa Eje build vs ejecución Qué se hornea al compilar y qué debe operar en directo contra el registro.
- Contrato Tabla por defecto / por excepción Cada decisión del sistema: el agente la aplica solo, o pide tu visto bueno.
- Plantilla Plantilla de principio ejecutable De “accesible y claro” a una regla que un agente (y un linter) pueden evaluar.
- Mapa Mapa de superficie agéntica Qué puede leer, escribir o solo observar el agente en tu fábrica de interfaces.
- Checklist Protocolo anti-adivina Si el modelo recompone en vez de reutilizar, el mapeo está roto. Esta es la prueba.
- Script Vocabulario sin primitivos sueltos Auditoría rápida: ningún valor crudo en componentes si existe un token.
- Plantilla Prompt-system de componente El primer artefacto de la semana 01: el componente descrito como dato, no como captura.
- Patrón Compresor de tres veredictos Como en Lorsclub: no un 0–100. Tres estados discretos que ya son una decisión.
- Rúbrica Hoja de veredicto del panel (8 dimensiones) La rúbrica pública del demo day: el mismo juicio que el diagnóstico gratuito, a escala.
- Spec Golden set mínimo (12 piezas) Corpus curado de salidas correctas: sin esto, el agente no tiene norte ni el juez tiene vara.
- Playbook Juez con vara (no con vibes) Cómo escribir la rúbrica que evalúa al agente — y evita el sesgo del juez LLM.
- Contrato Umbral de merge del agente Qué score o veredicto permite abrir PR — y qué la bloquea sin debate.
- Plantilla Banco de contraejemplos etiquetados Lo incorrecto también se versiona: es el material con el que se entrena el juicio.
- Plantilla Carta del veredicto (post demo day) Plantilla de la carta del Instituto: dimensión a dimensión, sin adjetivos vacíos.
- Ritual Acta de defunción del handoff El ritual con el que se entierra la entrega diseñador→dev como proceso. No se “mejora”: se declara muerta.
- Plantilla Plantilla de defunción de proceso Cualquier proceso del equipo se puede enterrar con la misma gramática del Parte.
- Script Cementerio de tokens Tokens que ya no se usan: se archivan con fecha de muerte, no se dejan zombie en el tema.
- Acta Obituario de componente Cuando un componente muere, se escribe por qué — para que el agente no lo resucite.
- Ritual Retiro de excepción documentada Las excepciones también mueren: si ya no se justifican, se cierran en acta.
- Acta Entierro del “pixel perfecto” como KPI Se entierra la métrica que castiga al sistema y premia la captura estática.
- Checklist Lista negra de prompts muertos Prompts que generaban deuda: se retiran del wiki del equipo con causa.
- Patrón Agente con DNI (auth server-side) Patrón Bodados: el agente no es un chat anónimo. Cada acción lleva identidad y ownership.
- Script Guard de agente (plantilla de borde) La función que envuelve toda tool call: auth, rate, ownership, traza.
- Mapa Matriz de permisos por tool MCP Cada herramienta del servidor: lectura, escritura, o prohibida con datos PII.
- Patrón Atomic claim de acción irreversible Patrón de checkout/regalo: la acción costosa no se ejecuta dos veces ni a medias.
- Spec Traza mínima de salida del agente Qué dejó el agente: regla tocada, diff, humano firmante. Sin traza no hay governance.
- Contrato Lista de no-delegables Lo que el agente no hace nunca en tu organización — versionada como el código.
- Mapa Sandbox de escritura del agente Dónde puede escribir antes de tocar el registro sagrado.
- Checklist Kill switch de agente Cómo se apaga en 60 segundos sin apagar el producto.
- Mapa Escalera de autonomía L1–L3 L1 sugiere, L2 prepara PR, L3 opera con guardrails. Subir de peldaño es un acto político.
- Playbook Partitura de roles de agente No un mega-agente: roles con entradas y salidas como en un newsroom (La Vigencia).
- Plantilla Cola de excepciones del agente Todo lo que el agente no pudo resolver sin violar una regla cae aquí — no en un chat eterno.
- Plantilla Brief del orquestador (no del prompt) Lo que la silla de orquestación debe dejar escrito antes de enchufar modelos.
- Patrón Patrón cron self-healing De La Vigencia: si el pipeline editorial falla, el sistema se reintenta con triple schedule — diseño de resiliencia, no heroísmo humano.
- Spec Registro cerrado de componentes El agente solo instancia lo que está en el registro. Fuera de catálogo = excepción firmada.
- Mapa El BFF como sede del orquestador Dónde vive la orquestación: no en el cliente, no en el plugin del diseñador.
- Script Gate de tokens en CI El PR se pone rojo si el agente (o un humano) mete un valor que el vocabulario no conoce.
- Patrón Excepción como código Las excepciones no viven en un hilo de Slack: se versionan junto a la regla.
- Plantilla Changelog como paper El changelog del sistema es el paper del oficio: qué cambió el agente y bajo qué regla.
- Contrato Política de PR agéntica Título, plantilla y checks obligatorios cuando el autor es un pipeline.
- Mapa Cobertura de reglas (no de líneas) Qué porcentaje de principios ejecutables tienen prueba automática o rúbrica.
- Checklist Firma humana obligatoria El merge es un acto de persona con nombre. El agente no firma.
- Playbook Plan de muestreo humano Qué porcentaje de salidas revisa una persona cuando el sistema ya está en L2/L3.
- Patrón Regresión visual con umbral Snapshots sí, pero con umbral y dueño — no un muro de diffs ignorados.
- Script Prueba de accesibilidad en CI sobre UI generada La a11y no se “revisa a ojo” cuando el agente produce pantallas a diario.
- Playbook Guion del panel de ocho dimensiones Cómo se sienta el jurado del demo day: misma vara, sin monólogos.
- Plantilla Autoevaluación pre-demo El alumno se pone el veredicto antes del panel — y adjunta evidencia.
- Patrón Patrón de tres estados en producto Del catálogo Lorsclub al design system: comprime inteligencia en decisiones.
- Mapa Render dual humano / agente Cuando el design system tiene dos consumidores: el humano y el agente (patrón Lorsclub).
- Plantilla Canvas de newsroom de agentes 15 roles no son 15 chats: son un proceso con estados y reintentos (La Vigencia).
- Checklist Checklist de agente sobre datos privados Bodados: acción real autenticada. Si no hay ownership, no hay feature.
- Mapa Multimarca con resolver (sin copiar carpetas) Temas y modos como datos; el agente no duplica librerías por marca.
- Plantilla Estructura de informe de zona (decisión + corpus) Cómo escribir un informe que un agente pueda citar y un humano pueda leer en 90 segundos.
- Patrón Dúo crítico + validador duro Un agente que opina y otro que solo pasa/falla reglas — no los fusiones.
- Checklist Caso mínimo publicable (CMP) Qué debe tener un Caso del programa para poder colgarse en el registro sin vergüenza.
- Script Script de diff de tokens Qué cambió en el vocabulario entre dos commits — legible por humanos y por el Parte.
- Script Script de componentes huérfanos Componentes sin referencia en app ni en golden set: candidatos a obituario.
- Script Generador de llms.txt del design system Índice legible por agentes a partir de tu árbol de tokens y componentes.
- Script Smoke test del servidor MCP del DS Tres llamadas mínimas: list tools, get token, get component. Si fallan, no hay genotipo expuesto.
- Script Script de puntuación AI-readiness Convierte la spec de capas en un score por dimensión — el mismo espíritu del diagnóstico web.
- Script Labeler de PRs de agente Etiqueta automática: agent-generated, risk-high, needs-criterion.
- Script Export DTCG de limpieza Normaliza nombres y $type antes de que el agente consuma basura semántica.
- Script CLI de cola de excepciones Alta y cierre de excepciones desde terminal — para la silla de orquestación.
- Plantilla Cintillo de oficio Cómo titular una decisión de sistema en 3–5 palabras — el arte del Parte aplicado al DS.
- Plantilla Entradilla de cambio (60–160) La meta description del changelog: una decisión, no un dump de commits.
- Contrato Guía de voz del sistema (para agentes de copy) Restricciones de tono que un agente de microcopy no puede violar.
- Plantilla Plantilla de Parte interno de sistema El boletín del design system: un cambio, una fuente, una firma humana.
- Patrón Bloque de firma de responsabilidad Nunca “generado por IA” como autor. Persona, rol, fecha.
- Spec Glosario mínimo del Kit (12 términos) Los doce términos que tu agente y tu equipo deben compartir sin ambigüedad.
- Checklist Checklist anti-slop para textos del sistema Las mismas prohibiciones del Instituto aplicadas a la documentación que lee el agente.
- Spec Triada de error (color + icono + texto) Principio ejecutable de a11y que el agente puede comprobar y el linter también.
- Contrato Foco nunca opcional Contrato de foco visible en componentes generados por agente.
- Patrón Nombres accesibles en la API del componente La prop no se llama "text": se modela el nombre accesible como parte del contrato.
- Checklist Checklist EAA / Ley 11/2023 para UI agéntica Lo mínimo legal que un sistema con UI generada no puede “improvisar”.
- Patrón Contraste como dato del token El contraste no se “revisa al final”: viaja en metadatos del color.
- Checklist Guion de prueba de teclado post-generación Después de que el agente pinta UI: tab order, escape, focus trap.
- Mapa Mapa de riesgo a11y por superficie Dónde el agente genera más deuda: modales, tablas, live regions…
- Checklist Checklist de release del Agentic DS Kit Qué debe contener el paquete que el alumno enseña el último día.
- Playbook Guion de demo day (12 minutos) No story de vida: evidencia del Kit contra la rúbrica.
- Acta Protocolo del becario (humor operativo) El agente es el becario brillante y peligroso: esta ficha dice qué no se le deja solo.
- Plantilla Consultorio de excepciones (formato Parte) Cómo plantear una excepción de sistema en público interno: pregunta, regla, propuesta.
- Plantilla Ficha de transparencia de modelo Qué modelo, qué versión, qué temperatura — en el log, no en el folklore del equipo.
- Mapa Presupuesto de tokens (LLM) por feature Cuánto puede costar una acción de agente antes de que el producto sea absurdo.
- Playbook Plan de degradación elegante Si el agente cae, el producto sigue siendo usable — sin teatro de “inteligencia”.
- Playbook Onboarding del agente al design system El primer día del agente en tu repo: qué lee, en qué orden, qué no toca.
- Plantilla Contrato de ventana mensual Cómo se prepara una ventana del programa: tema, entregable, captura, no monólogo.
- Mapa Radar de deuda agéntica Cuatro cuadrantes: duele / no duele × agente lo empeora / lo mejora.
- Contrato Acuerdo de muestreo y retención de logs Qué logs de agente se guardan, cuánto tiempo, quién accede.
Dossier
El dossier del Instituto, en PDF
El caso completo: qué es el diseño agéntico, qué cambia para tu equipo y empresa, y cómo se aplica. Para ti o para tu comité de dirección. Déjanos el correo y te lo enviamos al instante.
Boletín del Instituto
Recibe lo nuevo en tu correo
Guías, herramientas e informes según los publicamos. Sin ruido: solo cuando hay algo que de verdad usar.