Feedback on my first UI design for a game

Hey devs!
So if you have some time to read this,
I would like to ask you feedbacks about my first ui design I made in Figma.
I’m an experimented programmer but I have never really touched to ui, and I just made a game but all the interface is a draft to test the systems.
So, I created those 3 frames for the moment which are a part of the ui.
Positive feedbacks would be nice but I’m mainly looking for things to correct :stuck_out_tongue:
Thanks if you read this, here are the frames:



(here the human character is a template I’ll use a Roblox one)

(also I guess but I’m not sure that’s why i’am asking there is some color missing like it might be to much purple but I don’t really know what to change…)

:slight_smile:

4 Likes

cool and clean… im not so sure about the vertical stripes but that’s just me

there is a lot of purple but its whatever. if you want more colors you can change the colors of the buttons.

anyways looks cool

1 Like

Thanks for the feedback!
gotcha gonna change the buttons, as for the stripe I’m hesitant too. But I don’t really know what to put there instead…

well it depends on the game.

if you game is 95% UI then uhhh yeah I guess stripes or a simple gradient would work

(purple is a bit bright for me (average dark mode user))

if your game is like 3d then a transparent background or a slight blur

1 Like

yeah it’s mainly ui actually, so I guess I will keep the stripes. then for the purple color… idk I will see later but thank you for your help I’m changing some buttons rn

what about this? I guess I darken the borders

That’s interesting… it kinda changes the vibe a bit.

1 Like

Looks fantastic, imo. Very sleek for a first!
Though, I can’t give much proper criticism since I don’t know what type of game this is for or what vibe you’re aiming for.

1 Like

thanks for the feedback!
I’m actually making a game that people will be able to play with friend but like with short rounds only using text and some elements like that, so mainly interacting with the ui . The only 3D will be the characters. I don’t know if you know gartic phone it will be not at all the same goal but the same like “type” of game.

1 Like

Yeah, this looks way better than the first screenshot you sent. Also, I suspect that this is 100% not your first time creating UI, it looks way too good for someone’s first time; I’m honestly shocked lol.

There is also the squint test, where you squint to see if the text appears, and this is a rule to a good design and shows that it is clear.
I’ll say that the Submit UI looks very close to the yellow color, but it works in a way; that might be a bit difficult for some people to read. But, the design is amazing, and in general, it works.
image

The original pattern of the stripes was a bit of an eye-ache if you stared at it for a while, but the new one you’ve done is exponentially better.
No other comments, I don’t know what this would be used for, but what I do know is that this design is AMAZING. (I’m still in denial that this is your first UI design, apparently, you’re not only good at programming but also design!)

Anyway, keep working on this project and notify me if it releases (I would defo want to try this out) :wink:

Good luck!

Edit: This is one of the few gems I want to see completed as a full game/project. Honestly, you got me sold!

1 Like

Hey thanks for the feedback :stuck_out_tongue:

Actually it’s really my first ui for games I have made plugins but they look… kinda bad not gonna lie haha. It always was squarish and using Roblox default colors =/ I was making them just to have a ui for a working project.

wow I wouldn’t notice but now you tell it I totally agree! I will definitely remember this for futur work also , and I’ll show you the changed version of that button :wink:

But thank you very much for that feedback haha I will definitely tell you what the released game is soon (I just need to complete the interface)!

1 Like

so I have made this and know comparing to the old one I think it is better but I’m still not sure if it is enough. Also I have made a darker version of the background I’m still hesitating to keep it or not…


edit: I added semi bold to the font I guess it may be better to read :smiley:

A great way to check if your colours are accessible are to just look at them and see if you can read them clearly and easily (you should not struggle at all) from a distance. However, there are contrast checkers online that let you quantify how much contrast your colour pairing has, and compare them against accessibility standards. I use the WebAIM contrast checker.

Unfortunately, your colour palette fails all WCAG standards. (WCAG stands for Web Content Accessibility Guidelines.) You should aim for at least Level AA contrast.

May I suggest black instead of white?

1 Like

wow thank for that help!
I didn’t know such tools existed, I guess I’ll make the button darker maybe instead of making the text dark to keep the coherence in the ui.
But thank to all of you guys for helping me it’s very nice

1 Like

This UI design looks good! There is a lot of purple though, it could hurt some people’s eyes. Otherwise, nice job on it!

1 Like