Flowturi 2: Sankey Boogaloo

John WalleyJohn Walley
3 min read

Updates on the Flowturi app I started over here.

I’m finding that on more difficult tasks I’m typically using Chatty to refine my prompt for Cursor (and claude-3.7-sonnet). Especially, when I find that Cursor/Claude has made a few attempts to implement a feature without success.

I wish I had been grabbing screenshots of Grok generating interesting code. The most notable examples off the top of my head:

  • A line of code that read like a Robinhood promotion

  • A sequence of Arabic and/or special characters that caused a build failure, and seemingly broke the Grok conversation. It was never able to respond on that conversation, I had to start a new one.

  • Chatty and Grok seem to frequently generate Markdown that breaks the formatting when doing it inline in the conversation. Basically, it’ll be spitting fire in a block, and it’ll get into a code block and text surfaces out of the block it started in.

Big Features

Drag and Drop Labels

The layout computation is probably something that will always need improvement, but after looking over various test datasets I decided instead of trying to get a super genius layout computation that handles everything, it’d be best to just make a best-effort and let you drag labels around.

e.g.,

before

after

The custom label positions are stable for the duration of the animation. This is currently only available in Historical mode. Speaking of…

Real-Time Mode

This is one of those things I went into expecting problems. There were some, of course, but Flowturi now has a Real-Time toggle—and it works (at least with WebSockets)!

You want to test out Real-Time, but don't have something pushing Flowturi formatted data to a WebSocket? I got you.

flowturi-realtime-sandbox

This is a case where Chatty (free tier) was having trouble finishing the job. Cursor and Claude finally came through.

Repo [flowturi-realtime-sandbox](https://github.com/ThatOrJohn/flowturi-realtime-sandbox)

It lets you generate synthetic data in your choice of modes.

  • ./run.sh file generates data through Node.js scripts

  • ./run.sh flink generates data through Apache Flink and Kafka

The repo’s README has pointers to customizing the data as well.

What Now?

How Many Fast Premium Requests Do I have Left in Cursor?

As you can see above I’ve started playing around with changing the model for simple questions

Flowturi Designer

I’m thinking this will eat up a ton of premium model requests to get something working, but this is a candidate for the next big rock to move.

Layout Improvements

As mentioned earlier, I don’t think this can ever be “solved” since at the margins it will be subjective. But, there’s still a lot of things that could work better.

Versioning

It’s probably about time to start a versioning system.

Testing

Going to investigate some Visual Snapshot Tests, maybe Jest + React Testing Library to take DOM snapshots of the Sankey diagrams.

0
Subscribe to my newsletter

Read articles from John Walley directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

John Walley
John Walley