I think there is room to improve the way clickable nodes are rendered. I identified the following issues with the current design that are uncomfortable to me, and that I think might also be to other people:
- wires pass through the button instead of being connected to the left or right boundarie of the button. For example, this is a problem when a node has an input and also a button.
- button is small compared to the whole node. It is hard to click on it depending on the audience.
- button is limited to either right or left side, and its position is decided based on the lack of input or output, but these 2 variables should coexist and not be mutually exclusive. What I mean is that I should be able to have nodes with a button to either side AND still have inputs/outputs in the same side.
My proposal:
or with a smaller padding. This should be enough to drag the node. Its "draggable" region can be a little bigger than the visible, to avoid messing with the dragging feature.
I liked to see the button boundaries above the connectors because it kind looks 3D. But if you don't, the connectors can be transformed 2 pixels outwards on the X axis on each side.
A clickable node is rendered with its clickable region contained inside its boundaries, with a reasonable padding to still allow draging the node around. With this design buttons and wires won't interfere with each other, and developers won't have to chose the position of the button based on whether the node has zero inputs or outputs. Moreover, the clickable region is bigger and therefore easier to some types of Users to click.
To please everyone, a new feature flag could be added to the settings to enable this new button render or the old one.
"Render node button on the left/right" or "Render node as a button"
