Cambia o crea tu web con Claude | Guía de Taste, Emil Kowalski e Impeccable
● Guía gratuita · Diseño web con IA

¿No te gusta tu web, quieres cambiarla o crear una desde cero? Hazlo con Claude

Antes de pagarle a nadie, instálale a Claude tres skills gratuitas que le dan criterio de diseño. Aquí tienes cómo instalarlas, en qué orden usarlas y qué pedirle.

🎨

Si le pides a Claude una web sin más, te sale la de siempre: la misma letra, un degradado morado y tarjetas dentro de tarjetas. No es que no sepa: es que nadie le ha dado criterio. Estas tres skills son ese criterio, escrito por diseñadores, y se instalan en diez minutos.

Las tres, y para qué sirve cada una

1. Taste: se usa antes de diseñar. Lee lo que le pides, decide una dirección de diseño y evita el aspecto de plantilla. Autor: Leonxlnx.
2. Emil Kowalski: cinco skills sobre movimiento: cuándo animar, cómo y cuándo no. Emil es diseñador e ingeniero y ha trabajado en Vercel y Linear.
3. Impeccable: se usa después, para revisar. Más de veinte comandos que critican y pulen tipografía, espacios, color, estructura y accesibilidad. Autor: Paul Bakaus.
Skill: un paquete de instrucciones que le enseña a Claude a hacer algo. Funcionan en Claude Code, no en el chat normal.

Instálalas

Elige una de las dos formas. La segunda es la que usé yo.

Opción A

Si tienes Node instalado

Abre la Terminal en la carpeta de tu proyecto y ejecuta estos comandos, uno a uno. Son los oficiales de cada autor:

npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"
npx skills@latest add emilkowalski/skills
npx impeccable install

Cada uno te pregunta dónde instalar. Si eliges "global", las tendrás en todos tus proyectos.

💡
¿No sabes si tienes Node? Escribe node --version en la Terminal. Si sale un error, usa la opción B.
Opción B

Sin Node: pídeselo a Claude Code

Abre Claude Code y pega esto. Descarga los tres repositorios oficiales, te enseña qué traen antes de instalar nada y copia solo lo necesario:

Instala estas skills de diseño web en ~/.claude/skills para que funcionen en todos mis proyectos:

1. Taste: de https://github.com/Leonxlnx/taste-skill copia solo la skill "design-taste-frontend".
2. Emil Kowalski: de https://github.com/emilkowalski/skills copia las skills de la carpeta skills/.
3. Impeccable: de https://github.com/pbakaus/impeccable copia la skill "impeccable" con su carpeta scripts/.

Antes de copiar nada:
- Dime qué archivos trae cada una, si ejecuta algún programa y a qué servidores se conecta.
- No instales nada con npx ni con Homebrew, y no toques nada fuera de ~/.claude/skills.

Cuando termines, dime cómo comprobar que están instaladas.
✅
Para comprobarlo: abre una sesión nueva de Claude Code y escribe /. Tienen que aparecer impeccable, design-taste-frontend y las de Emil.

Cómo usarlas, en orden

Paso 1

Dale contexto a Impeccable (una sola vez)

Abre Claude Code en la carpeta de tu web y escribe:

/impeccable init

Te hace unas preguntas sobre tu negocio, tu público y tu marca, y lo guarda en el proyecto. A partir de ahí, todo lo que revise lo hará pensando en tu marca.

⚙️
La primera vez, Impeccable descarga su motor desde su GitHub oficial. Es normal, solo pasa una vez.
Paso 2

Pide la web, o la sección, con Taste

Rellena los corchetes y pégalo:

Usa la skill design-taste-frontend.

Quiero rediseñar [la página de inicio / la sección de servicios / una landing] de mi web.
- Mi negocio: [qué vendes y a quién]
- Lo que tiene que conseguir esta página: [que pidan presupuesto / que compren / que escriban por WhatsApp]
- Mis colores y tipografías: [códigos de color y nombres de fuente, o "propónmelos"]
- Webs que me gustan: [2 o 3 enlaces]
- Lo que no quiero: [degradados, fondos oscuros, demasiado texto…]
- Dónde va: [WordPress (dame HTML para pegar en un bloque HTML) / mi propio código]

Antes de programar, dime la dirección de diseño que propones y espera mi OK.
Paso 3

Dale movimiento con las de Emil

Usa las skills de Emil Kowalski: dime qué elementos de esta página merecen una animación y cuáles no, y aplica solo las que aporten.

El "y cuáles no" es lo importante: la mitad del buen diseño es no animar de más.

Paso 4

Revísala con Impeccable antes de publicar

Los comandos que más vas a usar:

/impeccable critique revisa el diseño como lo haría un director de arte: jerarquía, claridad y qué transmite.
/impeccable audit revisa lo técnico: accesibilidad, rendimiento y móvil.
/impeccable typeset arregla la tipografía: tamaños, jerarquía y lectura.
/impeccable layout arregla espacios, alineaciones y ritmo.
/impeccable colorize mejora el color si la página se ve apagada.
/impeccable polish la última pasada antes de publicar.
💡
Empieza siempre por critique, y pídele que te diga qué arreglar primero y con qué comando.

Los errores típicos

No aparecen las skills

Al escribir / no salen

Abre una sesión nueva de Claude Code. Las skills se cargan al empezar, no a mitad.

npx no funciona

command not found: npx

No tienes Node. Usa la opción B, que no lo necesita.

Impeccable tarda la primera vez

Se queda descargando

Está bajando su motor. Solo pasa una vez; después va rápido.

Sigue saliendo genérica

Otra vez el degradado morado

Le faltó contexto. Haz el paso 1 (/impeccable init) y dale webs que te gusten en el paso 2.

Gasta mucho

Se acaba tu límite de uso muy rápido

Trabaja sección a sección, no la web entera de golpe, y pasa Impeccable al final, no después de cada cambio.

Tu web es WordPress

No tienes "el código" de tu web

Pídele cada sección en HTML para pegar en un bloque "HTML personalizado". Así trabajo yo.

Los autores, y sus repositorios

Taste Skill (Leonxlnx) · licencia MITgithub.com/Leonxlnx/taste-skill Skills de Emil Kowalski · licencia MITgithub.com/emilkowalski/skills Impeccable (Paul Bakaus) · licencia Apache 2.0github.com/pbakaus/impeccable Documentación de Impeccableimpeccable.style

¿Quieres aprender a hacer tu marketing con IA?

Cada día comparto en mi Instagram las herramientas de IA que uso para trabajar más rápido: campañas, contenido, web y automatizaciones reales. Sin humo.

Sígueme en Instagram →
@marketingconcamilo