Right-Click Select This is a read-only archive
← All ideas
  • Published 8 Oct 2023

Two column layout for nodes

Two column layout for nodes.png

Problem: default node layout presents readability issues.

  • Different padding rules make hard to understand information hierarchy.
    • Node attributes have different input and value types (color, string, drop down menus, number sliders with and without labels, etc).
    • Each of these types have different padding values and text spacing rules.
  • This increases cognitive load:
    • Our eyes try to understand or establish relations between each information piece.
    • It takes longer to understand how each node works or what it's doing.
  • With the introduction of subpanels, there's a promise of improving this.
    • However, current builds display headers that make hierarchy between elements somewhat more complicated to understand.

Analysis.png

Proposal: two columns layout, with standard spacing rules.

  • With this layout, there's only three levels of information to care about:
    • sections
    • labels
    • values

Video: improvements proposed

  • Two colum layout
  • Improved padding inside subpanels
  • Clear subpanel areas
  • Output sockets at the bottom right corner, following the western reading order from top left to bottom right.
  • New layout proposal for collapsed nodes.
100%

Development Status: Open

Upvote 24 Downvote 0
hperticarati
8 Oct 2023

6 Comments

fructdw

Output position changing any time you open / close subpanels is gonna get annoying very fast.

4
hperticarati Author

Thanks for the feedback. I will take a second look at the output socket position.

1
thorn

I think most of the ideas are worth considering, but no... not this one:

Output sockets at the bottom right corner, following the western reading order from top left to bottom right.

Not everything in the interface needs to be based on reading order; this is one thing that does not.

1
suhail1

these is a good one!!! layouts having three layouts could be implemented, we might not be using all the values in all materials!!!

but having output at bottom is not a good one, because these could confuse the people used to working output at the top, it makes it very hard adapt to changes.

corey1

Minus the output sockets at the bottom, your example layout is amazing! Also did you change source code to make the example in your video? I want to do this now

hperticarati Author

Thanks! I used a design software to prototype this idea. Would love to see it implemented <3