Improve or rework/redesign section header and selection

[Luuk1983]

Since Umbraco 8, we have a section header in Umbraco. It's clear what it does and works great in most cases. However, Umbraco is shipping with more and more addons and more people are building extension packages that all prefer to use sections. And it makes sense to use sections, since Umbraco's access management can easily be scope per section.

But I find myself refraining from using too many sections because it's already a long list and screen space is limited. But I would argue that even Umbraco should use more sections to make granular permissions even easier. The settings section is such an example; I think some features would benefit from their own section.

But the section header as it is now, it NOT fit for many more sections:

• Overflowing sections get hidden behind a three dot menu
• The order is entirely determined by the manifest and that means you are at the mercy of the creators of the package.

So I propose to rething the concept. I certainly don't have the holy grail, but I have some suggestions.

The quick wins

I think the quick wins are two fold:

• Allow for pinning sections so that the section that matter the most to your workflow are at the start.
• Replace the three dots with 'More (x)'. That makes it much more clear and you don't overlook it as easily.

Wilder ideas

Work with a launcher. This way you can also group things together and you have a lot of space for more sections. Sections become more like apps and it's easier to split functionality into multiple sections/apps because you are not restricted to the limited space in the header. The disadvantage is obviously an extra click.

A combination of a launcher and pinned items. The default is the launcher (the 9 dot button) and items that you pin are shown directly in the header. I like the idea itself, but I'm not sure if it's user friendly. I have my doubts, but wanted to mention it.

[OwainWilliams]

I was chatting to some people about this very thing last week. The top bar is getting very busy, and that is just with Umbraco products. Once you start adding custom packages, it becomes very busy.
I'm not sure what the solution is. It needs to be accessible and mobile friendly but also, it needs to work for everyone - admin / editors / package developers.
I like the pinned approach with the drop down menu but I wonder if that could also become "I want everything pinned". :)

[Luuk1983]

This discussion is obviously inspired by my UmbraDesktop. In my package, I really like the space the launcher provider + the option to actually pin it at the top. If it gets too much, you only get a vertical scrollbar, which works great.

But I recognize that an additional click every time you want to switch section could be annoying. An alternative is to see the current section header as a dock for the most common things and the launcher for the rest. So you get the 'pin to start menu' (launcher) and the 'pin to taskbar/dock' idea of Windows and mac.

[nielslyngsoe]

Interesting, would love to see extensive ideas and reflection on what would bring value.

The idea of collapsing the navigation into a burger menu has been floating around, so great to see how it could take form.

I would also propose considering a left-side navigation, or one that hides when scrolling. It could be as it looked in v.7 — The current top bar is not ideal for users on a laptop screen cause they lose important screen estate.

[Luuk1983]

This is an idea what a launcher could look like:

When the "9 dot" menu is pressed. Pinned items are always displayed in the header:

Searching is enabled

When you open a section that's not pinned, it will display it with the option to pin

Maybe the sections should have an optional 'icon only' mode, so it doesn't take all the space. In that case, it's much more equivalent on how the dock on Mac and the taskbar on Windows 11 work.

[skttl]

I like these @Luuk1983

Would be nice if you could set a default set of pins per group, eg. Content and Media would be pinned by default for editors.

[nielslyngsoe]

Interesting, you just got me more interested in the pinning feature.

And I also like the idea that User Groups bring a default pin configuration — in this way, devs can configure a good default for new users. (And the CMS can bring a good default for existing User Groups)

Then my head also somehow wanted the Global Search and the Launcher to become the same thing... Also would consider that some users would misunderstand that search field, so a joint search feature could help avoid misunderstandings and leave with fewer buttons in general.