Diagram Design: explicaciones visuales con evidencia
Primer encargo para Diagram Design: audiencia, tamaño y fidelidad antes de dibujar
Convierte una petición vaga en un encargo explícito y conserva un registro revisable de lo preservado y lo simplificado.
Qué aprenderás
- Escribe la explicación antes de pedir el dibujo
- La simplificación necesita límites explicables
- Inspecciona el primer resultado estático
Antes de empezar
- Conceptos básicos de HTML y SVG
- Distinguir una relación del sistema de su disposición visual
Elige una representación útil, explica simplificaciones e interpreta hallazgos dentro de su alcance real.
Conclusiones clave
- Elige formato, tamaño, detalle y audiencia por separado.
- Un límite de complejidad es un techo, no un objetivo de contenido.
- Documenta las simplificaciones significativas.
Escribe la explicación antes de pedir el dibujo
Empieza por una frase acotada: explicar cómo una petición de pedido llega al almacenamiento persistente. Enumera los componentes y relaciones que el proyecto realmente proporciona. No añadas una cola, caché o pasarela de seguridad porque sus formas hagan parecer más sofisticada la arquitectura. Una función desconocida debe seguir pendiente de aclaración.
Define formato, tamaño, detalle y audiencia antes de dibujar. Son decisiones independientes: una audiencia técnica no justifica automáticamente más densidad, y un lienzo grande no vuelve legible el texto pequeño en una proyección. La especificación vincula tamaño y escala tipográfica; redimensionar después no constituye una adaptación completa.
La simplificación necesita límites explicables
El nivel balanced documentado permite hasta 12 nodos y 16 aristas; simplified, siete y nueve. Faithful admite hasta 24 nodos y 32 aristas con condiciones adicionales de zonificación. Son máximos, no cuotas que llenar. Una historia de seis componentes no debe crecer a doce porque el presupuesto lo permita.
Cuando la fuente excede el presupuesto útil, consolida con una razón y conserva un registro de fidelidad. Indica qué duplicados se fusionaron, qué grupos se resumieron y qué información relevante se omitió. Separar una vista general de otra detallada suele preservar más conocimiento que reducir todas las etiquetas hasta hacerlas caber.
Inspecciona el primer resultado estático
Solicita primero un archivo estático y sigue el camino desde la entrada hasta el resultado. ¿Son claras las direcciones? ¿Las relaciones ambiguas tienen etiquetas? ¿El acento señala la decisión importante? ¿El pie explica una limitación? Son comprobaciones del lector, no garantías obtenidas por escribir una petición muy larga.
El encargo siguiente es un ejemplo editorial, no una configuración que cualquier host acepte como entrada. No se instaló ningún plugin en esta revisión. Tras una instalación aprobada, usa el flujo específico del repositorio, inspecciona su salida y conserva el encargo junto al archivo para que las revisiones sigan siendo explicables.
Pasos de implementación
- 1
Formula una pregunta de aprendizaje y relaciones verificadas.
- 2
Elige el destino y la audiencia.
- 3
Fija un presupuesto de detalle y los recortes previstos.
- 4
Renderiza y comprueba si el lector puede seguir la historia.
Ejemplo para copiar
{
"ejemploDeEncargoEditorial": {
"pregunta": "¿Cómo llega un pedido al almacenamiento?",
"format": "html",
"size": "doc-inline",
"detail": "balanced",
"audience": "mixed",
"rutaConocida": ["Cliente", "Pasarela", "Pedidos", "Base de datos"]
},
"ordenDelHostEjecutada": false
}Preguntas frecuentes
¿Balanced siempre debe tener doce nodos?
No. Doce es el máximo documentado. Incluye solo los componentes necesarios para explicar la pregunta elegida.
¿Basta ampliar un diagrama para convertirlo en diapositiva?
También hay que ajustar tipografía, densidad y distancia de lectura. Ampliar la imagen no demuestra su legibilidad.
Fuentes
- skills/diagram-design/references/output-spec.mdFuente verificada 2026-09-08
- README.mdFuente verificada 2026-09-08