Adjusting the drag / selection model for frames.

[drfarrell]

Our drag / selection model for frames is actually not 1:1 with typical design tools. To break it down...

What Onlook does now (and what Framer does)

1. Hover over any element (red outline)
2. Click on that element and instantly select it

Pros: Instantly jump-in, start editing
Cons: If you're planning on dragging or arranging frames, you need somewhere to "grab" it. In our case, that's the topbar.

Design tools:

1. Hover over a frame and there is a colored outline around the edges of the frame, but not of the elements inside (Unless you're holding CMD while hovering, THEN there are outlines on the elements)
2. click the frame once, or click and drag, and you don't select any elements in the frame, but can move the frame around.
3. Double-click to focus the frame and drill-down to edit the elements inside the frame.

Pros: Best for when you need to have many frames on an infinite canvas, really intuitive for designers familiar with those tools.
Cons: Requires double-clicking to get into a page, may be a little bit of friction for people to understand what to do (double-clicking isn't always intuitive)

Curious what people's thoughts are. We could consider having a design that "boxes" the functions above the frame like in Framer:

But I do like the lighter-weight approach of just icons and text.