Announcement

Collapse
No announcement yet.

Unreal Engine 4 Deserves Clean UI

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

    [FEATURE REQUEST] Unreal Engine 4 Deserves Clean UI

    Hey guys, first of all, thank you for the awesome product!
    UE4 and its community are awesome!

    Summary: This is a re-design of the UE4 editor.
    So far the majority here ~85-90% like the new look in general with minor suggestions.

    Originally posted by Robinson Company View Post
    I love what you did with the UI. I wish I could use it right now. I LOVE UE4 but hate the UI.
    Originally posted by Maximum-Dev View Post
    Just saw the OP and I really love the design. Makes me want to spend more time with UE4 than I should.
    Originally posted by robob3ar View Post
    wow man, your UI is absolutely fantastic - I just now realize how the current UI is a bit of an visual cancer, it's like a party going on there, so much distracting elements. [...] this is amazballs
    Others ~10-15% don't like line/flat icons, usually arguing that flat / line icons are the new trend, conspiracy, whatever (no it's not), some contrast issues. The very small minority do not care much.

    UPDATE: I hear you! Fans of the current UI Please check the updated 'bridge' version!

    Current status: I'm currently NOT making the theme. Why: Please check the UE4 roadmap.
    And unfortunately, I don't have enough time for this expensive hobby (65h+ of work up to date).
    Maybe later, Epic? Thank you all for your support and feedback!

    Details below. Important stuff I'm marking with bold.




    Alpha:
    - accent and BG colors can be changed to lighter, darker tones easily
    - toolbar / modes vanilla icons can be left intact
    - new: experimental bright version
    - new: toolbar icons
    - new: laptop mode (WIP) - prototype with interactive animations: http://xddacp.axshare.com - please leave feedback!




    Laptop Mode (not finished and canceled) - please leave feedback
    Prototype with interactive animations: http://xddacp.axshare.com



    Low-quality GIF as an overview of interactivity:








    Before / after (latest bridge version - closest to the current UI):









    With line icons:













    Initial modern version:



    Before / after (initial modern version):






    Experimental bright version:








    What's next (canceled):
    - bridge: updated icons close to the vanilla version - done
    - modern: laptop mode (small screens) UX and UI - WIP
    - modern: new project UI dialog
    - modern: tutorials pop up UI and UX overhaul
    - modern: more UX updates

    - modern: downloadable theme (line icons)
    - bridge: downloadable theme (solid icons)Please read the thread below about dark color, flat UI, design process and more.

    What's included:

    UI:
    - I've tried to get rid of different visual styles
    - unexpected font sizes variations
    - the non-uniform language of icons (frontal and in perspective)
    - tune and de/emphasize accents (colorful XYZ controls)
    - fewer borders (negative space instead)
    - less visual noise (show unnecessary ? on hover, fewer icons with the same text!),
    - etc.

    UX:
    - ability to shrink panels with double click on borders,
    - smaller fonts for groups' titles,
    - ability to move, rotate, scale with mouse
    - laptop mode - smaller icons

    Collected feedback:
    - less black, add maybe gray, white(???) version
    - huge icons, make them smaller (btw toolbar icons can be shrunk in the settings)
    - wasted space, smaller fonts (btw toolbars' tabs can be hidden with right click)
    - make toolbar icons as text (maybe shift it to the menu - long wasted row of free space!)
    - a few tries with full-colored icons
    - extreme care about productivity, efficiency! take into consideration hotkeys, flows, etc.
    - ability to pin tabs for the longest time so I can keep my default layout where it is without accidently dragging things around.
    - a light variant for people who don't like dark themes.


    Do you have positive / negative experiences with the current UE4 interface?
    Attached Files
    Last edited by EXGAMESADRENALINE; 05-17-2018, 07:09 AM.

    #2
    I agree that current Visual style needs to be changes.
    I like your design much more than the current one.

    On good news side, at some point there was Visual Refresh for editor at roadmap. It could be nice, if the Editor styling could be refactored, so there could be mutiple styles present at the same time.
    https://github.com/iniside/ActionRPGGame - Action RPG Starter kit. Work in Progress. You can use it in whatever way you wish.

    Comment


      #3
      The editor needs a more compact UI. So much space wasted. I have a small monitor (1920x1200) and I can't have the Content Browser and the log opened at the same time. I can't read both of them.

      Comment


        #4
        Originally posted by Raildex_ View Post
        The editor needs a more compact UI. So much space wasted. I have a small monitor (1920x1200) and I can't have the Content Browser and the log opened at the same time. I can't read both of them.
        Solution to this is one 40" hd monitor and one or two portrait oriented 24". I cannot work on just single monitor.

        Comment


          #6
          Yup, would love to have modern UI!
          SuperGrid: Marketplace Page | Feedback Thread | Demo | Website
          Level design and prototyping for newbies

          Comment


            #7
            With due respect, I love native UI and I think it needs no changes.

            Comment


              #8
              It looks like a Qt application.
              I would use it, where is download button
              | Savior | USQLite | FSM | Object Pool | Sound Occlusion | Property Transfer | Magic Nodes | MORE |

              Comment


                #9
                I don't like that design. The current UI Highlights Elements & Sections with different colours. The dark skin looks a bit more fancy but when developing i do not really care about a fancy UI, i care about efficiency when working so the current UI. However i agree some changes could be needed, e.g. being able to disable the icons/buttons in certain areas to gain more space in the editor (The toolbar for example could be just text, giving you a bit more space for other elements)

                Comment


                  #10
                  Appreciate your efforts, but I also like the current design of the Editor a lot more. Yours might be more elegant, but it's worse for productivity.

                  Comment


                    #11
                    Thank you for all your feedback! I really appreciate that!

                    Here are some answers:
                    Originally posted by Raildex_ View Post
                    The editor needs a more compact UI. So much space wasted.
                    Yeah, the initial idea was not to reskin it to darker tones, fancy line icons, etc. but make it more productive and efficient.

                    Originally posted by iniside View Post
                    It could be nice if the Editor styling could be refactored, so there could be if the Editor styling could be refactored, so there could be mutiple styles present at the same time.
                    Maybe you're right, UE4 is a very versatile engine and the goal here is to make necessary changes first, and (maybe) fancy stuff later.
                    Originally posted by BrUnO XaVIeR View Post
                    It looks like a Qt application.
                    I would use it, where is download button
                    After the long nights developing this, this is a very welcome response from the community! Thanks for all your warm words!

                    ---

                    Originally posted by Deathrey View Post
                    With due respect, I love native UI and I think it needs no changes.
                    Originally posted by Burnz View Post
                    I don't like that design. The current UI Highlights Elements & Sections with different colours. The dark skin looks a bit more fancy but when developing i do not really care about a fancy UI, i care about efficiency when working so the current UI. However i agree some changes could be needed, e.g. being able to disable the icons/buttons in certain areas to gain more space in the editor (The toolbar for example could be just text, giving you a bit more space for other elements)
                    Thank you for your criticism. I was expecting to see such comments because you know we all hate those badly curated redesigns, especially if they hurt your productivity! I completely understand your position.

                    In the first attempt, I've tried to make very cautious reimagine of the current UI closer to the UI of well-established products on the market, without completely different UX solutions. Now let's divide this initial redesign to 2 imaginable parts: re-skin / re-design / re-style (you love it or hate it) and user experience.

                    What's included:

                    Initial re-skin:
                    - I've tried to get rid of different visual styles
                    - unexpected font sizes variations
                    - the non-uniform language of icons (frontal and in perspective)
                    - tune and de/emphasize accents (colorful xyz controls)
                    - fewer borders (negative space instead)
                    - less visual noise (show unnecessary ? on hover, fewer icons with the same text!),
                    - etc.

                    Initial UX:
                    - ability to shrink panels with double click on borders,
                    - smaller fonts for groups' titles,
                    - ability to move, rotate, scale with mouse
                    - suggest more here, this I'll try to address in the second part.

                    -

                    We all know that it's wise to bot fall to binary love / hate holy wars with votes / replies (both sides are right, you know).

                    Please leave all your positive / negative experiences with the current UE4 interface, so I can grab as many as possible issues that can be fixed quickly and easily and send you a few more updates based on your feedback.

                    Right now we've collected:
                    - less black, add maybe gray, white(???) version
                    - huge icons, make them smaller (btw toolbar icons can be shrunk in the settings)
                    - wasted space, smaller fonts (btw toolbars' tabs can be hidden with right click)
                    - make toolbar icons as text (maybe shift it to the menu - long wasted row of free space!)
                    - a few tries with full-colored icons

                    New:
                    - ability to pin tabs for the longest time so I can keep my default layout where it is without accidently dragging things around.

                    - a light variant for people who don't like dark themes.

                    - extreme care about productivity, efficiency! take into consideration hotkeys, flows, etc.
                    - please add more suggestions!

                    And let's discuss them after that again.
                    I'm here to listen to you very carefully. At the end of the day we're in the same boat : )
                    Thank you!
                    Last edited by EXGAMESADRENALINE; 02-16-2017, 12:07 PM. Reason: more suggestions

                    Comment


                      #12
                      Why now all have to be like Windows 10 design plain design, that is too simple. Is like if Dropbox and Windows 10 have a son, why all have to be the same meh. And all black I never get whay all need to be black, like all is too mysterious. And all designed by web designers, that is why even the modern games have the same copy paste transparent UI ?

                      In other hand your design is clear and that but I don't like all box style, in some years the new modern will be have the round corners back, and this will be like Windows 98. Since now all copy paste the same plane style.
                      But your design open a way to allow the color change, like gre/white/black since all is plain and you can change the colors without icons of colors.
                      Last edited by Hevedy; 02-16-2017, 11:39 AM.
                      Hevedy - Instance Tools: https://hevedy.itch.io/hevedyinstances
                      Hevedy - Image Tools: https://hevedy.itch.io/imagetools

                      Comment


                        #13
                        I also prefer the current UI but if this user interface can be as an additional Theme option to choose it would be cool!
                        it looks a little bit like IntrinsicĀ“s User Interface:
                        http://www.intrinsic-engine.com/

                        Comment


                          #14
                          Originally posted by Hevedy View Post
                          Why now all have to be like Windows 10 design plain design, that is too simple. Is like if Dropbox and Windows 10 have a son, why all have to be the same meh. And all black I never get whay all need to be black, like all is too mysterious. And all designed by web designers, that is why even the modern games have the same copy paste transparent UI ?

                          In other hand your design is clear and that but I don't like all box style, in some years the new modern will be have the round corners back, and this will be like Windows 98. Since now all copy paste the same plane style.
                          thank you for your feedback. The goal is not to make it all black/flat please read above.
                          and also for developers, it's much easier to maintain the flat panels, than that skeuomorphic 9-grid madness.
                          Last edited by EXGAMESADRENALINE; 02-16-2017, 11:43 AM.

                          Comment


                            #15
                            Originally posted by Hevedy View Post
                            But your design open a way to allow the color change, like gre/white/black since all is plain and you can change the colors without icons of colors.
                            Yep, that's the whole point - versatility, efficiency, fast dev cycles, not fancy icons or dark mysterious same as Win 10... oh my!
                            I think I'll send the toned down version because many see only "it's different!", "it's dark!" and not all hidden, but crucial details (covered in the "Initial re-skin:")

                            Comment

                            Working...
                            X