Creación de Playgrounds con Claude Code

Hemos publicado un nuevo plugin de Claude Code llamado playground que ayuda a Claude a generar HTML playgrounds. Son archivos HTML independientes que te permiten visualizar un problema con Claude, interactuar con él y obtener un prompt de salida para pegar de nuevo en Claude Code.

He encontrado que esto puede ser muy útil para interactuar con el modelo de maneras que no son adecuadas para texto, por ejemplo para:

• Visualizar la arquitectura del código base
• Ajustar el diseño de un componente
• Hacer brainstorming de diseño y maquetación
• Ajustar el equilibrio de un juego

Para comenzar, instala el plugin en Claude Code ejecutando los siguientes comandos:

**/plugin marketplace update claude-plugins-official

/plugin install playground@claude-plugins-official

Estos son algunos de mis playgrounds favoritos que he creado:

**

Cambiando el diseño de la herramienta AskUserQuestion en Claude Code

**prompt: "Usa la habilidad playground para crear un playground que me ayude a explorar nuevos cambios de diseño en la herramienta AskUserQuestion"

**

Criticando tu escritura y obteniendo una respuesta

**prompt: "Usa la habilidad playground para revisar mi SKILL.MD y darme sugerencias en línea que pueda aprobar, rechazar o comentar"

**

Ajustando una introducción de video de Remotion

**prompt: "Usa la habilidad playground para ajustar mi pantalla de introducción para que sea más interesante y encantadora"

**

Viendo un diagrama de arquitectura y permitiendo que el usuario comente

**prompt: "Usa la habilidad playground para mostrar cómo funciona este código base de agente de correo electrónico y permitirme comentar nodos particulares en la arquitectura para hacer preguntas, realizar ediciones, etc."

**

Equilibrando el juego rogue-like de superhéroes que estoy haciendo

**prompt: "Usa la habilidad playground para ayudarme a equilibrar el mazo del héroe 'Inferno'"

0:24

¡Emocionado de ver cómo exploran esto!

Mi consejo para crear un playground interesante: piensa en una forma única de interactuar con el modelo y luego pídele que lo exprese. Creo que podría sorprenderte.

Si haces algo genial, ¡compártelo!