Window Sidebar Transparency & Consistent OS Design

[jqackkk]

For a very, very long time, I have used and fully endorsed ElementaryOS for its simplicity, and consistent design across not just the OS itself, but the applications it ships with and more. Up until just recently with the release of ElementaryOS 8 'Circe', that design language has remained consistent.

The biggest issue I see (not really an issue per se, but more of a pet peeve) is with the transparency and how it is allotted throughout the system. The dock, while elegant and helpful, is somewhat transparent; as is the menu bar. However, I feel that having sidebars (like the one in tasks, or in calendar) being transparent would make the design feel much more consistent. With the same transparency as the dock, everything would be more "together", if you will. Of course, because ElementaryOS is accessibility friendly, there should be an option to turn this off too.

I ultimately feel that for a more consistent design, without the task of implementing blur everywhere to become a macOS clone, you guys should put transparency in more places. It would be something new, and something that would make the OS look much better.

[teamcons]

Blur is considered, because it would make for a more visible dock. Transparency is bleh because whatever is behind makes whatever is in front unreadable
imho the issue with putting transparency elsewhere is the usability aspect: how does transparency below buttons improve for usability and accessibility?

the top bar and dock have a case for them.
The dock is an element that overlays above other windows sometimes
while the top bar needs to be always there, but can make itself more discreet when not there

transparency for other elements can be achieved by doing overrides in the .config/gtk-4.0/gtk.css. I did do a theming script for the dock a while ago using that hack... but transparency feels cheap and you can never guarantee whatever is below will not make the UI an unreadable mess. Blur is more defensible, in that aspect

[danirabbit]

We're experimenting more with using transparency in shell elements, but I'm hesitant to use transparency in apps. I think beginning designers often fall into a trap of "consistency" which is really "sameness", when contrast—intentionally making things different from each other—is also a very important design tool. It's just as important for things that are similar to look similar as it is for things that are different to look different. The visual design should convey information about the UI and not just be an aesthetic layer on top of it.

In the shell, I think it makes sense to minimize shell UI so that it fades into the background and separate it visually so that you can tell when a piece of UI is from an application or from the operating system. Soon we'll be shipping transparency and blur in the window switcher and the dock for example. These are UIs that are icon heavy and light on text where I think it makes sense that their containers can be a bit more low contrast and give a feeling of transience. We want to push focus away from the shell itself an onto the apps and transparency is a way we can convey hierarchy.

Sidebars on the other hand are usually quite text heavy and really rely on the legibility of their text to be useful since they may have repeating iconography or convey status information in labels. There's been a ton of recent talk from designers about Apple's push to make all UI chrome transparent with Liquid Glass and how it doesn't seem to be a step forward in usability but instead seems to be chasing an aesthetic for the aesthetic's sake alone. I think we should be really careful about avoiding that same pitfall and making sure we use our visual design tools intentionally

That said there is some room for the "rule of cool". Sometimes it works out to do something just because it's fun and interesting. So I'm not totally opposed to visual design experiments where the only justification is "it looks cool" as long as that doesn't take away from usability. So if folks want to do mockups or proof of concepts to prove an idea they should :)