Hecho con Chinaski

Design Briefs

Un design brief es un paquete de archivos HTML y CSS de referencia que subes para que las herramientas de generación de themes: Claude vía MCP, o cualquier asistente al que le entregues el brief: vean exactamente el look que quieres. Los briefs son de solo lectura: no tocan tu site hasta que un theme generado los use.

El flujo de trabajo

  1. Sube el brief (desde el panel Generate Theme de la pantalla Themes o desde el panel compartido de subida de Themes).
  2. Crea un scaffold de theme: nombra el theme, adjunta el brief (y opcionalmente una frase corta de "design intent"), y Chinaski produce tanto los archivos iniciales clonados como un prompt listo para copiar.
  3. Entrega el prompt a tu asistente: el prompt nombra el ID del brief y le dice al lector exactamente qué llamadas a herramientas obtienen cada archivo del brief, para que Claude (u otro cliente MCP) pueda leer tu diseño de referencia antes de escribir los archivos del theme.
  4. Itera: vuelve a subir o elimina briefs en cualquier momento; los briefs no tienen ningún efecto sobre el site en vivo.

Subir un brief

Desde el panel Generate de la pantalla Themes: o desde la pantalla dedicada de Design Briefs: subes:

  • un solo archivo .html o .css, o
  • un archivo .zip de tales archivos (se mantiene plano; los archivos en subdirectorios se omiten)

Reglas que la subida aplica:

  • Tamaño: 3 MB por subida como máximo (la verificación del lado del navegador evita sorpresas de entrada).
  • Tipos de archivo: solo .html, .css y .zip. Dentro de un zip, solo se conservan los archivos .html/.css: otros formatos y extensiones desconocidas se ignoran.
  • Cantidad: 20 archivos como máximo por zip.
  • Al menos un HTML: un brief debe contener al menos un archivo .html; las subidas sin uno se rechazan con un error.
  • Patrón de nombre de archivo: letras minúsculas, dígitos, guion bajo, guion, punto, con extensión .html o .css. Las entradas de directorio en un zip se descartan (se aplanan) para que no se extraiga contenido de path traversal.

Etiqueta tu brief primero (por ejemplo "Kitchen Sink") para que la lista y el dropdown de Generate sean fáciles de usar. Los briefs sin etiqueta se muestran como "(untitled)".

Dónde viven los briefs

  • Cada brief recibe un UUID y su propio directorio: uploads/design-briefs/<uuid>/.
  • Las pantallas listan los briefs con Label, Files count, Uploaded (UTC), y un botón Delete en cada fila (con una confirmación de borrado irreversible).
  • Tanto la página Design Briefs como el file picker de Themes aplican el mismo límite de 3 MB antes de subir.

Desde dónde se leen los briefs

Los archivos de referencia se leen de vuelta por tres canales:

  • Herramientas MCP para Claude y todos los demás clientes MCP: list_design_briefs (id, label, timestamp de subida, conteo de archivos), list_design_brief_files, y read_design_brief_file (consume el HTML/CSS crudo del brief como texto plano).
  • La REST API (claves de API con permiso de lectura): /api/themes/design-briefs para la lista, la lista de archivos del brief, y el contenido crudo de un archivo.
  • El prompt del panel Generate: el prompt de creación de theme le dice a tu IA que llame a la herramienta auxiliar listada con el ID del brief para leer todos los archivos de referencia antes de escribir el código de las templates.

Eliminación

Eliminar un brief elimina tanto la fila de metadatos como sus archivos, tras una confirmación explícita ("Delete this design brief and its files? This cannot be undone.").

Lo que los briefs no pueden hacer

Los briefs son material de referencia puro: Chinaski nunca llama a una IA por sí mismo. El panel Generate devuelve un prompt listo para copiar para que lo ejecutes en tu propio asistente; ese prompt apunta a los archivos del brief vía sus IDs, y tu asistente los obtiene a través de las herramientas MCP o la API de solo lectura.

Lee este sitio en