Giter VIP home page Giter VIP logo

awesome-diagramming's Introduction

Awesome Diagramming Awesome

A curated list of awesome diagramming tools available for software engineering teams. Feel free to contribute to this on-going list.

When diagrams are useful?

Diagrams are faster and compact way for knowledge transfer. It's much easier to convey system architechture with a diagram compared to writing an essay on it.

Diagrams are especially useful in providing high level overview of software design. Following are the most-widely used diagrams by engineering teams:

  • Sequence diagram - to visualize interaction between different components in a sequential order
  • System architecture diagram - to visualize system architecture
  • ER diagram - to visualize data models
  • Gantt diagram - used for project planning and timeline estimation

Factors to consider before choosing the diagramming tool

  • Free / Freemium / Paid
  • Open source or Closed source
  • Ease of use
  • Diagram as code vs Hand drawn
  • Visual Appearance - Modern / Minimalistic / Outdated / Hand-drawn

General Purpose (flexible for all kinds of diagrams)

  • Kroki (Free, Open Source, Diagram as code, Ease of use - Easy, Visual Appearance - Flexible).
    Examples - Link

  • Mermaid (Free, Open Source, Diagram as code, Ease of use - Easy, Visual Appearance - Modern).
    Examples - Link

  • Excalidraw (Freemium, Open Source, Hand drawn, Ease of use - Easy, Visual Appearance - Hand-drawn).
    Examples - Link

  • PlantUML (Free, Open Source, Diagram as code, Ease of use - Intermediete, Visual Appearance - Outdated)
    Examples - Link, Link

  • Draw.io (Free, Open Source (But Closed To Contribution), Hand drawn, Ease of use - Moderate, Visual Appearance - Modern).
    Examples - Link

  • Nomnoml (Free, Open Source, Diagram as code. Ease of use - Easy, Visual Apperance - Minimalistic).
    Examples - Link

  • Diagram.codes (Freemium, Closed Source, Diagram as code, Ease of use - Easy, Visual Appearance - Outdated).
    Examples - Link

  • Lucidchart (Paid, Closed Source, Hand drawn, Ease of use - Easy, Visual Appearance - Modern).
    Examples - Link

  • Blockdiag (Free, Open Source, Diagram as code, Ease of use - Easy, Visual Appearance - Outdated).
    Exampes - Link

Others - Miro, Gliffy, Inkscape, Plectica, Whimsical, ZenUML, Gleek, Structurizr, StarUML

Sequence diagram

  • Swimlanes (Free, Closed Source, Ease of use - Easy, Visual Appearance - Modern)
    Examples - Link

Others - Websequencediagrams, Sequencediagram.org

System design diagram

Essential readings
C4 Model, 5 types of architecture diagrams

  • Diagrams (Free, Open Source, Ease of use - Easy, Visual Appearance - Modern).
    Examples - Link

  • Terrastruct (Paid, Closed Source, Ease of use - Easy, Visual Appearance - Modern)
    Examples - Link

  • IcePanel (Paid, Closed Source, Hand drawn, Ease of use - Easy, Visual Appearance - Modern) Examples - Link

  • Lucidscale (Paid, Closed Source, Ease of use - Intermediete, Visual Appearance - Modern).
    Examples - Link

Others - Ilograph, Omnigraffle, Cloudcraft, CloudSkew

ER diagram

Essential Readings
How to choose your ERD?

  • DbDiagram (Freemium, Closed Source, Ease of use - Easy, Visual Appearance - Modern)
    Examples - Link

  • Azimutt (Free, Open Source, Ease of use - Easy, Visual Appearance - Modern).
    Examples - Link

    Azimutt is useful when you want to visualize existing database

  • QuickDBD (Free, Closed Source, Ease of use - Easy, Visual Appearance - Modern).
    Examples - Link

Others - DrawSql, ERD Plus, Creately, SqlDBM

Gantt Chart

Other good curated collections of diagramming tools

awesome-diagramming's People

Contributors

shubhamgrg04 avatar victorleach96 avatar alphagit avatar jknappe avatar denis-roy avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.