Call for participation: an ubuntu default theme lead by the community?

How does this relate to Shell dialogs?

Because you said that in adwaita dialogs are similar in gtk and shell, while in gtk there are two different types of dialogs

Shell uses dialogs similar to GTK’s MessageDialog. I said that a Shell dialogs in Yaru theme must also look like the GTK’s MessageDialog.

GTK and Shell dialogs design in pure GNOME is nearly same:

C’mon it’s written just a few posts above.

I share @frederik-f 's point of view, I’m not sure what’s the best. I still prefer interactive dialogs buttons over message dialog ones, and in fact at some point we had the same on shell as well.
Font is a different story, it’s likely better to have the same style.
Might be interesting to ask gnome people the reason of these differences, if there are some

1 Like

I would like to express the reason why it suggests the clear background for the icons of third parties and why it would be the correct option regardless of my tastes.

when Sam is asked for an icon for the ubuntu welcome
some members of the community designed a complete orange squircle with the circle of friends in the middle making the ubuntu logo go from being a circle to a squircle in its entirety, this violated the brand and in its search to make the icon without changing the identity of the ubuntu logo, Sam designed the following icon

ubuntu-welcome-app

if we look at the icon we identify the ubuntu logo in all its splendor, and we see the best solution for a third-party icon or brand in the suru style, this was an upstream decision and a very well designed design guideline where the icon or logo works like a pictogram on a clear vanilla squircle and it’s a wise choice from Sam

I can use the icon I want in my installation or I can create any icon that I want, but my comment goes in an objective and impartial way, expressing from my point what would be the best way to follow and it would be the clear vanilla squircle that was introduced in upstream
in the ubuntu welcome icon

1 Like

Full orange with horizontal fold looks much better than others

1 Like

A little while back I did a small weekend project as a PoC that does just that. It inserts a white background automatically to all third party installed apps to get a uniform look in Ubuntu. Maybe Yaru theme could use something similar?

An old screenshot from my desktop:

8 Likes

Holy crap nice! Quiet late to the show but this looks interesting!!!

How exactly did you do that? Is that a dashtodock modification?

3 Likes

Interesting, it would even be a little better if the squircle background can be checked according to the preminent icon color (like Unity did)

3 Likes

It is basically a python script that checks /usr/share/icons/hicolor/*/apps for icons that are not already part of Yaru, then use an ImageMagick python library to generate new squircle icons under ~/.local/share/icons/. The script is called every time I install a new package from apt to ensure new icons get reshaped.
There are some limitations like ImageMagick not handling SVG icons correctly which cause a quality drop (another library is probably needed), also some apps (especially proprietary) don’t store icons in hicolor folder.

2 Likes

I believe I can do that when I have some time.

Based on your suggestion, I extracted color palettes from the icons separately, and each time tried to apply a different color to the squircles. These are the results so far:

The results are quite random with some icons looking better than the others each time. I don’t know how Unity used to do things but its clear this is not the right way. I appreciate any suggestions.

Here’s the link if anyone wants to experiment with the script too:
https://github.com/Eskander/surufy/tree/colored-squircles

7 Likes

I vote for the squircles script!

EDIT: Tbh if @Eskander can incorporate a complementary background colour too then we don’t even need the Libre office icons.

2 Likes

Great start @Eskander - how about picking the colour and then turning it into a pastel shade? Perhaps pick one of the values in the colour (the “white” if these were paints) and then set it to midway between the original value and maximum? Then refine the formula if the end result is too pale or still too dark and maybe bring other values like saturation into the process…

EDIT: Whatever script is used we can manually edit the ones where the colour isn’t great (or we can use the white script as a fallback and manually choose colours for key apps like Libre Office). It’s still a massive time-saver and great for consistency in the UI!

1 Like

As you said @Eskander the extracted color palettes is pretty hit and miss, so that’s not an option IMHO.

I really like this idea :+1:

I wonder if you can make the white background transparent? I did a mockup where opacity is at 15% (sorry, I got lazy and didn’t do all the icons in this mockup, but you get the idea).
This way we don’t touch the branding of the icon, we hint/imply the suru squircle to frame the icon and the squircle background works with any icon color.

2 Likes

This is also a really nice approach. Would be interesting to see how the opacity works on the (changing) launcher, when the squircles change on some apps and not others as the launcher darkens. When I picture it I think it would be fine?

Honestly, I’m a fan of what @madsrh suggested, as well as the idea of taking a prominent color like unity7 did. Although I think changing saturation values in script would probably be sufficient, I understand how it could still be problematic, so the half opacity is still a good alternative.

I did wanna bring up, though, that if some sort of automated squircleization happened, could we possible change the shape of the hover highlight, too? Rn it’s rectangular, but it’d be really cool if it was instead a squircle slightly bigger to feel like there’s an outline around the icon. Extending further, we could make the app drawer button significantly different and make it circular.

Could do a mock-up in a bit if people are interested.

1 Like

An even quicker mockup (sorry) with the primary colors but at 25% opacity:

I’m not sure that only targeting the icon is actually possible, but you’re right that the current hover isn’t perfect. IMO because the hover effect is almost identical to the icon grouping (like Utilities). This is also an upstream (read Adwaita) issue.

@madsrh I think my favourite is your original opacity, followed by the original script with white squircles.

Is it possible for @Eskander to run the script with the 15% opacity to show the launcher too? Very exciting times for Yaru IMO. This effectively makes the whole squircle dilemma vanish.

2 Likes

Maybe white with as small percentage of primary color

great work! I was experimenting myself, but my script is not so mature :smiley:

It looks that secondary color might be a better solution, maybe working with alpha level