Add Expand/Collapse buttons to Overview and Studio panels + A couple other ideas

I love the new Expand/Collapse feature! I've been wanting something like this for awhile now, and was pleased to see it implemented. That said, I have a few suggestions:

  1. It would be great if I could Expand/Collapse all sections of a pane (like Overview or Studio) without having to either scroll up to the top (in Overview) or close all the branches of a pane individually (in Studio). Sometimes I'm way down in the document Overview, or I've expanded multiple branches of the Studio pane while browsing.
  2. Sometimes it's a pain going into the Expand/Collapse submenu over and over again. If the feature I mentioned above were implemented, perhaps the first click on "Collapse" could collapse the current element (if it's not already collapsed) and then another click could "Collapse All"?
  3. The keyboard shortcuts for Cut/Copy/Paste don't seem to work with elements in the Overview pane.
  4. When I select an element and then activate the "Move" feature, sometimes I want to move the element to somewhere directly above itself, but the other buttons are in the way (Select Parent, Duplicate, Hide, etc.). Maybe we could hide those other buttons so they are out of the way whenever you are currently holding down the mouse button on the Move feature?
  5. When the thing I mentioned in number 4 gets in the way, I then try dragging the element to Overview pane, but the Overview pane has shifted all over the place by the time my mouse crosses over all the other items in the visual editor! Deactivating the feature where the Overview panel jumps around while trying to drag something over to that panel would fix this. Or perhaps even better, just make it so that there is a momentary delay between dragging an element over another element and then having the Overview pane scroll to the element being hovered over. That would allow you to either quickly drag an item to Overview, or let you hover over another element before you drag the original element to Overview. That would be cool!
  6. Next to Appearance, Options, and Animation, it would be really convenient to have another pane that lists everything you've customized for that element. If you couldn't modify attributes directly from there, maybe you could just click on something and then be taken to the appropriate pane/branch where you could modify your customization!
  7. Would be cool if when entering certain values, they defaulted to "px" or "em" or something. Sometimes I want to just keep trying out numbers without typing "px" over and over again.
  8. There are a few attributes I modify often, and it would be nice to have them in the Options pane (or perhaps a custom pane, where designers could have easy access to certain HTML attributes that they modify often). For me it's mostly the ID attribute. What if we were able to just move the Attributes pane up next to Options? That would save us from having to open and close the HTML window every time. It feels like the Attributes window is in the wrong place, taking up too much real estate from the HTML window.

Hope that helps! So far loving your product. Keep up the good work :-)

Sometimes it’s a pain going into the Expand/Collapse submenu over and over again

Agreed. I think we could use keyboard shortcuts for this.

The keyboard shortcuts for Cut/Copy/Paste don’t seem to work with elements in the Overview pane.

Pretty sure this is by design, since copying and pasting on the overview uses a menu with a variety of special options. I think Duplicating (ctrl-d) and dragging is the obvious method to copy/paste within the Overview panel.

When I select an element and then activate the “Move” feature, sometimes I want to move the element to somewhere directly above itself, but the other buttons are in the way (Select Parent, Duplicate, Hide, etc.)

Can't say I've experienced this. I don't seem to have this problem when I move components. Maybe you can take a screen capture/vid and show the problem?

When the thing I mentioned in number 4 gets in the way, I then try dragging the element to Overview pane, but the Overview pane has shifted all over the place by the time my mouse crosses over all the other items in the visual editor! Deactivating the feature where the Overview panel jumps around while trying to drag something over to that panel would fix this.

I don't find this to be a problem. Personally, I don't want any added "delays" to accommodate those who can't keep up with the software.

Next to Appearance, Options, and Animation, it would be really convenient to have another pane that lists everything you’ve customized for that element.

Any component that has been customized from the default state shows up in blue text in the Options panel. This lets you know right away what things have been changed.

Would be cool if when entering certain values, they defaulted to “px” or “em” or something. Sometimes I want to just keep trying out numbers without typing “px” over and over again.

Unless this was a selectable option (ex. preferences > default text unit: px) This would make things very inconvenient for those who work with many different values. Consider all the possible values an element might have... em, rem, ex, %, px, cm, mm, in, pt, pc, ch, vh, vw, vmin, vmax

it would be nice to have them in the Options pane (or perhaps a custom pane, where designers could have easy access to certain HTML attributes that they modify often).

Ideally, we should be able to rearrange any of the panels and place them into any other panels, similar to how you can do it in Adobe products like Photoshop. Getting the detachable HTML/Styles panels was a huge step that took a long time (and much begging from the users) to happen, so I wouldn't expect something like this soon, but I do agree, it would be nice to arrange the workspace in whichever way it feels the most comfortable for the user. Some programs are very flexible in the regard (like Adobe, Pinegrow) and some don't allow any alteration of the workspace. I personally don't have a huge issue with the Attributes panel being where it is because most of the time I'm writing CSS right next to the Attributes, and then adding classes and IDs, so I see no advantage to having the Attributes by the Options panel, since you're not writing any classes or IDs there.

I would have to disagree on your findings there Printninja, where there is no reason to do anything with the options panel. There is one major issue so far that I have come across that makes me have to use the Options panel instead of being able to just use the Attributes panel (which is also my preference). Link options do not show up in the Attributes panel until you have added a link path in the URL input box of the Options panel. Once you do that, then the link shows up in the Attributes panel as it should.

I would personally like to see that link area added to the Attributes panel via a checkbox saying that it will be a link. Box is checked, URL input area is added to the Attributes, or something similar. This would then make the Options panel not quite so detrimental for me other than breakpoint setups.

Thank you for the great suggestions! To address some of the ideas:

1) Maybe we can add "Collapse Tree" / "Collapse Panel" options to these menus so that the entire panel is collapsed. 4) Good idea. We should probably hide the blue bar when a drag is initiated so it doesn't get in the way. 5) Normally the automatic scrolling of the Overview panel is helpful, but I understand how it can be a problem. I can't think of a way to turn it off without breaking other interactions though. Maybe if we implement point 4 this would reduce the need to switch to the overview. 6) Instead of a separate panel maybe we should make it easier to see what's changed in the regular panels. Food for thought. 7) This is a good idea to explore. Maybe the app could remember the last unit you used and fill it in for you if it's omitted. We'll have to run some experiments to determine what would work best. 8) When the editor panel is detached as a second window, you can place it wherever you need. Maybe we can make the attributes panel detachable so that it can be a tab alongside HTML and Styles.

I hope that we can work on these in our next releases.

I love all of your responses. I do agree that automatic scrolling is a good feature. I just wonder if the rate of the auto scrolling feature could be delayed for a few hundred milliseconds, so that you could drag an element to the Overview pane without it jumping all around by the time you get there. You could still land on any element, if you wanted to. You'd just have to pause for a fraction of a second while you are over it. I tried rushing it. I don't know what that first #$:;)* was talking about. The application is rough around the edges, and as a software engineer, I'm just offering some ideas.

I like all those possibilities for sure.

For number 5, in many apps scrollable areas can be scrolled with the mouse wheel. I typically hate it when menu trees or app trees scroll with my mouse when I'm trying to do something else or trying to get to the right location or folder.

Is there any way to just turn off the auto scrolling and just have it so that we can scroll with our mouse even if we're dragging something? I do that with my Email client app as I have so many folders set up for personal and business that it goes below the window. It doesn't scroll when I mouse over it on it's own, only if I use my scroll button to scroll up and down. This way I can grab an email from my list and drag it to the tree and scroll up or down to the folder I want to drop it in. No fuss, no muss, and definitely no frustration in trying to get back and forth to the right location when it keeps scrolling lol.

Also, printninja, the problem isn't keeping up with your software. It's the software keeping up with us. There are so many hiccups in the interface. I don't think there's a single post on this entire forum of anyone complaining that they can’t keep up with your software., smart$_&.

Actually a good portion of the posts in this forum are from people that don't have a clue about web design itself let alone the app, so yes, there's a lot of not keeping up with the app going on @michaeln. Other than that, Printninja is a user here same as I am, we are not staff so anything we help with at all is out of the kindness of our hearts and love of this app.

@michaeln

Personally, I don't find there to be "so many hiccups" in this software's interface, nor do I find it to be "...rough around the edges." But then I've only been using Bootstrap Studio a little over two years, and I've only made about 1000 posts in these forums, so what do I know? I guess, being the smart #$:;)* that I am, I just need more time to reach your level of expertise with the program. Then I can make more informed responses without offending any other thin-skinned software engineers who might be lurking around here. ?

The discussion descended into personal attacks and we had to remove the replies. Please let's keep things civil.