back button Back to blog

AI Diagramming Tools for Developers

Testing the best AI-powered diagramming tools for Software Developers. This evaluation compares Miro, Excalidraw, FigJam, and ChatGPT to highlight ease of use, customization, accuracy, and export options when it comes to creating technical diagrams with the help of AI.

Noah MatsellDecember 11, 2024
Copy URL
Contents

For Software Developers, diagrams are more than just visuals—they’re critical tools for understanding and communicating complex systems. Whether you’re designing a database schema, illustrating a workflow, or debugging an architecture, a well-crafted diagram can save hours of confusion.

With the rise of AI-powered tools, creating these diagrams has never been easier. In this post, I evaluate some of the most popular AI-enabled diagramming tools, including Miro, Excalidraw, Figma's FigJam, ChatGPT (with Mermaid). My goal is to see how they perform when tasked with real-world developer scenarios like sequence diagrams or database ERDs.

For this evaluation, I'll be creating two diagrams with each tool:

  1. A sequence diagram for a simple uploading a file in a web application.
The sequence diagram prompt
Create a sequence diagram for uploading a file in a web application. The process includes:
- The user selecting a file.
- The browser sending the file to the server.
- The server validating the file.
- The server storing the file in cloud storage.
- The server sending a success response - back to the browser.
- Label the actors as User, Browser, Server, and Cloud Storage.
  1. An entity relationship diagram (ERD) describing a simple database schema with a User, Author, and Post models.
The ERD prompt:
Create an entity relationship diagram for a database schema with the following models:

- User: Attributes include id (primary key), name, and email.
- Author: Attributes include id (primary key) and bio.
- Post: Attributes include id (primary key), title, content, and authorId (foreign key).

Relationships:
- A User can create many Posts.
- An Author is associated with a User (one-to-one).
- Each Post is written by one Author.

The 4 main evaluation criteria are:

  • Ease of use
  • Customization
  • Accuracy
  • Export options + Integration with other tools

Let the testing begin!


Miro

Miro is a popular online whiteboard tool that offers a wide range of features, including diagramming, collaboration, and project management.

At the moment their "Create with AI" offering seems pretty robust. In addition to diagrams, it allows for creating stickies, docs, and images too.

Sequence Diagram Output

ERD Output

Performance Evaluation

Miro had a really strong showing here. Their AI capabilities do feel polished and well integrated in the larger context. It was easy to use and the output was accurate.

  • 🟢🟢🟢⚪️ Ease of use
  • 🟢🟢🟢⚪️ Export options + Integration with other tools
  • 🟢🟢🟢⚪️ Customization
  • 🟢🟢🟢🟢 Accuracy

Miro Total Score: 13/16 (81.25%)

Excalidraw

Excalidraw is a free, open-source whiteboarding tool for creating diagrams. It's known for its simplicity and ease of use.

Their AI offerings currently include a text-to-diagram tool and a (pretty mindblowing) diagram-to-code tool.

Sequence Diagram Output

ERD Output

Performance Evaluation

Excalidraw's AI capabilities are pretty straightforward. They don't feel quite as integrated as Miro's, but the tool is still very easy to use. Unfortunately, the output for the ERD diagram was an image, which makes it less customizable.

  • 🟢🟢🟢⚪️ Ease of use
  • 🟢🟢🟢⚪️ Export options + Integration with other tools
  • 🟢🟢⚪️⚪️ Customization
  • 🟢🟢⚪️⚪️ Accuracy

Excalidraw Total Score: 10/16 (62.5%)

ChatGPT + Mermaid

One of the many ways that ChatGPT can be used is to generate diagrams. In this case, I used ChatGPT to generate Mermaid markdown-inspired code representing the diagrams.

Sequence Diagram Output

ERD Output

Performance Evaluation

This was a bit difficult to compare against other tools. The output was extremely fast and accurate, but the process was a bit more manual. You do need a bit of technical knowledge to use Mermaid, but once you get the hang of the syntax it becomes extremely powerful. Diagrams represented in code can be easily shared, integrated, and version controlled. Unfortunately the barrier to entry is a bit higher.

  • 🟢⚪️⚪️⚪️ Ease of use
  • 🟢🟢🟢⚪️ Export options + Integration with other tools
  • 🟢🟢⚪️⚪️ Customization
  • 🟢🟢🟢🟢 Accuracy

ChatGPT Total Score: 10/16 (62.5%)

FigJam

Figma's FigJam is another whiteboarding tool that complements its original design tool. It offers a range of features for collaboration, brainstorming, and diagramming. The "Generate" AI offering is still in beta, and seems to be tucked away in the top right menu bar.

Sequence Diagram Output

ERD Output

Performance Evaluation

Unfortunately it seems like the diagramming aspect of this tool isn't really meant for prime time quite yet. I found the input options to be a bit confusing to use and, of all the tools, it had the most trouble accurately representing the diagrams. It seemed to treat everything as a simple flow chart.

  • 🟢🟢⚪️⚪️ Ease of use
  • 🟢🟢🟢⚪️ Export options + Integration with other tools
  • 🟢🟢⚪️⚪️ Customization
  • 🟢⚪️⚪️⚪️ Accuracy

FigJam Total Score: 8/16 (50%)

Top Tool and Final Thoughts

After evaluating these tools, while each has strengths and trade-offs, the clear winner here is Miro with a score of 13/16. It stands out for a comparatively mature AI offering that is well integrated in its existing ecosystem. Out of the tools tested, it's the best overall choice for developers seeking quick, accurate, and customizable diagrams.

I'll also give an honourable mention to ChatGPT + Mermaid. While it does require more technical knowledge, it shines for those who want precise, code-based outputs that are easy to version control. If you'd rather write code than mess around with a GUI, this is the tool for you.

If you're ready to streamline your diagramming workflows with AI, I'd recommend giving one of these tools a try. And if there's a tool not mentioned here, I'd love to hear about it in the comments below 👇


Like this post?

Sign up and get notified when new posts are published!


Related in "ai"


    Comments