I made a menu UI that I’m going to publish. It’s meant to be easily configurable to be used across a variety of games.
What it includes:
I really like it! Only thing I gotta say tho is that the utility bar it’s a little too big, but for the rest is percet
The icons are way to big along with some of the text. The spacing, icon thickness, and general layout could also be improved.
In red, you can see all those spacing issues. The space between UI elements should be the same, or around the same, lengths. Some gaps here are small, and, some are long.
In bright blue, you see the UI Corner issues. It’s inconsistent. Mostly the example with the arrow pointing to it, but others might have the same issue too. From what I’ve learned, good UI is consistent.
In yellow, you can see the giant icons. These should be scaled down so that there is blank space around the icon. The ‘center’ of the icon should be the same, just the size should be, well, smaller. The icons could also be thicker as they are quite thin.
In pink, the text is harder to read than others. Consider a specific text size instead of auto-scaling it. It seems you have quite the amount of screen that you could still use, I’d utilize that more by making the whole menu bigger as well as the buttons.
In that beige color, there are two scrolling bars. They are two different colors, or maybe transparency. They should be the same for consistency sake.
UI is subjective, but there are some principles that are mostly good to follow like consistency, color theory, and typography. Speaking of typography, the font choice here is good I’d say, you could change it, but the issue is really the different sizes of the text.
The initial layout of the windows and buttons are good, however in my opinion, you could make the main window layout look better by mostly changing fonts and font sizes. The titles could be designed by only filling a corner and let’s say the settings, make an “underlined” design by putting the value name in a smaller font and the setting appears on the right side of the window. Or for the Help tab’s content is displayed like in a Word document: titles and paragraphs.
It just looks bad to just throw everything in the middle with a huge font.
About the button icons, I’d say the same as @Reditect:
Another thing, for UX, is to add transition animations and interaction effects.
@Reditect @FatherSystem64 Thank you both for your feedback, since I’m not a UI designer. I’ve taken what you’ve both suggested and applied them to the UI.
It looks a bit too bland. Maybe change the colour and add a gradient and/or pattern
The “Game Name” and “Announcements” buttons’ text are too large. You should probably lower the size of the text. Also, the settings icon looks slightly too big. Reducing the size of that along with a better background color, (The white is blinding my eyes. Just saying!), your UI will definitely look a lot more better.
