How to improve GUI

Any way I could improve this medieval style RPG GUI. Should I add a wood background or change some colors? Any help is very appreciated!

2 Likes

put inside white circle gray line is right

I don’t understand what your trying to say?

make white circle
gray line is right

Where do I make a white circle and what gray line is right?

Same this maybe

Or bigger 2 circle

Like this?

1 Like

are you creating ui for war game?

The rectangular background behind the three main icons looks unappealing, in my opinion. Try to remove them and see how they look afterwards.

I just removed the background border. Does it look better or should I remove?

I meant more of this. Try to remove the background where the icons are on top. image

I don’t know I think it looks better with the background. You tell me.

I did so ui but I do not know beautiful or disgusting

I prefer what I made over yours. That’s all I’m going to say.

1 Like

Try remove the purple gradient outline and thin the border.

Hi @marc2534

I got a couple of pointers you could use for improving your UI.

  • Your Buttons look huge! Unless this is the UI only meant for Mobile I would advice scaling it down.
  • Your UI doesn’t exactly portrait ‘medieval’ at the moment. You might get closer to the medieval rpg theme if you numb down on the steel/iron look.
  • I always advice to start with 3 to 5 sketches on the UI. Pick your best sketches and digitalize them, then try to get some feedback on it so you can mix/match them into one.
    Google is your friend! Simply Google ‘Medieval RPG UI’ and you can see a lot of examples in the ‘images’ section!

Here’s a couple of ideas you could work out in your sketches:

  • white thin lines with some ornamental features added to the lines.
  • Gritty iron mixed with wood, maybe make the icons look like shields of some sorts?
  • Castle wall-like background. torn banners and gothic ornaments.

Hope this helps!
-Dynastorious

1 Like

Hey, @Dynastorious

I took some of your advice and updated the look of it. Would love to hear more from you!
I also only use built in roblox gui. I don’t really use photoshop or external programs. Tell me if I should or not!

I’m going to be blunt, it looks unpleasing to my eyes.
Also, I would heavily recommend using a free program named krita for photo editing and UI gfx. It’ll help you make leads better UIs then what roblox can provide, while giving you a window into gfx as a potential career path.

Here’s some pointers and tips I personally would try out to make this ui look better.

  • Less saturation on the area where the icon goes, saturated colors draw attention, and when you want the player be be focusing on the actual item in the circle it can be distracting.
  • Make the UI’s overall color lighter. Imo the ui does not act like a screen overlay as of now because of how dark it is. UIs are supposed to be easily findable, and if your screen is a bit darker this task can be a LOT harder.
  • Smaller UI, it’s taking up a lot of unnecessary space on your screen that could be used seeing what your actually doing rather then accidentally having the UI in the way of what you’re doing.
  • Personally, I would spread out the centered-bottom UI colum a bit more apart.
  • Make the border 50-100% thicker.

Okay, these are some basic suggestions, if you want me to get really nitpicky just let me know. Also, it’d be nice to know what this ui’s purpose is serving, so yeah.

1 Like

Thanks for the krita recommendation, I actually recommended it to a friend for making animations a couple of years ago. Thanks for the tips and adjustments needed for the ui to look better. I’m quite new to ui so I wanted to test my skills by doing a commission for medieval styled rpg gui.
ALSO I would love to hear you delve in to the gui topic because I want to know more about something that I’m trying to improve upon. Would love to hear back from you!
Also I would like to add u on discord so I can message you on game design and overall stuff.