Saltar al contenido

Catálogo de cursos

Haz que luzca: diseño para crear con IA

Aprende a reconocer qué hace que una página parezca diseñada y a darle a tu agente de IA las instrucciones para crearla.

Tu agente de IA puede crear una página funcional en minutos, y se parecerá a todas las demás páginas generadas: un degradado morado, un bloque principal centrado, seis tarjetas con emojis. Este curso te enseña a reconocer qué hace que una página parezca diseñada (jerarquía, espacios, tipografía y color) con ejemplos interactivos que puedes arrastrar y ajustar. Después aprenderás a dar instrucciones como quien diseña: referencias con notas en vez de adjetivos, tokens de diseño en vez de suposiciones y capturas que señalan un problema concreto. Revisarás la accesibilidad, el movimiento, las pantallas pequeñas y los estados vacíos o de error. Terminarás con un sistema de diseño que tu agente leerá en cada sesión: un archivo de tokens, reglas de componentes y un DESIGN.md breve. No necesitas experiencia en diseño ni programación.

Empieza con una lección gratisComparar todos los planes

Programa del curso

  1. Sección 1

    Mirar como quien diseña

    Aprende las cuatro claves para que una página parezca diseñada y no generada: un foco claro, espacios deliberados, una escala tipográfica breve y colores con una función.

    1. Una cosa primero
    2. El espacio comunica
    3. Una escala tipográfica breve
    4. Color con una función

  2. Sección 2

    Dar instrucciones visuales a un agente de IA

    Convierte tu criterio en instrucciones que un agente de IA pueda seguir: identifica los patrones genéricos, aporta referencias en vez de adjetivos, entrega tus tokens de diseño y envía capturas que señalen un problema concreto.

    1. Reconoce el aspecto de la IA
    2. Referencias en vez de adjetivos
    3. Entrega los valores
    4. Capturas que señalan el problema

  3. Sección 3

    Ciclos de revisión y acabado

    Mejora una página en ciclos breves: comprueba contraste, áreas táctiles y foco; elimina movimiento sin función, empieza por el teléfono y pide los estados vacíos, de carga y de error que los agentes suelen omitir.

    1. La revisión de accesibilidad
    2. Movimiento que se gana su lugar
    3. Primero el teléfono
    4. Las pantallas que nadie pide

  4. Sección 4

    Un sistema de diseño que tu agente siga

    Anota tus decisiones donde cada sesión pueda encontrarlas: un archivo de tokens con dos capas, reglas de componentes verificables, un DESIGN.md breve enlazado desde las instrucciones del agente y hábitos que evitan desviaciones.

    1. Un archivo de tokens, dos capas
    2. Reglas para cada componente
    3. Las instrucciones que lee en cada sesión
    4. Mantén el sistema fiel a sus reglas

Rutas de aprendizaje

Crea con IA

Lanza un pequeño producto que hayas creado dirigiendo a un agente de IA: una especificación escrita, un proyecto que las herramientas entiendan, un cambio revisado y probado, y una página de destino que hayas desplegado y puedas explicar.

Secuencia de 9 cursos

Tu idea, en marcha. Empieza en 60 segundos.

Prueba gratis durante 7 días en cualquier plan para nuevos miembros · Cancela cuando quieras

Empezar

Volver a los cursos