Thoughts on my shop GUI

[PlayAsync (aaa)]

I am creating a shop for my game and I decided to go with a round modern look.
What are your thoughts on it and how can I improve?

(Took inspiration from epic minigames)

[uJordy]

Good job on the UI, I’m digging it!
However a few concerns come up which is this, it doesn’t look properly placed- it should be away and off the button.

From what I see from multiple peoples’ UIs is that sometime it lacks continuity fully. When I say that, I mean, you have curved edges going throughout the UI but it stops for the minor details. Since you’re asking for feedback, I believe you should curve this frame:

Additionally, add a round top and bottom for this scroll frame:

Other than that, good job on the UI, I like it!

[PlayAsync (aaa)]

Thanks I will make sure to round the parts that aren’t already. I am not really sure where to place the exit button, have any ideas?

[uJordy]

Don’t try to squeeze everything, allow more space by changing the sizes of the buttons on the right hand size to accompany space for the X button

[PlayAsync (aaa)]

Alright will go ahead and make these changes, thanks.

[PlayAsync (aaa)]

How’s this?

[uJordy]

Much better, just be aware of the colour palette you’re using, but other than that, well done!

[PlayAsync (aaa)]

The colour of the scrolling bar and back of item images matches the type of items they selected to see.

[iacxx]

It’s a great start for sure. But there is room for improvement. I hope I’m not too harsh on you.
I’m gonna list whats I find wrong with the UI as well as including some advice, then i’ll list what I like about the UI. In the end I’ll post a mockup I created to try and steer you in the right direction, if you want to use the mockup.

Whats not gone too well.

• The orange background is not pleasant to look at. I prefer to use a neutral colour such as white.

• Round buttons. Don’t get me wrong, round buttons are amazing, they can make a UI look better. But you seem to have hit the unlucky spot of fully round and not rounded. Knock it back a bit in future UI’s. You’ve either got to commit to fully round or barley rounded.

• Colour palette. I saw that @uJordy mentioned it. You’ve got a very bright orange background and the two background buttons. You also have mid level colours such as the buy button or “get stars”. But the rest is pastel colours.
  You’ve got to find some colours that you like and you feel fit it well. I can suggest using https://flatuicolors.com or even just browsing around on the internet looking at other peoples UI’s and saving the images for references/colours.

• The text scaling. I see that you’ve used a textbutton and that means the text is gonna fit a bit weirdly depending on how big the textbutton is. The key here is use your rounded button as a background image, then apply a textlabel over the top with the correct sizing/positioning, then apply a button with the zIndex set to 2 so that the text doesn’t look odd.

Whats gone well

• The little drop shadows in this UI work great.

• The little rotated ‘X’ is great and we should roll with it for other things such as buttons.

Onto my mockup. I’ve done this in the past for someone else and will only do it to people who’ve made an attempt at creating a UI but fell a little short.

Now, this isn’t perfect as I’ve just mocked it up and didn’t spend much time on it. I still hope it gives the vibe i’m giving off with it though. I’ve looked at how your UI is and made changes where I think it will improve how it is.

As I said before, try to use a neutral colour like white for the background, its much easier on the eyes(well not at night time, but thats for another topic) and you can use nearly any colour with it.
On the subject of colour. I’ve gone a bit all out here and just used the entire colour palette. You shouldn’t really do this, just pick a few colours to work with.

I’ve fixed up the rounded corners on buttons, you can see that mine aren’t too rounded, but they arent square. You’ve just got to find the nice balance. (It’s a bit of a pain)

I’ve decided to roll with your rotated ‘x’ button and have applied it to other areas which gives the textlabels a nice feel, its something new, unique, not really done much in UI’s on roblox.

If you want to use parts of or use the mockup in full then feel free! If you don’t want too then I hope I’ve helped you and steered you the correct direction.

Anyway, good luck and carry on designing/creating!

[Christ_AImighty]

Apologies if my criticism sounds a bit harsh.

So, the design of the UI is good. I do like the title frame and the button design. I believe you’ve nailed that.

Now, let’s get to the negatives.

The color of the shop is NO BUENO. It’s never a good idea to use bright red. That color will assault player’s eyes. You should use a toned down color (light blue, grey, etc.) that’s more eye friendly.

Next, there’s no color palettes. This is a personal preference but it’s always a good idea to give your UI a color palette so it’s not just random colors.

[Johnswat1233]

The ‘Shop UI’ looks really good! I think it’s unique and would fit great in like a Simulator game. Good job!

[PlayAsync (aaa)]

Thanks I will definitely be using some of what your mockup has.

[younite]

Is the square behind the X an image? If it is, you should use @Quenty’s tutorial on how to remove the edges: Fixing images in Roblox ui (black outlines)