Simpler UI design

[alexfreyre]

Describe the project you are working on: UI Design proposals for Godot editor

Describe the problem or limitation you are having in your project: There is a space at the top of the screen one inch wide that is not used, and the viewport workspace is unnecessarily reduced.

Describe the feature / enhancement and how it helps to overcome the problem or limitation:

1. Use more screen space as a work area.
2. Regroup options in pop-up menus.
3. Make visible the tools related to the work being done at current time.
4. Make windows and tabs responsive.
5. Simplify the user interface.

What is changed:

How Godot looks now:

How Godot will looks:

Describe how your proposal will work, with code, pseudocode, mockups, and/or diagrams: I'm not a programmer, I'm a visual artist.

If this enhancement will not be used often, can it be worked around with a few lines of script?: This feature it's about the Godot UI.

Is there a reason why this should be core and not an add-on in the asset library?: The Godot UI it's part of the core.

[Kequc]

I like the bigger tabs, for sure. I commonly switch between 3d and script using the buttons at the top of the screen but if there were a keyboard shortcut I could get used to it.

What bothers me is that the draft of the new ui that you show doesn't seem to allow enough space on either side for the tools that are there. I'm not sure how you would fix that especially in translations that use up more space.

Also it seems that the mockup doesn't line up vertically on either side of the main window but I'm sure that would be trivial to fix.

[clayjohn]

This seems like a cool idea, but please update your post to use the template provided or else it will have to be closed (Rule 1). Please take a look at the rules in the README.

[alexfreyre]

@Kequc the 3D, 2D, Script and AssetLib buttons would be next to GLES3 or Vulkan in the future, being a popup window. Also for the "run scene" and "run custom scene" buttons within the group, "play, pause, stop".

This is simply a starting point, these proposals are spaces for discussion and if one is created, it is a necessity, the PR should not be taken as strict and definitive solutions.

Simply, this is a proposal that defines a small problem and offers a modest and particular solution.

I think that space should be economized, made a little simpler and that the buttons that are actually being used are visible. Although the main reason is not to hide the buttons, but to use that inch of screen that is wasted and make the window a little more spacious.

[alexfreyre]

@clayjohn is it better now?

[volzhs]

I personally use this layout. How will it look with this layout?

[alexfreyre]

Interesting point, but I give a solution for the initial problem. Can you make one for this? Accord to my opinion in that case probably the scene tab goes after the main menu on the right of "Help".

A problem that I see is that Godot UI is strict, not so much flexible nor responsive. Will be great in that case that the scene tabs adjust automatically beside the main menu.

Another thing that will be probably useful is hiding different windows like Atom does, for example:

[YuriSizov]

I am not the biggest fan of how some UI elements are done in current layout, but this solution only makes things worse for me. There are many circumstances where I need to quickly adjust the editor view, namely after it auto-changes to 2D/3D when I select a node (see #456 discussion). Then there is the fact that this top menu can be extended with plugins, which may result in many more cases where quick access is desirable:

By quick access I mean a way to change the view with one click, instead of going to look for a smallish dropdown list among other unrelated controls and selecting an option there with two click.

And I second volzhs's mention of different layouts. Godot Editor is highly customizable, which can be a blessing and a curse.

[alexfreyre]

The thing is, I bet for simplicity and flexibility. With a reloaded interface I don't feel comfortable to work. All my life I have studied, art, design and everything related to visuality, besides that my girlfriend is a psychologist.

All this knowledge has given me (on the subject we are discussing here) the perception that while you have more elements in your workspace more your attention feels stimulated to be distracted.

If we expose all the buttons and options of Godot it would not only be impossible to work but very uncomfortable to look at, the other extreme would be to hide everything in pop-up menus, perhaps a balanced midpoint is what we are looking for.

I like your proposal, maybe the point is not to remove those elements from above, maybe it is to make the Godot interface responsive and that adapts to the interface changes. Perhaps the possibility of collapsing is also made as I proposed here and that there are two ways or even that those buttons above collapse them and if I want to place them where I want, so we could all adjust the work space to our needs and ways.

That is the current problem that I observe in Godot, "if you want to collapse options to have space, you cannot, if you want to decouple a window, you cannot, everything is in its strict place", I do not criticize the work done, it is brilliantly done, I only propose alternatives that may be useful.

For example the inferior bar, "Output, Debugger, Audio ....." if I am editing a 3D scene or I am editing a code, why do I have to watch it? Also, why do I have only the option of maximizing a window and not hiding a side panel? As Atom does.

[YuriSizov]

All this knowledge has given me (on the subject we are discussing here) the perception that while you have more elements in your workspace more your attention feels stimulated to be distracted.

While it may be true from a psychological standpoint, almost any professional software has heavy on the eye UI. There is an argument, that while simpler UI may make it easier to start using a piece of software, having more tools at arm's length allows you to be more proficient with it in the end. That, and customization options, of course.

While Godot is always welcome to new people, it's important not to hinder the workflow of experienced users.

[alexfreyre]

Yes, for example UE4 has great icons, many buttons, a lot of contrast in them and very saturated colors. Personally I prefer a neutral work environment, I want my attention 100% focused on my work not on the software.

The software is the tool that allows me to do my job, if I am going to do carpentry or blacksmith work, a fluorescent hammer, which emits light, would be convenient? certainly not.

On the other hand if you have a workshop with mobile tables you can adjust your space to your work needs, right?

Also if you have several rooms for specific jobs it is more comfortable to perform certain tasks.

In Godot the living room and kitchen are in the same place. For example, you write a code while viewing the import tab or the file system which may be convenient in only certain cases, but not always.

[alexfreyre]

it's collapsed in the 3D button, the idea is for example to put in a pop-up "2D, 3D, Script, AssetLib" and you can change in any time but you will see only what you are using... and that save space!

El mié., 19 feb. 2020 a las 18:21, girng (notifications@github.com) escribió:

Where is the script button?

— You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub https://github.com/godotengine/godot-proposals/issues/492?email_source=notifications&email_token=AKDL3EKOHO5Q6NTXZERFRTTRDW5IZA5CNFSM4KWH35IKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEMKDC5Y#issuecomment-588525943, or unsubscribe https://github.com/notifications/unsubscribe-auth/AKDL3EPJVM5PHJXTGJPYEL3RDW5IZANCNFSM4KWH35IA .

[willnationsdev]

Personally I prefer a neutral work environment, I want my attention 100% focused on my work not on the software.

In the top-right corner of the main viewport, on the same line where all the scene tabs go, there is a ToolButton that shows four arrows pointing outward. If you click that button, the editor enters "Distraction-Free Mode" which hides the bottom panel, and side docks. You end up with only the main viewport and the 3 bars at the top (title bar, main menu bar with editor tabs and play buttons, scene tabs bar). As far as I can tell, that satisfies your core issue without compromising the quick access and extensibility of the centered editor tabs.

I for one prefer having the buttons exactly where they are. If I were to change anything, it would probably be the shortcuts used to access them since there isn't a prescribed way to shift over to user-defined editor tabs without coding it yourself.