Architecture Diagrammer
Convierte una especificación en texto plano de componentes y conexiones en un diagrama de arquitectura SVG validado, con un informe que descarta aristas desconocidas, rechaza IDs duplicados y señala componentes aislados y ciclos.
Funciona con: Claude Code, Codex, Cursor, Muse · Versión 1.0.0 · Necesitas: Una especificación de arquitectura (spec.txt: [components] id: Etiqueta | tipo, [connections] a -> b: etiqueta).
Obtén este Skill con Premium Ver planes
Vista previa

Resultado de ejemplo
Un ejemplo de lo que produce este Skill. Contenido de muestra, mostrado a modo de ilustración.
Architecture Diagrammer report — sample Diagram report: Shop API Components: 5 | Edges drawn: 5 | Columns: 4 Components: Web App (client, column 0); API Server (service, column 1); Redis Cache (cache, column 2); Job Worker (service, column 2); Postgres (database, column 3). Edges: Web App -> API Server: HTTPS; API Server -> Redis Cache: GET; API Server -> Postgres: SQL; API Server -> Job Worker: Enqueue; Job Worker -> Postgres: SQL. Errors: none. Warnings: none. Messy draft check: 5 components, 3 edges drawn, 2 errors (duplicate api id; edge to unknown ghost dropped), 4 warnings (unknown type, 2 orphans, cycle api -> db -> api).
Qué obtienes
- Un diagrama SVG validado: columnas por dependencia, flechas etiquetadas, ciclos desviados por debajo
- Un informe del diagrama: tablas de componentes y aristas más todos los errores y advertencias
- Validación antes de dibujar: descarta aristas desconocidas y rechaza IDs duplicados
- Un formato de especificación que puedes versionar junto al diagrama que produce
Acerca de este Skill
Lee una especificación en texto plano ([components] con id, etiqueta y tipo; [connections] con flechas etiquetadas) y genera un diagrama SVG en columnas por dependencia más un diagram-report.md: tablas de componentes y aristas, una columna por componente y todos los errores y advertencias. Una conexión que nombra un componente desconocido se descarta, nunca se dibuja hacia una caja inventada; un ID duplicado conserva su primera definición; los componentes aislados y los ciclos se informan, no se ocultan. Solo local, solo biblioteca estándar; el diagrama muestra solo lo que lista la especificación: nada se infiere para completar la imagen.
Pruébalo
Dibuja el diagrama de arquitectura de mi Shop API a partir de esta especificación.
Ideal para
- Documentar un sistema para un README, un documento o una revisión de PR
- Comprobar un boceto de arquitectura a mano antes de compartirlo
- Mantener un diagrama honesto: solo se dibuja lo listado
No es para
- Generar un diagrama a la inversa desde un código: la especificación la escribes tú
- Inventar componentes, almacenes o conexiones que faltan para completar la imagen
- Probar que una arquitectura es correcta: un informe limpio significa que coincide con la especificación, no con la realidad
Cómo instalarlo
- Copia el prompt de instalación en tu agente:
Read https://skillu.dev/install/agent.md, then install the Architecture Diagrammer skill (architecture-diagrammer). - O descarga el paquete del Skill desde esta página tras el lanzamiento y coloca su carpeta en el directorio de skills de tu agente.
- Llámalo con un comando de barra, p. ej.
/architecture-diagrammer, y describe lo que quieres con palabras sencillas.
Preguntas frecuentes
¿Qué pasa si mi especificación tiene un error?
El diagrama se genera con las partes válidas y el informe lista todos los errores y advertencias: las aristas desconocidas se descartan, los IDs duplicados conservan su primera definición y los aislados y ciclos se señalan. Corrige la especificación y vuelve a ejecutar.
¿Dibuja algo que no haya listado?
No. Solo aparecen los componentes y aristas de tu especificación. Una caché o una ruta de respaldo ausente es un hueco de la especificación que debes corregir, no algo que la skill complete.