Hey all. It’s been a long time since I’ve posted here.
From first glance, it does look rather basic but remember I am constricted with what I can and can’t do inside ROBLOX Studio. This was mainly to learn the ropes of UI.
I’m looking for feedback on my first UI that I have completed all in ROBLOX Studio without any external software assisting me such as Figma, Adobe XD etc.
I used a combination of frames, text labels and and text buttons; I used a balthazar font.
Really looking to hear from you guys be sure to let me know what software I should use to assist me on my UI Designing journey!
I really like what you did! I thinly toasted improve it you could add some UICorners and UIStrokes, but that could just be me, and also for the software I think that if you have a tablet than you could use Procreate, which is really easy and useful, but if you have only a PC then I don’t know
Really like it and congrats on the amazing UI. When I started UI design I wish I had these things in mind:
Color:
Use a set of 2-3 colors to make it not overly werd on the eyes and try to use color (-white and black/grey) when you need to drag attention to something (a buy button).
My prefrence is to design in dark mode then add color later to things that look bland.
Corners:
As said before try to use the UiCorner element and adjust to your liking. (I personaly use 0,15) or (0,10). Not everything should have the same radius as the smaller the element (even if using the same rounding) the bigger the curve.
Things I Really Like
Buy Button:
I really like the way you made the buy button overlap the text. It looks really clean there and I love how you did the same thing with the 'Boosts' text, with a rounded corner it would look perfect.
Visibility:
I love how everything is spaced perfectly and looks really nice overall. The only thing I would suggest to improve that would make the X button be fully within the frame and using a playfull (rounded) font. I like that everything is good contrast (white text fits the backgrounds (i.e. no dark text on dark bg)
Overall Rating:
2 Lettuce / 3 Tomatoes
or
8/10
To be a 10/10 you would need to add following:
Rounded corners.
X layout improved.
Tweening (More advanced, focus on design rn)
Pretty good for a start! Here are some things I’d reccomend:
Add UICorners
Bold the text
Play around with the fonts
Make the “X” button bigger
Make everything centered, Maybe use a UIGridLayout
And of course, keep experimenting and have fun!
I really like the colors you used and overall I think it’s great! Hopefully you can use my feedback to create even better UIs in the future! Good luck!
Colors : The colors are okay. Try to make not to make it too hard on the eyes. Depending on your style, you may use a dark colour range or light range. I use a dark range as I like the effect that dark colors give.
UICorner : UICorner is one of the best ways to make your UI look better. You see the sharp edges, they can turn into softer edges. Here is an example. Try to ignore the rest.
Try to ignore the rest and look at the small rectangles that say flight, speed and jump. They have rounded corners and enhance the look of the UI. For learners, you should experiment with UICorner.
Tips :
Try to center the text and everything
Play with fonts and see which one fits. I know it is tedious.
Keep practising and you will eventually become better.
