Need Advice on Giving these GUI's more 'UMPH'!

Hello! I am in need of some advice on how to make the GUI examples I’m about to show you, into something clean, exciting, and professional! I’ll tell you what the purpose of each Gui is, and then provide picture examples, and i’d really appreciate any advice or suggestions!

  1. Inventory GUI

There are currently 4 different categories of items that appear in your inventory… this is just set to apparel in the picture. You’ll see around the player are different slots for different items. There’s Right/left shoulder, back, Headwear, Uppebody/Fullset (Meaning if its catagorized as a full set of clothing it will force the clothing over both lower and upper as opposed to being able to be mismatched), and lower body, and the tool slot, which is any kind of hand held weapon or tool.

Then there is the toolbelt, which you’ll see on the far left. This is for usable items like potions or scrolls, etc.

Then there is the ‘Aires’ Panel, which is the currency in the game. Thats pretty self explanatory, but thats on the bottom right.

You’ll see a pop up icon over the item that’s being scrolled over, that is the item desc, it gives the name of the item, how much its worth, where it must be equipped to if you wana use it, such as upper body, or tool belt, or headwear, etc. and the type of item it is.

There is a help button for both the aires and the tool belt, you scroll your mouse over the question marks and a description pops up.


  1. Shop GUI

This is a very basic idea of what the shop gui looks like. Its very uninteresting. I’ve thought about adding like a local news thing on the left side that’s like a magical newspaper article (lore oriented) and talks about lore things going on in the area, maybe hints to quests or things going on. But idk. Basically you drag the item you wana buy up to buy, or the item you’re selling up to sell.


  1. Grimoire GUI (Spell Book)

    So… there are a few pages of the spells list, that go on, when you scroll over a spell the name apears at the top with its icon. And you can click the spell icon to take you to its page.


This is the spells description and information… such as what level you are at with that particular spell, cause you do have to practice spells to get better at them… thats the spell master bar, and the applied mysticisms spins around… its esentially just telling you which of the 5 catagories the spell is attributed to… or several catagories… it has to do with the level of each mysticism youre at, thats a whole other gui coming up.


  1. Mysticisms GUI

    This is probably the most boring one to me at this moment. Esentially these are skills, every time you level up you will get a point to put into one of these mysticisms, and this gui also tells you what level you are at the top. Though I hate the term level… and the way gameplay works you really do feel like your practicing magic and mastering it, even if you’re a master of magic, and learn a new spell, you still have to practice a spell to get it to its full potential. Each spell is attributed to a mysticism and the level of the mysticisms gives boosts to those spells. When you click one of the picture icons, the silver arrow around the top icon moves to whichever one you clicked and it gives you a description of that mysticism.

Ultimately I plan to overhaul the functionality of mysticisms in the game itself to make its application far more interesting… but for now this is what i’m working with.


  1. Quest book GUI

    This character only has the first quest at the moment, but as you get quests, they appear in the book, and you can click the quests to see their descriptions. Currently when you finish a quest nothing happens in the book, i’d like to remedy that, if anyone has any ideas. I will hopefully be making a quest trackign system in the future, thats what the bottom empty buttons are for. But theres a lot of empty unused space here.

  1. Aires Purchasing GUI


    This is a simple developer product page, when you scroll over an icon, it expands a little bit with a sound effect.

  2. The players bottom interface


    When you recieve a quest , which is the golden floral image, or you gain a new mysticism point, which is the gold swirly icon, the icons expand and shrink constantly to let you know theres something new in the gui.

    This is with the toolbar open. The bottom yellow bar is the experience bar.

I left room on the right for a settings tab later, i will just move the little element over and add the icon when i’m ready for that. That will include music volume and other stuff.


Bottom line is there is a lot of empty space in the GUI’s and i’d like to fill them up smartly without putting in pointless stuff. I’d appreciate any advice! THANKS!

-Manelin

17 Likes

These. guis. are. freakin. amazin!
These are some of the greatest ui designs I’ve EVER seen! They just look a bit squished in with the screen, and they’re a bit dark. Dark ui’s dont really appeal to the roblox audience, as kids like pressing bright buttons.


Ok, starting off with the first ui, the inventory, the word “Inventory” doesn’t really fit? Maybe try a different font, or round it a bit. Also, the X button is a bit misplaced.


In the first grimoire imagine, the spells (in the top left) word is barely readable in my eyes, (im colorblind so that may be why) and the font is a bit weird. I can’t really see the boxes, especially the ones ontop of the light. The spells word on the bottom left is also a bit hard to see, and is a weird font. The texts on the bottom right too. Ok, the next grimoire one, the text/button on the right page, its not even, I don’t know if thats on purpose. but its bugging me.


In the quest book gui, the black text does not go with it, you should change the color, and font, and make it rounded a bit. I have no other advice, sorry, but I really hope I helped.


In conclusion, the ui is amazing and needs minor improvement. All I really suggest, is changing up the fonts, and making the general ui brighter.

3 Likes

Thanks so much for the compliment! :slight_smile:

Yeah, they are darker, the game is a bit more serious… and definitely super high fantasy.

I’ll take your suggestions into account :slight_smile: DANKA!

2 Likes

Wow I have one word to describe these guis, Amazing.
I have never seen a gui with so much detail, I think it is perfect the way it is.
if your game keeps heading the way I think it is well its gonna be a smash hit.

-dann922

1 Like

If you are going for a more natural look to the pictures on the spell book like the Orlora picture you could change its shape or blend it onto the page, since the Orlora picture is a very defined shape it makes it looks a little out of place (no offense).

A way you could blend it would be by creating a second layer underneath the picture with the same color pattern and smudging/blending that one outwards to make a less defined shape (I don’t know if you have layers on what you are using for your GUIs, or if while you were making it you made layers)
Other then that your GUI Designs are AMAZING, you have amazing talent, keep up the good work, and keep doing what you are doing!

2 Likes

What would you suggest as an alternative to “Inventory”?

1 Like

No, leave the word, just change it up. And, I have no idea what mysticisms means, I suggest changing that, because I don’t believe many other 15 year olds would.

You learn through the game, its part of lore and the games story. Theres a comprehensive main story line. The game will ultimately be completely voice acted aswell. But through the first like 2 quests, the player learns all they need to know about that.

1 Like

I would initially suggest messing with the font color and style to make things more readable, as it’s a bit hard to read. However, I’d eventually look into a more icon-based Gui, especially for the inventory/equipment screen. This should allow you to increase the displayed size of each equipment slot.

Like someone else said, parts of the GUI should be lighter. I understand that the game is a bit darker (thematically and aesthetically) but for readability purposes, some areas need better contrast. For example, the dark gray background of the inventory screen makes the dark purple clothing of the character sort of “meld together”.

As for the icons, here’s a mockup I threw together:

Again, this is a mockup, and I can’t come up off the top of my head what icon could represent “back,” but you get the idea. Basically, these white icons would be replaced with the respective equipment icon when it’s actually equipped.

1 Like

Im really not the type who compliments people but WOW xD

Im impressed, they remind me of the old rpg games I used to play, keep the work up, id like to see where this game is going.

1 Like

https://www.roblox.com/games/2248817770/The-Realms-of-Amrial-The-Perishing-Past-Alpha

1 Like

The entire game has an original soundtrack composed by me :slight_smile: and ultimately the whole game will be voice acted :stuck_out_tongue:

1 Like

Wow, xD idk what to say anymore is this a stand alone project?

Its based on a novel series that im writting. Set in a mythos story universe of my own devising.

wow now a novel? what else can you do? fly? xD

1 Like

Well… yeah. I am a magician. :stuck_out_tongue:

Wow , very good UI. Looks like UI from old RPGs. My suggestion : You can add more contrast in spell book. Also you can add frame for spell icons. Good luck with game!

1 Like

Honestly, more than critiquing the UI, I want to emphasize how excited I am to see this game come to life. Everything looks and sounds AMAZING. Only suggestion is to make the text more readable, apart from that it’s perfect imo.

Wow. I’m really flattered and surprised by all these compliments :flushed: Idk what to say.

1 Like

I have done as you suggested :stuck_out_tongue::

I aslo cleaned up some of the text, and made it more uniform, aswell as bigger.