Diagram Design

Questa skill aiuta architetti, ingegneri e autori tecnici a creare in pochi secondi diagrammi professionali coerenti con l'identità del brand. Supporta 39 tipi di diagrammi, dai modelli di dati e dalle architetture di distribuzione alle mappe Wardley e ai flussi del percorso utente. Ogni diagramma è un file HTML autonomo e ottimizzato, con SVG e CSS incorporati e senza dipendenze esterne.

Funzionalità principali

• Automatizza l'estrazione dei token del brand dal sito web o dal design system locale
• Supporta 39 tipi di diagrammi, tra cui diagrammi di flusso, sequenza, macchine a stati, modelli ER, Gantt, Sankey e classi UML
• Ridisegna file draw.io e Mermaid esistenti con dimensioni e livelli di dettaglio personalizzati
• Applica standard di qualità editoriale: densità minima dei nodi, etichette chiare e accessibilità completa
• Produce diagrammi HTML in un singolo file, ottimizzati per web, stampa e documentazione
• Include il supporto per temi chiari e scuri e stili facoltativi disegnati a mano o da terminale

Il sistema privilegia la chiarezza attraverso una semplificazione rigorosa: ogni elemento deve avere una funzione precisa. Impone l'allineamento a una griglia di 4 pixel e applica sei regole ai connettori per evitare ambiguità visive. Quando la complessità supera i limiti previsti, i diagrammi vengono suddivisi automaticamente in viste generali e di dettaglio. È adatto ad architetti di sistemi, team di prodotto e flussi di documentazione tecnica che richiedono una comunicazione visiva rapida e coerente con il brand, senza strumenti esterni.