Diagrammi e diagrammi di flusso

I diagrammi sono strumenti potenti che possono aiutare i team a mappare sistemi complessi, illustrare gerarchie complicate, organizzare idee, strutturare siti web, pianificare implementazioni e progettare flussi utente.

Sono essenziali per il successo di qualsiasi progetto – e una parte fondamentale del ritmo e del flusso di un progetto in ogni fase di sviluppo e implementazione. E, man mano che i progetti evolvono, i team hanno bisogno di diagrammi e diagrammi di flusso aggiornati immediatamente a portata di mano – per riferimento, guida e documentazione.

Nella Libreria di stencil, troverai un'ampia gamma di stencil per diagrammi Flowchart, UML, Use Case e ERD Model, tutti progettati per collegarsi rapidamente ai nostri smart Connettori.

In questo articolo, spiegheremo ciascuna delle categorie di stencil per diagrammi. Ti mostreremo anche come aggiungere stencil per diagrammi alla pagina e come collegare, formattare ed etichettare i loro Connettori.

Infine, imparerai alcuni trucchi e suggerimenti, come come sostituire uno stencil di un diagramma con un altro, o espandere i flussi con un semplice clic sulle frecce Extender.

Categorie di stencil per diagrammi

Nella Libreria di stencil, troverai quattro categorie di stencil per diagrammi. Con essi, il tuo team può creare e improvvisare qualsiasi tipo di diagramma:

Diagrammi di flusso

I diagrammi di flusso sono gli stencil per diagrammi più flessibili e adattabili. Vengono tipicamente utilizzati per brainstorming e ideazione, architettura delle informazioni, gestione dei dati, modellazione dei processi aziendali, analisi strutturale, ingegneria dei processi e altro ancora.

UML

I diagrammi UML utilizzano il Linguaggio di Modellazione Unificata per aiutare i team a comprendere la struttura e il comportamento delle soluzioni software. Visualizzano i componenti e le interazioni di un sistema documentando i suoi oggetti, attori, attributi, operazioni e relazioni.

Use Case

I diagrammi Use Case modellano l'insieme di azioni, servizi e funzioni che un sistema deve eseguire. Illustrando i casi d'uso specifici, gli attori e gli obiettivi di uno scenario, questi diagrammi comportamentali aiutano i team a comprendere i requisiti funzionali e l'ambito di un sistema.

ERD Model

Un Diagramma Entità-Relazione rappresenta la struttura di un database mostrando come le entità al suo interno – persone, ruoli, oggetti, prodotti o concetti – si relazionano tra loro. Il diagramma raffigura le entità, gli attributi e le relazioni interconnesse nell'ambito di quel sistema.

Per vedere esempi di tutti questi tipi di diagrammi, consulta la nostra raccolta gratuita di Template per Diagrammi e Diagrammi di Flusso. Usa questi esempi per avviare rapidamente il tuo progetto, comprendere le best practice o semplicemente sperimentare.

Aggiungere, stilizzare e nominare stencil per diagrammi

Proprio come tutti gli stencil Moqups, puoi aggiungere stencil per diagrammi alla pagina, come oggetti, con un singolo clic o trascinando e rilasciando. E, come con altri tipi di oggetti, puoi stilizzarli usando il Pannello Format.

Quando digiti testo in qualsiasi stencil di diagramma, quegli stencil adottano automaticamente il testo come loro nome. Questo rende facile identificare specifici elementi del diagramma nel Pannello Schema, specialmente in diagrammi di flusso e di processo complessi.

Collegare i connettori in modalità Diagramma

I nostri smart Connettori possono essere usati per collegare qualsiasi oggetto, stencil o immagine Moqups – non solo i nostri stencil per diagrammi dedicati!

Per collegare due oggetti qualsiasi sulla pagina:

1. Entra nella Modalità Diagramma facendo clic sul pulsante Diagramma nella barra degli strumenti in alto o premi D.
2. Vedrai immediatamente gruppi di punti blu pallido (punti di connessione) apparire attorno ai bordi degli oggetti sulla pagina.
3. Fai clic su uno di questi punti e trascina il cursore verso il secondo oggetto.
4. Man mano che il connettore si avvicina al secondo oggetto, si aggancerà e si "attaccherà" – mostrando che è collegato. Puoi collegarti a uno dei punti di connessione o a qualsiasi altro punto sul bordo dell'oggetto. I connettori rimangono collegati anche quando sposti, ridimensioni o ruoti gli oggetti.
5. Per uscire dalla modalità Diagramma, fai clic su qualsiasi punto vuoto della pagina o premi D o Esc.

Formattare i connettori

I connettori possono essere usati per collegare qualsiasi oggetto Moqups, ma sono progettati per funzionare – ed essere stilizzati – in combinazione con i nostri stencil per diagrammi. I nuovi connettori ereditano lo stile dell'ultimo connettore usato su quella pagina.

Puoi formattare i connettori in Modalità di modifica, sia individualmente che come selezione. Facendo clic su qualsiasi connettore si aprirà la sezione Stile Connettore del Pannello Format.

Quando selezioni un singolo connettore, il nome di quel connettore viene visualizzato nella parte superiore del pannello. Questo rende facile localizzare e identificare quel connettore nel Pannello Schema.

Quando selezioni più connettori, il pannello mostra il numero di connettori in quel gruppo, al fine di aiutarti a confermare la selezione prima di applicare modifiche di stile o trasformazioni.

Puoi impostare il colore, la larghezza, lo stile del tratto del connettore e scegliere tra una serie di stili di linea (ortogonale, ortogonale arrotondato, curvo o retto). Puoi anche scegliere tra una serie di marcatori di inizio e fine, regolare l'opacità del connettore e aggiungere sia Rilascio ombra che Sfocatura.

A meno che tu non apporti una modifica, tutti i connettori che disegnerai in seguito adotteranno queste impostazioni di stile.

Etichettare i connettori

Un componente essenziale per il diagramming è la possibilità di aggiungere etichette direttamente alle linee del connettore. Ciò è particolarmente importante per i diagrammi di workflow, dove potresti dover indicare decisioni Sì o No. Le etichette sono anche utili per delineare le linee del connettore in diagrammi complessi, rendendo più facile identificarle – e navigare.

Per aggiungere una o più etichette a qualsiasi connettore, fai semplicemente doppio clic sulla linea del connettore. E, una volta aggiunta un'etichetta a un connettore, questa rimarrà automaticamente collegata a quella linea – e si adatterà in modo intelligente man mano che modifichi e aggiorni il tuo diagramma.

E puoi riutilizzare rapidamente le tue etichette clonandole. Copia e incolla, o trascina semplicemente un'etichetta tenendo premuto il tasto Alt/Option – proprio come faresti con qualsiasi altro oggetto Moqups.

Abbiamo anche progettato una funzionalità straordinaria per velocizzare il tuo workflow: la possibilità di scollegare e ricollegare le etichette. Fai semplicemente clic e trascina qualsiasi etichetta via da una linea; l'etichetta si staccherà automaticamente e, mentre la trascini verso una linea diversa, si aggancerà in posizione in modo fluido e intelligente.

Estensori del diagramma

Gli Estensori del diagramma rendono l'espansione dei flussi semplice come una pressione di tasto e funzionano su tutti gli stencil per diagrammi.

Selezionando qualsiasi stencil per diagrammi sulla pagina si riveleranno frecce su tutti e quattro i lati di quegli oggetti. Facendo clic su qualsiasi freccia si duplicherà quell'oggetto, si collegheranno automaticamente e si aprirà la modalità di modifica testo del nuovo oggetto per una rapida rinominazione.

Quando c'è uno stencil per diagrammi non bloccato immediatamente adiacente a quello che stai 'estendendo', facendo clic sugli estensori si collegheranno automaticamente i due oggetti. Altrimenti, l'estensore creerà un nuovo oggetto per il diagramma.

Container adesivi

All'interno della categoria Diagrammi di flusso, lo stencil Container viene utilizzato per creare diagrammi di processo e swimlane, e per raggruppare oggetti nei diagrammi di rete.

A causa dei suoi casi d'uso specifici, il container ha alcune funzionalità di formattazione uniche: adesività e orientamento.

Adesività del container

Lo stencil container è adesivo per impostazione predefinita – in tre modi diversi! Puoi…

1. Usare il container per catturare oggetti già sulla pagina
2. Aggiungere oggetti al container dalla libreria di stencil o dalla pagina
3. Usare l'effetto magnete per collegare più container insieme

Una volta che gli oggetti vengono catturati o aggiunti a un container, si spostano con quel container. Questo rende facile raggruppare e organizzare il contenuto del tuo diagramma.

Puoi attivare e disattivare l'adesività di un container nella sezione Comportamento appiccicoso del Pannello Format.

Orientamento del container

Quando aggiungi un container alla pagina, puoi scegliere il suo orientamento – verticale od orizzontale – nella sezione Orientamento Container del Pannello Format.

Puoi usare i container per raggruppare e organizzare qualsiasi tipo di oggetto, e per qualsiasi motivo – in effetti, ti incoraggiamo a improvvisare – ma ci sono tre casi d'uso principali che vale la pena notare qui:

Diagrammi di processo

Usa i container per creare swimlane e pool per tutti i tipi di diagrammi di processo – delineando le aree di responsabilità e chiarendo chi fa cosa.

Diagrammi di rete

I container consentono al tuo team di identificare, raggruppare ed etichettare i componenti correlati mentre mappi qualsiasi tipo di rete complessa.

Bacheche Kanban

I container sono ottimi per costruire bacheche Kanban che aiutano i team agili a visualizzare, gestire, analizzare e ottimizzare il loro workflow.

Sostituire gli stencil per diagrammi

Puoi aggiornare e sostituire rapidamente gli stencil per diagrammi che fanno già parte di un diagramma sulla pagina. Per sostituire uno stencil, trascina semplicemente il nuovo stencil su uno esistente e rilascia quando appare il simbolo 'sostituisci'.

La sostituzione funziona su tutti gli stencil Diagrammi di flusso e su alcuni stencil Use Case selezionati dove appropriato.

Incollare elenchi e dati CSV in formato diagramma

La nostra funzionalità Incolla in formato semplifica la trasformazione dei tuoi elenchi e dati in diagrammi di flusso immediatamente popolati:

1. Copia un elenco o CSV dal tuo desktop
2. Usa Ctrl/Cmd + V per incollare quei dati sulla tua pagina Moqups
3. Fai clic sul pulsante Diagramma di flusso sul modale Scegli un formato