How can I organize MainMenu UI

I’ve been working on re-making UI in my game lately to make it more simple. The game’s audience is mostly 7-16 y/os and I was wondering how I could do this effectively.

I have tried looking up different menus on Google, but when I try to make something based off of it, it usually doesn’t look too good. I’m looking for help/feedback on the UI, I am also going to add a tips&tricks textlabel, I may try and make something like this:

Here’s the game if you want to test it out, though it’s not up-to-date;
Play “Killstreak Experience”

I am just looking at what you posted…

Here:

is a ton of different stuff, there is a lot going on in this screen…

First , think of if anyone can read the small print… I am looking at it on a laptop , and cannot read the smaller stuff… think if 40% of player or more are on mobile, (if your game supports )… will never be able to read it… I would get rid of the small text…

Step on, I would break the UI in to related items.

You have a loading screen info (not to say it says 0% and the grey bar looks like almost 50%) … but break this out into your first loading game area… with a fun exciting background image of the game, and the loading bar , and the skip or play…
and is the loading bar really needed, if they can just skip it

If you really need to preload stuff… I would just have the above , with a loading bar that goes fsat, regardless if it accurate, that then makes the Play green that they can click on…

then after that is another UI , which would be the next step…

I would look at , what are 95% of the players wanting to click on… , pretty much play. or a tutorial, or a game mode …

get rid of extra words… thumbs up like, Just say Like…
Play here, … just say PLAY

skip loading, get rid of it

… moving on…

what is all of this gobbly goop? cannot read the top stuff… what is it… why…

The Killstreak Experience… is that the name of the game? if so that is like huge, make it fancy , that is what you want them to see and remember…

Credit stuff at the bottom… move it out into your credits area…

spring is near, what?.. is your game a seasons theme ?

You want your UI to be crisp and clean, exciting, easy to understand, and start playing your game.


back to the loading % thing… I know that is a like a trend or a cool thing to do… but most people in my mind think it is a waste … and only REALLY needed for big games that are loading huge assets or shizzle…

if you game does not really have that need, and or perhaps you do want to have some time, loading in stuff… then use that time on a cool intro cutscene that plays for 15 seconds, that the player hears, killer tunes, VFX, about your game… and in the background the game is loading in, while the player is entertained…

then you pop up a menu system ui, which your game is still if needed loading in stuff in the background. so that is more time for your game to load in…

just a thought…

For context, the game’s based off of a game called Slap Battles, it’s a pretty popular and well known game, pretty addictive as well. Most games of this genre don’t have much effort put into them but I thought it’d be better asking other devs since to me it looks cluttered.

things to note

  • small print is transparent
  • stuff at the top is basically info

besides this i think you’re mostly correct. I think i’m going to try to make the menu way more straight forward, thx for the advice!

It looks great, but It seems very cluttered, alot of the same things are repeated and or can be shortened to free up screen space.

I would first make the loading screen an entirely different menu, and hide the rest of the UI while its playing, there you can include the game name, slap hand, and “Like and favorite the game to be notified when a new update comes out!” in a “tips” label, which could have multiple different tips (spring is near, game inspired by…).

The text at the very top (the game name, which is pretty faint) should be removed. I also notice every icon overall is very inconsistent, I would reccomend choosing a icon pack / style and sticking with it. The “wavy” effect on the buttons are stretched out, which can be fixed by changing the scale type.

I would also reccomend choosing a single font, and changing the font weights for headers, descriptions, etc.