https://futureofcoding.org/ logo
Join Slack
Powered by
I'm prototyping excel-like functions in my keyboar...
# two-minute-week
s
I'm prototyping excel-like functions in my keyboard-driven flowchart editor

https://www.youtube.com/watch?v=kCiGK1z0ksg▾

If you want to try it out I enabled it on the beta site. There aren't any docs for the function stuff, but this is how it works: • Prefix 
=
before a function name. Supported functions: sum, avg, min, max (for numbers), upper, lower, replace (for strings) • Functions can have args or no args. With args, you can pass expressions or variables (see below). No args means it will try to implicitly get the value(s) from its dependencies. Eg 
=sum()
will sum all its upstream deps. • You can make variables eg 
var foo
in a node will have that node take on its parents value. • It supports numbers 
=1
, 
=1.1
, strings 
="foo"
, and basic math expressions. • Ctrl-Option-E toggles computation which can be helpful to debug
The production version is knotend.com, but computation isn't supported there.
Here's the graph that I did in the demo if you don't want to start from scratch.
j
That's a really nice way to visualize computation 🙂 My initial thought, and this might me half-baked and fall apart on closer inspection, was that "why do you need separate nodes for variables?". Excel has the concept of named cells, could you use something similar, e.g. there's a naming feature/action on nodes, but naming doesn't introduce additional nodes?
s
You're right I probably could, but a lot of the focus of knotend is to be keyboard-centric and text-centric. So I don't like having extra data about a node (other than color) which could instead be text. I also like vars because you can have multiple vars pointing to the same value (same upstream node) instead of having a value to have have as single name. I guess a way around that would be to have a way for a node to just take on its upstream node's value so you could have multiple nodes depending on a single node upstream, but giving them different var names. But I still need to experiment, and maybe 
var foo
is a little confusing or unnecessary.
j
I don't think keyboard navigation needs to take a hit. I see it more as the UI going from 
[Node value] --> [var name]
to 
[Node value | var name]
where both parts can accept keyboard focus/commands. What triggered me was seeing the 
[Node value] --> [var name]
shape being the same for each variable definition, and the possibility of reducing the number of arrows and boxes to better scale the UI.
j
Have you considered making the formulae and values visible at the same time? Something like this (quick sketch I mocked-up in Figma by modifying a screenshot):
s
@James Scott-Brown cool, I can try it. I just went the excel route. I think showing the values is more intuitive especially for non technical people. But I should experiment. I like just showing the values because theres less clutter mostly.
Open in Slack
PreviousNext
Powered by