escot

A keyboard-driven flowchart editor. This is a re-incarnation of a previous attempt. I’m still working on autolayout but I’m much happier with this version:

https://knotend.com

Thank you! Will take a look

In a good work environment you’ll have some telepathy with your product people and you wont have to communicate every minor change, which wastes time. Its similar to implementing a UI design — you and the designer will develop a relationship where you dont need to communicate every pixel, you fill in the blanks and show results, repeat.

If youre a job seeker and would be interested to join a slack, drop a comment here or email me: scott@scottantipa.com

I was thinking one server and just for job seekers. Like a support group for people looking for tech jobs.

Maybe there could be channels per role/level, like #backend-senior, #ml-junior. So you could discuss hiring process and get tips from people looking for similar roles.

Very cool. It would be great to have auto complete across cells.

Interesting, do you have a source?

Thanks. Im interested in a book that explored more advanced design patterns. Like, supporting copying a resource. Or supporting —dry-run type functionality for requests that have side effects.

I’ve always wanted something like this but integrated into the terminal or vim. Like you could have a hotkey that sends a json object from your debug session over to this scratch pad to save for later.

Are you aware of any frameworks that take this approach? For example, if I could import their Datalist and use it, but at build or maybe runtime it decides what to use based on the target environment? We of course have this for tons of things like language features.

Another “do anything” material is 80/20 which is aluminum bars you can bolt together to make tons of different structures.

https://8020.net/

+1 for use of the term “Diamond Anvil Cell”

https://en.m.wikipedia.org/wiki/Diamond_anvil_cell

I use the following to edit contents of my clipboard:

    pbpaste | vipe | pbcopy

I highly recommend reading this. VisiCalc is the original spreadsheet and Bricklin details the whole story of its invention. So many gems about how he got around constraints, and added others to make the user experience simple. And spreadsheets still basically behave the same today!

having to add one extra node for the variable declaration feels cumbersome Well you don't always have to define a variable. For example `=sum()`in a node will just take all the parent values and sum them, whether they are variables or just pure values.

But you're right that if you want to define a variable its takes two nodes (the expression as the parent, then the `var foo` as the child). I should probably support defining a variable completely inside a node like `var foo = 1 + 2`.

I'm still a little hesitant to add any text on the arrows until I find a better way to do it via the keyboard. I find that just using the text in the nodes is usually sufficient anyways.

Ok I enabled computation for a little while on prod, but you have to know this super secret keyboard shortcut to turn it on: Control-Option-E. I'll leave it on at least a few days, and if you want to try more I can put up a more permanent link to a build with it.

Thank you for the feedback. I think theyre all great. One thing Im trying to figure out is to support adding text to connections, but do so in a keyboard centric way. I dont want people making graphs that require you to use the mouse a lot.

For staging — you can use Tab and Shift-Tab to connect the staged node to others. You just select the target node first. Maybe its not intuitive enough, please let me know if that makes sense.

Computation - I have a prototype for this. You can add formulad and math expressions to a node, and use inputs (upstream nodes). Ive just first been focusing on diagramming. Would you have a use case yourself? I could send you a link to a beta to try it if you like.

Here's a demo of the computation prototype: https://www.youtube.com/watch?v=kCiGK1z0ksg

I've found it to be the most accurate description. I think the core of what makes a flowchart is that its a directed graph, which knotend is.

Thanks! Thats the same reason I set out to make this. You can export currently to plant uml. Is there anything else you would want in particular for doing system diagraming?

Ya its been a bit of a research project for a while so Ive posted for feedback. Thanks!

Thanks! You can get the mermaid code from the Export menu. And Im happy to support other formats.

Thanks!

Sorry about that, could you send the link that is giving you the 414?

The encoding gives you cleaner urls that are restricted to the characters that base64 outputs, not necessarily shorter. The compression is to make it shorter.

I've been working on the app for over a year. The state-in-url thing was a pretty small portion of time, although I've fixed/updated it several times in that year to make it better. Thanks for the feedback. Did you make a flowchart?

URLs are great because you can share them. I may also add support for local storage, but it won't remove the ability to share via URL.

I just updated knotend to use the hashmark, see my comment above!

I just updated knotend so that it now uses the hashmark. I think this is a great idea, and it just loses the ability to get the urls server side, which in my case is totally fine. I also updated the blog post and acknowledged your comment, so thank you!

Thanks!

This is a great point, but also depends on what browsers you want to support. In my experience some browsers a) will truncate the url when you try to copy it from the browser bar (safari), and b) will not support any url including the hash past a certain cut off (like the SO comment states).