Guía Nº 06 · palabra DISEÑOVerificada por nosotros
Skills de diseñoTu web se ve genérica porque tu agente escoge lo de siempre.
UI UX Pro Max le da paletas y tipografías para escoger, Impeccable revisa lo que diseñó como un director de arte y la de Emil Kowalski pule cada botón y cada transición. Las tres son gratis.
TúHaz la web de mi hotel
ui-ux-pro-maximpeccableemil-design-engtu-marcatuya
Abre UI UX Pro Max, que escoge estilo, paleta y letras para un hotel, y la de tu marca, para que sean tus colores.
- Sirve si
- Le pides páginas o pantallas a tu agente y te salen con cara de plantilla.
- No vale la pena si
- Armas tu web en Wix o en otro constructor, sin un agente que escriba el código.
- Cuesta
- Nada. UI UX Pro Max vende además una versión pagada que aquí no hace falta.
- Tarda
- Unos minutos para instalar las tres, si ya tienes Node.js y Python.
Las webs hechas con IA se delatan por las mismas señales
Si le pides una web a tu agente: la IA que trabaja en tu computadora: escribe archivos, corre comandos y termina tareas. Claude Code, Codex y Cursor son agentes. sin darle nada más, te va a salir parecida a muchas otras webs hechas así. Paul Bakaus, el autor de Impeccable, cuenta que todos los modelos aprendieron de las mismas plantillas y que, sin otra guía, repiten un puñado de señales en cada proyecto: la letra Inter en todo, degradados de morado a azul, tarjetas dentro de tarjetas, texto gris sobre fondos de color y un ícono dentro de un cuadrito redondeado encima de cada título.
En impeccable.style puedes ver un hotel de ejemplo con esas señales y la versión que propone la skill. Es el que mostramos en el video, y es de ellos: un hotel inventado, no una prueba nuestra.
Emil Kowalski, un diseñador de interfaces que trabajó en Vercel y en Linear, escribe que a los agentes les falta gusto. Escogen mal los detalles chicos, como la curva de una animación, y esos detalles se van sumando.
Cada una hace un trabajo distinto
No hace falta saber de diseño para entenderlo. Elige con qué compararlo:
En tu agente
El catálogo de pinturas y acabadosEl muestrario de colores y de letras
UI UX Pro Max: estilos, paletas y tipografías según tu tipo de negocio
El decorador que te dice qué sobraEl director de arte que tacha lo genérico
Impeccable: revisa lo que diseñó tu agente y le quita lo genérico
Las bisagras que cierran suaveEl especialista en animación
Las de Emil Kowalski: cómo se mueve cada botón y cada transición
Tu gusto y tu forma de vivirEl manual de marca del cliente
Una skill tuya: lo que ninguna de las tres sabe de ti
En la figura de arriba, cada encargo abre la skill hecha para eso. Es una simplificación: como las tres hablan de diseño, tu agente puede abrir más de una a la vez.
Empieza por la que más le falta a tu web
Puedes instalar las tres. Si prefieres ir de a una, toca lo que te molesta de la tuya:
¿Qué le falta a tu web?
¿La quieres funcionando en tu empresa, sin instalar nada? Hagamos el diagnóstico
Lo que no hacen
Se creeLas instalas y tu web queda lista.
En realidadLe dan criterio a tu agente. Igual tienes que decirle para quién es tu web y revisar lo que te entrega.
Se creeSon plantillas.
En realidadSon instrucciones y catálogos. Tu agente sigue diseñando tu página, ahora con mejores reglas.
Se creeSolo funcionan con Claude.
En realidadFuncionan con varios agentes, como Claude Code, Codex y Cursor. Cada repositorio tiene su lista completa.
El taller · en tu computadora
0 de 3 pasos listos
Esto se hace en una computadora. ¿La estás leyendo en el celular?
Instálalas en tres pasos
Las tres son gratis y de código abierto. Sus repositorios en GitHub tienen las instrucciones completas, en inglés, y de ahí salen estos pasos. El 18 de octubre de 2026 tenían más de 137 mil estrellas (UI UX Pro Max), 82 mil (Impeccable) y 47 mil (Emil Kowalski).
Antes de empezar
- Un agente que trabaje en tu computadora y acepte skills, como Claude Code, Codex o Cursor.
- Node.js, que trae los comandos
npmynpx. Es gratis: se baja de nodejs.org. - Python 3, que usa el buscador de UI UX Pro Max. También es gratis, en python.org.
- La carpeta de tu proyecto abierta en la terminal: la ventana de texto donde se escriben comandos. En Windows se llama Terminal o PowerShell..
UI UX Pro Max
Primero tienes que poner su instalador, y eso se hace una sola vez:
npm install -g ui-ux-pro-max-cliDespués, desde la carpeta de tu proyecto, instala la skill: un paquete de instrucciones que le enseña a tu agente una forma de trabajar. Se instala dentro de la herramienta que ya usas. para tu agente:
uipro init --ai claudeEse es para Claude Code. Si usas otro, cambia claude por el tuyo: codex, cursor, gemini o
copilot, entre otros. Si le agregas --global al final, queda en todos tus proyectos. Repositorio:
nextlevelbuilder/ui-ux-pro-max-skill.
Impeccable
Desde la carpeta de tu proyecto:
npx impeccable installDetecta qué agentes tienes y te pregunta si la quieres solo en este proyecto o en todos. En Claude Code, Codex y Cursor te ofrece además un chequeo automático: cada vez que tu agente edita una pantalla, el detector la revisa. Cierra tu agente, ábrelo de nuevo y escribe adentro, una sola vez por proyecto:
/impeccable initRevisa tu proyecto, te pregunta lo que le falte saber (para quién es, para qué sirve, qué tono tiene) y lo
deja escrito para los comandos que vienen. En Codex se llama con $impeccable en vez de /impeccable.
Repositorio: pbakaus/impeccable.
Ojo: al empezar un diseño nuevo, Impeccable le pide a su servidor varias propuestas de estilo y, si no lo apagas, le avisa en forma anónima cuál escogiste. No manda tu código, tus archivos ni el nombre de tu proyecto. Para que no lo registre:
npx impeccable telemetry offLas de Emil Kowalski
npx skills@latest add emilkowalski/skillsSi te pregunta qué skills y en qué agentes instalarlas, marca las que quieras y confirma. El repositorio
trae varias. La principal es emil-design-eng, casi toda de animación y con algunos consejos de diseño. Si
quieres solo esa:
npx skills@latest add emilkowalski/skills --skill emil-design-engRepositorio: emilkowalski/skills.
Úsalas
UI UX Pro Max se activa sola cuando le pides algo de diseño. Pídeselo con tus palabras y dile qué negocio es:
Haz la página de inicio de mi hotel boutique en la playaCon Impeccable, cuando ya tengas algo hecho, pide la revisión de diseño, el chequeo técnico o la pasada final:
/impeccable critique/impeccable audit/impeccable polishSi escribes solo /impeccable, te muestra todos sus comandos. La de Emil Kowalski entra cuando hay
animaciones o detalles de interfaz de por medio, y también la puedes nombrar:
Usa la skill emil-design-eng para revisar las animaciones de esta página¿No te salió así?
Estos los cuentan los propios repositorios:
¿Qué ves en pantalla?
npm install -g da un error de permisos
npx ui-ux-pro-max-cli init --ai claude hace lo mismo.UI UX Pro Max no encuentra Python
Instalaste una y no aparece
En Codex, Impeccable no revisa al editar
/hooks y aprueba el chequeo de Impeccable. Codex puede volver a pedirlo cuando la actualizas.Claude, en la web, rechaza el ZIP de UI UX Pro Max
Enlaces
- UI UX Pro Max, repositorio oficial: https://github.com/nextlevelbuilder/ui-ux-pro-max-skill
- Impeccable, repositorio oficial: https://github.com/pbakaus/impeccable
- El hotel de ejemplo, en la página de Impeccable: https://impeccable.style
- Skills de Emil Kowalski, repositorio oficial: https://github.com/emilkowalski/skills
Con estas tres de base, le puedes sumar una skill con tu marca: tus colores, tu letra y tu tono, escritos una sola vez.
Sigue la serie
La próxima guía llega con su video.
Cada una sale de un Reel de @sage.lat. Comentas la palabra y te llega aquí, gratis.
¿Le sirve a alguien de tu equipo?
Aviso. Claude Code, Codex, Cursor son de sus autores; no estamos afiliados a ellos ni a los dueños de las marcas que se nombran. Esta guía explica su trabajo y enlaza la fuente oficial: se instala desde ahí, bajo tu responsabilidad y según su licencia. Más en la política de privacidad. © SAGE, el texto de esta guía.
