Overhaul the editor UI on mobile to be more touch-friendly

Describe the project you are working on

A small FPS game for android. The changes I propose should apply to any game made with godot on a phone or tablet.

Describe the problem or limitation you are having in your project

Godot on mobile is generally a bad experience and sluggish to use. I find myself pressing the wrong button all the time.

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

Overhaul the entire mobile UI to fit the platform. Pressing a section of the editor such as the filesystem, the inspector and scene tree brings it into focus at the center of the screen, with the elements being scaled a bit so there is more room for error.

Describe how your proposal will work, with code, pseudo-code, mock-ups, and/or diagrams

Here's how godot's UI looks on a Pixel 6: Screenshot_20240707-062643 Ignore the black part, I don't know why that's there.

Below I provide some concept art. Ignore the stretching, the concept art is just to show the general gist of how it should look. I will call the large part of the screen where the viewport, script editor and asset lib normally are the Focus Area, and the areas that can move to the focus area an Expandable Area. Names can change, I just can't think of anything else right now.

To interact with the scene tab, just tap on it to expand it. sceneexpanded To return to the normal start screen, tap the X on the left or any other expandable area.

Do the same with the filesystem tab. Files To get out, tap the X or another Expandable Area.

Maybe do some drop-downs.

Expandable Areas should be:

Large drop-downs like the scene button
Most tabs in the editor
Utilities on the bottom like the output, debugger and shader editor.
All windows, including but not limited to the project settings and editor settings.

Notes

Expandable Areas in the Focus area should be scaled.
I am conflicted whether or not to include the tabs of the selected area. If you click something like the scene tree, should the import tab be able to be selected from the Focus area? At this point I am not sure.
Maybe different colors could be used for the X or the background of the X.
This was not designed for tablet use, but it might work well on tablets.
I think this concept could use some refining. I am not A UI or UX designer, so for all I know this could be worse than the current UI, but I am pretty confident this is an improvement over the mobile UI.

If this enhancement will not be used often, can it be worked around with a few lines of script?

Maybe. Depending on how it is implemented, it could be a toggle in editor settings.

Is there a reason why this should be core and not an add-on in the asset library?

Godot's mobile editor is (From what I can tell) just the PC editor, ported to android. This makes it a slog to use on a phone. These changes should, in theory, make creating games with a phone MUCH easier out of the box. Also, I'm not entirely sure how an addon could change godot's UI so drastically.

godotengine / godot-proposals