Deepak Singh

Senior Software Engineer @meta GraphQL

Building Dagflo, visualize technical concepts (open-sourcing soon)

[Deepak Singh @deepok102]

Engineering teams waste hours explaining systems that should take minutes to understand.

So today, I’m launching DAGFLO.

Dagflo gives coding agents the ability to turn codebases, systems, and algorithms into animated, step-by-step visualizations.

Connect the Dagflo MCP to Claude Code, Codex, Cursor, or your coding agent of choice.

Static diagrams are dead.

Early access is LIVE → https://t.co/4FNnqaWesk

[Deepak Singh @deepok102]

Made this into a Dagflo primitive

The Dagflo code is on the right for the visualization

[Kit Langton @kitlangton]

fun with nodes

[Deepak Singh @deepok102]

I agree. I keep seeing shitty solutions to this problem (honestly maybe my take is also shit lol, let's see).

I still believe there is a visual format to increase the speed to understand and express technical ideas.

Back in college, we’d whiteboard algorithms and proofs step by step. You could see the state change, erase things, move pieces around, and watch the logic unfold. This creates deep intuition but is a lot of work.

In an ideal world, we should be explaining all technical concepts in this style. My hope is that I can solve that, or maybe just contribute to it :)

[Deepak Singh @deepok102]

@c1111121212313 Ugc

[Deepak Singh @deepok102]

If you want a step by step guide on how to do a muscle up, use Dagflo

[Deepak Singh @deepok102]

Dagflo top of mind: we need better cause and effect animations.

Ever since seeing @kitlangton’s recent post with their blog visualizations, I realized the important of understanding WHAT cause something and HOW did it affect it.

We had a form of this in Dagflo with the Message primitive but coding agents often didn’t use it.

As an aside: I love using X because it gives me lots of inspiration on how to steer the project.

[Deepak Singh @deepok102]

Finalizing the look for Dagflo Tables

[Deepak Singh @deepok102]

The cause and effect animations look great! It really shows you what affects what. Let me explore this for Dagflo!

[Kit Langton @kitlangton]

am I getting carried away?

[Deepak Singh @deepok102]

@abstractlysaid @DaveJ Ima make a astra vs astra with dagflo post to show off!

[Deepak Singh @deepok102]

A lot better now!

Thanks Astra for fixing all my bugs :D

[Deepak Singh @deepok102]

finalizing these animations before open-sourcing

some bugs to fix

[Deepak Singh @deepok102]

finalizing these animations before open-sourcing

some bugs to fix

[Deepak Singh @deepok102]

I am proud to say I never got a Claude subscription.

Codex since day 1.

Can I get a free usage reset? @thsottiaux

[Deepak Singh @deepok102]

@TheDarkGoldMan Best of luck! I'm also from Montreal and moved to SF, although I didn't take a road trip. Bonne chance, on reste toujours quebecois, meme au USA!

[Deepak Singh @deepok102]

@thdxr @abstractlysaid @kitlangton I’m working on an OSS project to create animated, step-by-step visualizations of technical concepts (check my pinned post if curious!).

@abstractlysaid tags me on X posts that do similar work. I take them as inspiration to improve the project :)

[Deepak Singh @deepok102]

@abstractlysaid @kitlangton Already on it! Love the vibe and simple animations

[Deepak Singh @deepok102]

This is interesting....

I'll try some stuff out with this

[Deepak Singh @deepok102]

@kitlangton This looks oddly similar to my visualization tool to beat Mermaid!

Here I visualized a t3code PR

[Deepak Singh @deepok102]

@ramxcodes You should check out my project Dagflo! It's very similar!!

I really like the transition of moving the existing nodes, might use it as inspiration :)
https://t.co/xw1YtUoBos

[Deepak Singh @deepok102]

Engineering teams waste hours explaining systems that should take minutes to understand.

So today, I’m launching DAGFLO.

Dagflo gives coding agents the ability to turn codebases, systems, and algorithms into animated, step-by-step visualizations.

Connect the Dagflo MCP to Claude Code, Codex, Cursor, or your coding agent of choice.

Static diagrams are dead.

Early access is LIVE → https://t.co/4FNnqaWesk

[Deepak Singh @deepok102]

I love this type of visualization. Will add a similar flavour to Dagflo!

[Jules Blom @Mega_Jules]

When my React code gets unwieldy, I grab pen and paper and draw the component tree by hand, both parents (structure) and owners (data flow). Playing around with a tool that uses @aidenybai's bippy to draw both tree live, from any running React app, in the style of my blog diagram

[Deepak Singh @deepok102]

I NEED MORE CODEX USAGE PLEASE GIVE ME MORE RESETS

[Deepak Singh @deepok102]

@_ketan0 DOPE!! Listening to it asap

[Deepak Singh @deepok102]

This might sound crazy but I believe we are long overdue for a new visualization language.

Mermaid, Excalidraw, TLDraw, Lucidchart, Drawio are all amazing tools but were made in a pre-AI world.

Some of these adapted to AI but none were built to be AI-first. Think of it! They were initially built to cater to humans.

Look at the Excalidraw MCP. It has a cool demo but it hogs in tokens because Excalidraw’s JSON is so verbose.
Claude can make good Mermaid diagrams but they can be overly verbose and complex.

HTML is good too but is so flexible that step-by-step visualizations fall apart.