“Chiunque userà questo tool sarà di diritto Re dei diagrammi a flusso” queste sono le parole incise sotto l’elsa dorata di Excalidraw, il progetto Open Source di cui vi parlerò oggi.
Benvenuti a OpenDev Explorer, la mia rubrica dedicata all’esplorazione del mondo Open Source che strizza un occhio alla developer experience. Io sono Riccardo (aka TheZal) e oggi vi parlerò di Excalidraw, un tool per la creazione di diagrammi di flusso ma anche di disegno a “mano libera” open source per chiunque abbia la necessità di mettere le sue idee su carta… digitale.
Panoramica generale
Excalidraw è uno strumento di disegno online open source che consente di creare schizzi e diagrammi in modo semplice e intuitivo.
La sua interfaccia utente minimale rende facile disegnare come se fosse su carta, ideale per brainstorming, diagrammi di flusso e wireframing inoltre Excalidraw supporta la collaborazione in tempo reale, permettendo a più utenti di lavorare insieme sullo stesso progetto.
È apprezzato per la sua capacità di creare disegni che sembrano fatti a mano e offre opzioni di esportazione in vari formati, come PNG e SVG, rendendolo un prezioso strumento per tutti.
Manuale di istruzioni
Installazione
Installare Excalidraw è semplicissimo, infatti è disponibile diversi package manager come npm e yarn ed è possibile installarlo usando uno dei seguenti comandi:
Usando npm:
npm install react react-dom @excalidraw/excalidraw
Code language: CSS (css)
Usando yarn:
yarn add react react-dom @excalidraw/excalidraw
Code language: CSS (css)
Utilizzo
Anche l’utilizzo di excalidraw risulta essere molto semplice, infatti basterà importare la libreria nel proprio componente e creare l’oggetto preso direttamente dalla libreria. Ecco un esempio:
import { Excalidraw } from "@excalidraw/excalidraw";
function App() {
return (
<>
<h1 style={{ textAlign: "center" }}>Excalidraw Example</h1>
<div style={{ height: "500px" }}>
<Excalidraw />
</div>
</>
);
}
Code language: JavaScript (javascript)
La developer experience
Excalidraw è molto apprezzato dai dev per la facilità con cui può essere implementato all’interno dei propri progetti.
Essendo open source, offre grande flessibilità e possibilità di personalizzazione, permettendo agli sviluppatori di adattarlo alle specifiche esigenze del loro software inoltre la sua API è ben documentata e consente una facile integrazione con altre applicazioni e piattaforme.
La leggerezza del codice e l’architettura modulare contribuiscono a una facile manutenzione e scalabilità, rendendolo una scelta affidabile per progetti di qualsiasi dimensione.
L’extra mile
L’extra mile di Excalidraw è dato dalla possibilità di creare una collaborazione in tempo reale tra team, permettendo a più utenti di lavorare simultaneamente sullo stesso disegno, facilitando la condivisione delle idee e migliorando la produttività dei membri del team.
Infatti per creare una sessione collaborativa su Excalidraw basterà avviare una sessione dal pulsante “Condividi” e mandare il link generato e tutti i partecipanti potranno vedere e modificare il disegno in tempo reale.
Il confronto con lo status quo
Excalidraw si distingue tra i suoi competitor come Draw.io grazie alla sua semplicità e immediatezza. Questo strumento di disegno online offre un’interfaccia intuitiva che permette di creare diagrammi e schizzi con facilità, senza una curva di apprendimento ripida.
La sua natura open-source garantisce flessibilità e continua innovazione dalla comunità che lo apprezza particolarmente e lo rende quasi “community driven”.
Inoltre, Excalidraw eccelle in collaborazione real-time, permettendo a più utenti di lavorare simultaneamente su un progetto con aggiornamenti immediati, cosa non possibile ad esempio con Draw.io.
A differenza di strumenti più complessi, Excalidraw si focalizza sull’essenzialità e la velocità, rendendolo ideale per brainstorming e prototipazione rapida.
Tiriamo le somme!
Quindi Excalidraw è super facile da implementare, super semplice da utilizzare e inoltre ha delle funzionalità di collaborazione in tempo reale già predisposte, il che lo rendono il perfetto tool da utilizzare per la creazione e la prototipazione di progetti.
Inoltre viene apprezzato per la sua capacità di creare disegni che sembrano fatti a mano e offre opzioni di esportazione in vari formati, come PNG e SVG, ma mantenendo comunque il file modificabile, rendendolo un prezioso strumento per tutti.