Skills de Claude y ChatGPT para diseño web

#¿Qué skill usar para cada parte de una web?

Una web se diseña por partes: la dirección visual, los textos, las imágenes, la revisión y la prueba con usuarios reales. Cada skill resuelve una de esas partes, y juntas cubren el recorrido.

Un detalle sobre brand-guidelines: la skill oficial viene armada con la marca de Anthropic como ejemplo. Para que sirva a la tuya, se reemplazan esos colores y tipografías por los de tu manual, como explica su ficha.

#¿Cómo instalo estas skills en Claude?

Depende de dónde trabajes:

• En la app de Claude (web o escritorio): activa «Code execution and file creation» en Settings, comprime la carpeta de la skill en un ZIP y súbela desde Customize, Skills, «Upload a skill». El paso a paso está en la ayuda oficial de Claude.
• En Claude Code, que es donde se construye la web: copia la carpeta de la skill en .claude/skills/ de tu proyecto, o agrega las oficiales con /plugin marketplace add anthropics/skills y después /plugin install example-skills@anthropic-agent-skills, que trae frontend-design, brand-guidelines, theme-factory y canvas-design. impeccable tiene su propio instalador: npx impeccable install.

Cada ficha del directorio, enlazada arriba, trae el archivo y la instalación para Claude Code, Cursor y Codex. Si vas a instalar varias a la vez, la guía de las 50 Claude skills de 2026 explica cómo hacerlo sin cargar de más el contexto.

#¿Sirven en ChatGPT para hacer una web?

Sí, por dos caminos. En los planes de empresa de ChatGPT (Business, Enterprise y Edu) existen las Skills: si el administrador del espacio las activó y permite subirlas, subes la skill y ChatGPT la revisa antes de activarla, según OpenAI Academy y la ayuda de ChatGPT. En cualquier otra cuenta, se arma un Proyecto:

1. Descarga el SKILL.md de la skill desde su repositorio o desde la ficha del directorio.
2. En ChatGPT, crea un Proyecto para tu web (está en todos los planes) o un GPT personalizado si tienes un plan pago.
3. Sube el SKILL.md como archivo, junto con lo que la skill necesita: tu manual de marca, capturas de referencia o, en theme-factory, su carpeta de temas.
4. En las instrucciones escribe una sola línea: «Sigue las instrucciones del archivo SKILL.md».
5. Pide el trabajo dentro de ese Proyecto: «diseña la página de inicio».

Va como archivo y no pegado porque las instrucciones tienen un límite de largo que la mayoría de estos SKILL.md supera. Lo que se pierde: ChatGPT no edita los archivos de tu proyecto como Claude Code, así que el código lo copias tú, y las skills que dependen de su instalador, como impeccable, pierden esa parte.

#¿Dónde se traba la mayoría?

El diseño sale bien en la primera tarde. Lo difícil viene después: llevar esas pantallas a una web publicada en tu dominio, que cargue rápido en el celular, que Google la entienda (títulos, datos estructurados, mapa del sitio), que cada formulario termine en tu CRM y que alguien la mantenga cuando cambia un precio o se suma un servicio. Las skills te dan buen diseño; no te dan el dominio, la medición ni el mantenimiento.

La otra traba es la coherencia. Cada sesión nueva con la IA arranca de cero si nadie dejó escrita la marca, y la web termina con un estilo de botón distinto en cada página. Así lo resolvimos con RE/MAX Patagon: sitio nuevo, redirecciones desde el anterior, Google Analytics y Search Console, y la medición de cada botón de contacto.