Design Mockups (Updates Designer only)

[madsrh]

@luxamman

• I know exactly what you mean with the thickness of the icons, but I have to say the work in a real system much better than in the mockups (guess the better rendering). If they are too thin in some places, I thought we take the Suru icons and just make them a little thicker - so they still fit the rest of the design.

+1 Right, I would prefer the Suru style too.

@luxamman

• The window controls are using way too much space for my taste. The idea with the space around to have a bigger click space is good, but making them a square is not only taking too much space in the width but also looking too much out of space for me.

Using too much space? There’s plenty of space to take Anyway, I think the Ambiance buttons are too close. There’s nothing more annoying than hitting the close button when you were aming for the max button. I’ve been checking out the competition too and M$ uses a 3:2 aspect ratio. Also check @merlijn-sebrechts comment below:

@merlijn-sebrechts

I’d also like to draw your attention about the UX of the max/min/close buttons. The issue with ambiance is that the click area is wayy to small, making it hard to hit it. You don’t notice this until you’ve used Adwaita or other OS’s for a while.

One of the ways to solve this is with a theme like Nautilus_V22Nov17_A - higher contrast

Design Mockups (Updates Designer only) - #9 by godlyranchdressing - Theme Refresh - Ubuntu Community Hub

Here, you can make the entire area around the X clickable, not just a small circle. If the user clicks in the upper right corner of the window, the window will close, even if he doesn’t click right on the x. The size of the click area should be made clear when the mouse hovers over it, however.

@luxamman

• Heavy toggles - yeah, the ones used at the moment are big. I have the Suru toggles in three different sizes in the mockups, maybe we can use the mid and min size only.

I did a poor job explaining myself there - it’s not the actual size, but how they feel. The lever doesn’t have to fill half the button (looks less bulky) and by giving the toggle a border it’s easier to distinguish it from the background. In the image below the white lever bleends into the light gray background.