Assume there is some arbitrary nested layout.
For instance, like
Board
- Group 1
- - Rectangle2
- - Layout 1
- - - Group 2
- - - -Rectangle 2
When I want to draw a rectangle within Group 2, my intuition is to do the following:
- Select group 2 in the layers panel
- Draw a rectangle somewhere
Expected Behavior:
The rectangle should be added to the Group 2 after drawing
Observed Behavior:
The rectangle is created as a child of the Board.
To make things more unintuitive, the layers tree view now centers around the new rectangle entry.
As a consequence, when creating any element, I have to select it in the tree view after adding it, cut it, scroll back to the element (e.g. Group 2) I wanted it to be a child of and paste it.
This makes working with penpot quite unintuitive and tedious for me.
Is there some shortcut (e.g. like holding a modifier while drawing a new object) to make it a child of the current.y selected group or layout?
2 Likes
Hello @wilecoyote!
It’s interesting that you expected this behavior. Are there any other prototyping tools that actually work this way? I’ve never noticed it before.
As a solution, I’d suggest using nested boards instead. They’ll absorb any elements placed above them as part of their hierarchy, which is the closest behavior to what you’re looking for.
1 Like
Respectfully, I agree with @wilecoyote - and this is a problem in Figma as well, with a number of user requests in their Ideas board.
The issue really is one of ergonomics and workflow. Once a designer gets good with flex layout and starts “thinking” this way, they often start designing a complex element “from the outside in”, in other words, thinking about the parent frame first, then inserting child frames, and then down to nested child frames and so on. Junior designers often start with the individual “atoms”, but when you are roughing in a layout, it’s often a lot better to work outside-in (or top-down if you prefer).
The issue @wilecoyote is referring to is a real inconvenience when working this way. You already know you want the child frame you’re about to create, to be nested at some point inside the existing hierarchy. But there is no facility to immediately create it at that level. The solution Björn is suggesting is exactly the right approach - select the layer in the hierarchy you want the new element to be a child of, and then drag to draw the child element.
If the user doesn’t want this element to be a child in an existing hierarchy, they can just press Esc before dragging, and with nothing selected, this element should be placed within the “outermost” object that shares a coordinate space with the origin of the drag - usually this would be the main frame.
The current workaround that is described by the OP is indeed very un-ergonomic, especially because the layers palette jumps and focuses the new element, and so that nested hierarchy could then be off-screen, necessitating even more time wasted scrolling elements.
1 Like
Hello @TomAuger!
I think you just described the behavior that happens when you use boards instead of groups. You can draw objects inside nested boards (and they will be created as a child there) and drag objects to nested boards. So, I guess the function would be nice to have in groups too, of course, but we technically have the solution for it right now: using boards instead of groups.
Hi @RenanMayrinckDesign! I’m still new to Penpot so I’m probably using the wrong terminology.
In Figma we have Groups and Frames, and generally you always want to use Frames over Groups.
I think in PP we have Groups and Boards, and again, probably want to use Boards more often than Groups.
So I think you’re right - it’s more important to have this functionality in Boards than in Groups, and I’m glad to hear that it’s already there.
