Part 2 - 3/3
Window design

Window design

After breaking down the main desktop, it is time to spend some thoughts on the windows. As we know, we have two types of windows (not including the quite expensive operating system):

  • Regular windows
  • Gnome app styled windows.

Here are the mockups for the two:  First the Terminal, straight like always.

Next the Gnome Files:

As you can see, the window background is the same design like the dock and bar, but less transparent because it is too much distraction when windows from above are shining through. Buttons are in the same darker tone (just a transparent layer of black, with a brighter outline) and the window settings are next to the window buttons.

I think it is too confusing when the window settings are somewhere else – you should have it on the window (like it is here) or maybe on the dock – but not somewhere you don’t expect it to be. Be true, they don’t seem to fit into the top-bar.

Maximized Window

What challenged me was the maximized window part. Because one thing was clear – I don’t want to waste space, especially in height. Because most of us have 16:9 or 16:10 displays, my display even got a ratio of 21:9. So – no wasting of height!

This was one thing I really appreciated in Unity and miss in every other distribution. And no, macOS’ maximized window is not an alternative, because at the same time you lose fast access to everything else. But – a full screen (maybe focused?) mode is maybe a nice idea for the future.

The solution was to handle that with the window decorations and completely hide the top-bar.

How will that look without confusing people?

Like that for ordinary windows, but LibreOffice needs to have a little fix (the “Untitled Document” part). The content (screenshot) is not right scaled/filled, I know:

Like that for Gnome apps:

Well, you’re right: The “Information-Center” and the “Me and the Machine” button still work like before. The app-name is written next to the date and time. The window buttons are next to the “Me and the Machine” button. Everything is still where you expect it. Maybe we even can get rid of the window name next to the date and time.

Half Maximized Window

But one more thing was really bugging me – I like to have two windows next to each other. Like two file windows, or a PDF and the LibreOffice Writer. The date and clock moves a little to the side, giving the possibility to have full height, presenting the rest of the screen as a separated area.

What about that, window on the right:

Two Half Maximized Windows

This is a bit of a compromise, the top-bar gets quite full, but it works. And there is no question how to close one of the windows. When one window is closed it behaves like a half maximized window.

So, the windows management is a little more complicated and will need a lot of adjustment to work in every circumstance. But – maybe with a way like this we can also have a quite unique, but simple way for that. Maybe the presented way is not the best or it is not working in every situation. And maybe the development would be too complicated, or is not working with the tools we now use as a base. 

But you know what? Let’s find out!

To try the design, you can view the clickable presentation of Adobe XD.