FEEDBACK REQUESTED: Looking for stylization tips over my Menus

[Deathking15]

Hi there! I'm looking to get feedback on the menu panels for the gamemode I'm writing. My past UI has primarily focused on functionality over form. This time around, with functionality knowledge in-hand, I want to develop a UI that looks a lot nicer and flows a lot better. What I have so far is rudimentary aesthetically, but functions well. If anyone in the community would like to suggest some changes to help make the UI look nicer, any tips at all would be appreciated. And before you say anything, I am aware how awful dermaDefault and Color(175, 175, 175) looks when it's applied to 90% of everything, but that's why I'm here. Critique away.

EDIT: removed links, code is no longer up-to-date with current menu

I suppose linking the menu code also means people may scrutinize the code itself. If you see something bad, feel free to share. I'm ready to be ripped to shreds for bad coding habits.

To start off, this is the first menu you will see after you select a team. It's a role-based shooter gamemode (as if we have enough of those, but hey, its what I want to make). Before a player can start playing, they must select a role, which changes what sort of weapons and equipment is available to them throughout the game.
[IMG]https://imgur.com/eyGF63M.jpg[/IMG]
Features include:
- Soft clicking on button mouse-overs and button selection
- Auto-updating role selection as you increase your in-game level.
- Auto-updating enemy and team role information (will only display "No information to Display" when there are no enemies or teammates - currently WIP)

This next picture shows the highlighting that occurs BOTH when you select a role (click on it once) and when you hover over it. This is disabled for locked roles.
[IMG]https://imgur.com/EbEU44O.jpg[/IMG]
Features:
- Selecting a role enables the two buttons at the bottom of the menu
-- Includes the same soft clicking sounds and highlighting as the role buttons
-- The left button describes the role and my intention with them
-- The right button tells the user what armor type the role comes equipped with

Clicking on the "armor" button (the right-side button) will open up this menu, where all of the armor types are described, in detail, and how health/damage mitigation/movement is effected by each armor type.
[IMG]https://imgur.com/iRKWg7S.jpg[/IMG]
Features:
- All armor types can be seen and compared
- Similar clicking/highlighting functionality as the buttons described above
- Lists the following: (WIP)
-- Damage mitigation (to the head, body, arms, and legs)
-- Starting and maximum health
-- Walk speed, run speed, and jump power

Clicking on the "role's description" button (the left-side button) will open up this menu, where all of the roles will be described more elaborately.
[IMG]https://imgur.com/1rDtRVM.jpg[/IMG]
Features:
- All roles can be seen and compared
- Similar clicking/highlighting functionality as the buttons described above
- Lists all weapon availability, based on weapon type (as mentioned above, weapon types will be limited by class, so, for example, a recon-type class won't be allowed access to shotguns and heavy machine guns)
-- Currently WIP, may need to extend this panel out a bit

Finally, the meat of the menu (so far) is the Loadout menu, where players can equip different primaries, secondaries, equipment, and different attachments for most of them (I'm currently using [URL="http://steamcommunity.com/sharedfiles/filedetails/?id=657241323"]Knife Kitty's DOI/INS2 weapon pack[/URL] for the gamemode.)
[IMG]https://imgur.com/bjsM3cB.jpg[/IMG]
Features:
- (WIP) Shop button in the upper right hand corner of the menu opens up a shop where in players can purchase new weapons (only available to certain classes) and attachments for those weapons
-- Currently undecided if attachment purchases will be on a per-weapon basis or not, each has its pros and cons
- (WIP) Quick-swap your purchased weapon by clicking on its model in the left hand side
- (WIP) Quick-swap your purchased attachments by clicking on their models underneath the weapon's model and information
-- In spaces where no model is equipped, a default icon is grayed-out indicating so
- (WIP) Weapon information that is better (or worse) compared to its default values will appear green or red, respectively
- (WIP) All weapon information is dynamically updated as you equip/de-equip attachments
- Also has the same soft clicking and highlighting as described with the buttons from above

That is all I have for now, I'd like as much feedback/many suggestions as possible. So far it works really well, but I think it looks positively awful.

[sannys]

[IMG]https://imgur.com/1rDtRVM.jpg[/IMG]

Everything on the left feels so smushed. Try adding some padding. As for the right side, the floating text is very random. I think this would work a lot better if it just used icons to describe what the class can and can't access. If the class can access something, keep the icon the way it is. If it can't access something, dim the icon a little bit.

I've noticed in your code you aren't using docking, too. You should look into that, as it will make laying out your UI a lot easier.

[img]http://wiki.garrysmod.com/favicon.ico[/img] [url=http://wiki.garrysmod.com/page/Panel/Dock]Panel:Dock[/url]

[Deathking15]

[QUOTE=sannys;52794611][IMG]https://imgur.com/1rDtRVM.jpg[/IMG]

Everything on the left feels so smushed. Try adding some padding. As for the right side, the floating text is very random. I think this would work a lot better if it just used icons to describe what the class can and can't access. If the class can access something, keep the icon the way it is. If it can't access something, dim the icon a little bit.

I've noticed in your code you aren't using docking, too. You should look into that, as it will make laying out your UI a lot easier.

[img]http://wiki.garrysmod.com/favicon.ico[/img] [url=http://wiki.garrysmod.com/page/Panel/Dock]Panel:Dock[/url][/QUOTE]

Yea I was sort of thinking the same, the information is a bit crammed, both vertically and horizontally ("signated Marksm").

As for the text, I have it centered at 25%, 50%, and 75% of the description width, and 1, 2, 3, and 4 / 5's of the description's height. I suppose I ought to left-align the text but I don't have the capability of creating unique enough icons for your suggestion.

And as for Docking, how good is it really? Every developer I've spoken to has said to stay away from Docking.

[editline]18th October 2017[/editline]

Also I want to clarify that there are 3 options available in the weapon type descriptions: "Full," "Partial," and "No" (which really ought to be "none"). A light and dimmed icon doesn't quite work with 3 options.

[sannys]

[QUOTE=Deathking15;52794677]Yea I was sort of thinking the same, the information is a bit crammed, both vertically and horizontally ("signated Marksm").

As for the text, I have it centered at 25%, 50%, and 75% of the description width, and 1, 2, 3, and 4 / 5's of the description's height. I suppose I ought to left-align the text but I don't have the capability of creating unique enough icons for your suggestion.

And as for Docking, how good is it really? Every developer I've spoken to has said to stay away from Docking.

[editline]18th October 2017[/editline]

Also I want to clarify that there are 3 options available in the weapon type descriptions: "Full," "Partial," and "No" (which really ought to be "none"). A light and dimmed icon doesn't quite work with 3 options.[/QUOTE]

It's not perfect, but it is still excellent to use. Whoever told you to stay away from it has no idea what they're talking about. I recreated your panel in only a minute.

[IMG]https://i.imgur.com/FzR4s7z.png[/IMG]
[lua]local frame = vgui.Create("DFrame")
frame:SetSizable(true)
frame:SetSize(600, 300)
frame:Center()

local sidebar = frame:Add("Panel")
sidebar:Dock(LEFT)
sidebar:SetWide(200)

local main = frame:Add("DPanel")
main:Dock(FILL)

for i = 1, 8 do
local button = sidebar:Add("DButton")
button:Dock(TOP)
button:SetText(tostring(i))
end

frame:MakePopup()[/lua]
Docking also works with resizing. You can change the size of the frame, and the layout will stay the same.

And even though there are 3 options, you can still use icons. You just need to make partial ones different than the other 2. Maybe a little "!" icon in the corner of the icon? It's ultimately up to you, but that floating text alone just does not look good to me.

[Deathking15]

[QUOTE=sannys;52794951]It's not perfect, but it is still excellent to use. Whoever told you to stay away from it has no idea what they're talking about. I recreated your panel in only a minute.

[IMG]https://i.imgur.com/FzR4s7z.png[/IMG]
[lua]local frame = vgui.Create("DFrame")
frame:SetSizable(true)
frame:SetSize(600, 300)
frame:Center()

local sidebar = frame:Add("Panel")
sidebar:Dock(LEFT)
sidebar:SetWide(200)

local main = frame:Add("DPanel")
main:Dock(FILL)

for i = 1, 8 do
local button = sidebar:Add("DButton")
button:Dock(TOP)
button:SetText(tostring(i))
end

frame:MakePopup()[/lua]
Docking also works with resizing. You can change the size of the frame, and the layout will stay the same.

And even though there are 3 options, you can still use icons. You just need to make partial ones different than the other 2. Maybe a little "!" icon in the corner of the icon? It's ultimately up to you, but that floating text alone just does not look good to me.[/QUOTE]

"Who told me to stay away" is actually a multitude of people who, I guess, preferred the ability to do exactly what they wanted instead of relying on the system to margin off everything. IDK, I might try it in the upcoming menus I make but right now I'm quite comfortable with setting X/Y sizes and positions manually, and I'm worried trying to work with Docking may mess me up a bit. IDK, though, I'll have to see.

Regardless, I appreciate the criticism. Maybe a mix of both text and icon would work best, but again, I fail to have the means to create such icons, don't have the know-how, despite having the tools necessary.

Is there anything else you can think of? The grey on gray on black on white gets old and dull, in my eyes, but it's consistency when I can't think of a good pallet and design so it looks better than a fuckin' rainbow.

[Nak]

[QUOTE=Deathking15;52795044]"Who told me to stay away" is actually a multitude of people who, I guess, preferred the ability to do exactly what they wanted instead of relying on the system to margin off everything. [/QUOTE]
I've been there. vgui seems harder to code than a simple surface.DrawRect.
However vgui got a lot of benefits. Mouse interface, text-box, easy scale/edit and even an option hide the menu (So you don't have to destroy it each time you close it) .. ect
A lot of people say "stay away" simple cause they don't know how the panels work.

If you want your own design on the panels. You can use [img]http://wiki.garrysmod.com/favicon.ico[/img] [url=http://wiki.garrysmod.com/page/PANEL/Paint]PANEL:Paint[/url] and [img]http://wiki.garrysmod.com/favicon.ico[/img] [url=http://wiki.garrysmod.com/page/PANEL/PaintOver]PANEL:PaintOver[/url] to draw them.

[QUOTE=Deathking15;52795044]
Regardless, I appreciate the criticism. Maybe a mix of both text and icon would work best, but again, I fail to have the means to create such icons, don't have the know-how, despite having the tools necessary.[/QUOTE]
There are many websites that have icons people can use. e.g [url]http://game-icons.net/[/url] (cc-by) just know what licenses you're using and if you have to place credit for icons.

[QUOTE=Deathking15;52795044]
Is there anything else you can think of? The grey on gray on black on white gets old and dull, in my eyes, but it's consistency when I can't think of a good pallet and design so it looks better than a fuckin' rainbow.[/QUOTE]

Learn and create palette's [url]https://material.io/guidelines/style/color.html[/url]
[url]https://material.io/color/[/url]
Creating a table of colors, starting with the lightest and end with the darkest. Even if you don't use the whole spectrum, its still easier to switch and try different colors.

[Deathking15]

[QUOTE=Nak;52796124]I've been there. vgui seems harder to code than a simple surface.DrawRect.
However vgui got a lot of benefits. Mouse interface, text-box, easy scale/edit and even an option hide the menu (So you don't have to destroy it each time you close it) .. ect
A lot of people say "stay away" simple cause they don't know how the panels work.

If you want your own design on the panels. You can use [img]http://wiki.garrysmod.com/favicon.ico[/img] [url=http://wiki.garrysmod.com/page/PANEL/Paint]PANEL:Paint[/url] and [img]http://wiki.garrysmod.com/favicon.ico[/img] [url=http://wiki.garrysmod.com/page/PANEL/PaintOver]PANEL:PaintOver[/url] to draw them.

There are many websites that have icons people can use. e.g [url]http://game-icons.net/[/url] (cc-by) just know what licenses you're using and if you have to place credit for icons.

Learn and create palette's [url]https://material.io/guidelines/style/color.html[/url]
[url]https://material.io/color/[/url]
Creating a table of colors, starting with the lightest and end with the darkest. Even if you don't use the whole spectrum, its still easier to switch and try different colors.[/QUOTE]

Thanks for the links! I will surely utilize them, they look like they'd help a ton.

As for your first set of comments, what you see in my pictures is fully functional, it isn't just a bunch of painted rectangles and text. Not entirely sure what you mean by "vgui got a lot of benefits," as every panel you create is based out of the vgui class/library, so that would mean everything I've created so far is based out of the vgui library.

If anyone still has comments I'm open, especially regarding formatting or new functionality (maybe the role/armor description shouldn't be a separate window?)

[Hnaknaw]

Add me on steam :)
I love talking about vgui stuff!

When I get home I'll post a few tips on this thread related to your current menu ❤️

[Deathking15]

[QUOTE=Richtofen;52801635]Add me on steam :)
I love talking about vgui stuff!

When I get home I'll post a few tips on this thread related to your current menu ❤️[/QUOTE]

Request sent! I look forward to it.

[Deathking15]

- Snip -

[Deathking15]

I've just about finished the role selection menu and I'd like some feedback from anyone willing to provide. I deleted my last post because it was lazy and only contained a video. Here's some more pictures and explanations:

First window you see is this one here:
[IMG]https://imgur.com/HTWEAve.jpg[/IMG]
I'm utilizing icons as representations for much of the content in this new menu, I think it does a good job but the pictures are all pixelated.

Here's an example of some soft feedback the menu provides, light clicking noises and button highlights:
[IMG]https://i.imgur.com/WZkBNAT.png[/IMG]
Not anything fantastical, and in this case I think less is more.

Here's is the full role description menu. The "weapon access" and "armor information" information sections were previously in their own, separate menus (and at the time not displaying properly).
[IMG]https://imgur.com/XCM24yU.jpg[/IMG]
Something to note: the "availability" color underneath the weapon type changes based in its availability to the role.
Also, at the bottom, I was able to continue to display all of the different armor types that exist without it taking up much room

In this picture, I've selected a different role from before, and now you can see a similar stylization with the armor information text color, to that of the weapon availability seen above
[IMG]https://imgur.com/Is2h3OF.jpg[/IMG]
Armor information color is based on a comparison to the Standard Armor, so any role that comes equipped with standard armor will see all armor information as white

I also added a small animation to re-center the "Select a Role" and "Role Information" frames (since they are separate panels entirely), the animation of which can be seen here:
[IMG]https://media.giphy.com/media/26FfeMZKmWM6Pwc5G/giphy.gif[/IMG]
The animation won't play if you select a new role, it instead just replace the old panel with the new one.

Also to note: I used CoD MW2's font for this menu, but I'm worried this all looks to arcade-y, like it's a menu for a laser tag gamemode or some shit.

Lemme know what you think! Good, bad, ugly, anything in-between.

[Galaxy]

That looks pretty good compared to what it used to be, only tip I could really give is that I'd like to see more utilization of different colors. But if that's not the style you're going for than this is amazing and you should stick with it.

[Deathking15]

[QUOTE=GalaxyBeatzz;52817275]That looks pretty good compared to what it used to be, only tip I could really give is that I'd like to see more utilization of different colors. But if that's not the style you're going for than this is amazing and you should stick with it.[/QUOTE]

I'm aiming for a more gritty FPS gamemode with a minimalist attitude (think like Insurgency), and I sort of imagined a "dull," or dark, color theme the most fitting.

The scheme (extremely dark blue, blue, light blue, and white) actually changes to reds when you join the Red team (I suppose I can provide a snapshot of that), but the tone remains consistent across both schemes.

Thank you for the compliment, though! I feel as though it's a big improvement since the first as well, so I'm glad to see people share my sentiment.

[Deathking15]

Here's what it looks like red:
[IMG]https://i.imgur.com/UdATqkn.png[/IMG]

[Deathking15]

I also got the little "I" information icons working in the top right hand corner of the menus.

This is what shows when you press the top Info icon, and it gives the player an (essentially one-off) message about how roles work in this game.
[IMG]https://i.imgur.com/0ObwFL0.png[/IMG]
The information panel will move alongside the "Select a Role" panel when it does its animation when you select a role.

I've also managed to include a short little role description in the "Role Information" panel information icon. This is what it looks like together.
[IMG]https://i.imgur.com/A6F8lCY.png[/IMG]
Quite happy with it.

And of course, I'm looking for criticisms and critiques, so I'll listen to anything anyone says.

[Invule]

The icons look rather sharp, maybe go into photoshop or anything similar and add a gaussian blur behind it to increase its "smooth" ness, you could also mess around with materials second parameter.

[Deathking15]

[QUOTE=Invule;52821444]The icons look rather sharp, maybe go into photoshop or anything similar and add a gaussian blur behind it to increase its "smooth" ness, you could also mess around with materials second parameter.[/QUOTE]

Yea that's the problem when you resize 1024 x 1024 images into 80 x 80. If anyone knows of a surefire way to easily fix the pixelation, I'm listening.

[MelonShooter]

Invule is not saying it's pixelated. Invule's saying the image goes from black to white very abruptly and to add a slight blur to make it a more smooth transition from black to white.

[Deathking15]

[QUOTE=MelonShooter;52822219]Invule is not saying it's pixelated. Invule's saying the image goes from black to white very abruptly and to add a slight blur to make it a more smooth transition from black to white.[/QUOTE]

I've never done anything like that before, and the gmod wiki doesn't provide a list of available "second paramters" for Materials().

If anyone's got any links I'll take a look.

[Galaxy]

You've got to take the icons into Photoshop or any other photo editting software and soften the icons around the edges is what he's saying.

[MysteryPancake]

[QUOTE=Deathking15;52826230]I've never done anything like that before, and the gmod wiki doesn't provide a list of available "second paramters" for Materials()[/QUOTE]

If you're referring to this page: [img]http://wiki.garrysmod.com/favicon.ico[/img] [url=http://wiki.garrysmod.com/page/Global/Material]Material[/url]
It clearly does: [URL="https://wiki.garrysmod.com/page/Material_Parameters"]Material Parameters[/URL]
[t]https://i.imgur.com/Q5SFCj6.png[/t]
[t]https://i.imgur.com/juiT9G4.png[/t]

[Deathking15]

[QUOTE=MPan1;52826292]If you're referring to this page: [img]http://wiki.garrysmod.com/favicon.ico[/img] [url=http://wiki.garrysmod.com/page/Global/Material]Material[/url]
It clearly does: [URL="https://wiki.garrysmod.com/page/Material_Parameters"]Material Parameters[/URL]
[t]https://i.imgur.com/Q5SFCj6.png[/t]
[t]https://i.imgur.com/juiT9G4.png[/t][/QUOTE]

Doesn't provide a list of available "second paramters" for Materials that means anything to someone who doesn't know anything.*

I don't mean to seem rude but I've seen other parameters used before not on this list, such as noclamp_smooth. I remain skeptical because I don't know what most of those options mean/do/are.

[MysteryPancake]

[QUOTE=Deathking15;52827329]I don't mean to seem rude but I've seen other parameters used before not on this list, such as noclamp_smooth. I remain skeptical because I don't know what most of those options mean/do/are.[/QUOTE]
I think if people do that, they're just trying to set "noclamp" and "smooth" at the same time.
I don't think that way actually works though. I think you need a space, so it's "noclamp smooth".
[B]EDIT:[/B] [URL="https://github.com/Facepunch/garrysmod/blob/master/garrysmod/lua/includes/util.lua#L17-L30"]This way does in fact work, because the Material function performs a string find.[/URL]

I'll try to explain the parameters from what I know, but I may be wrong:

[B][URL="https://developer.valvesoftware.com/wiki/VertexLitGeneric"]vertexlitgeneric[/URL][/B]

[t]https://i.imgur.com/XUSFR0y.png[/t]

This is used in the VMT of most models that need correct lighting and shadows.
You don't really need to worry about it for 2D textures though, since they don't need lighting.
The only other commonly used option is unlitgeneric, which makes the model have no lighting at all, like if you type "mat_fullbright 1" in the console.
I don't know why it exists for textures though, maybe just for meshes.

[B][URL="https://developer.valvesoftware.com/wiki/$nocull"]nocull[/URL][/B]

[t]https://i.imgur.com/NS7096l.png[/t]

This makes the back of the texture get drawn all the time.
If you're working in 3D2D then this can help if you want a double sided texture.

[B][URL="https://developer.valvesoftware.com/wiki/$alphatest"]alphatest[/URL][/B]

[t]https://i.imgur.com/Q488iqe.png[/t]

This makes the material have an alpha of either 0 or 1, instead of a range between those values.
This makes the alpha edges look very hard, but it can fix some transparency related problems.
It can be used to allow alpha in stencils. If you're trying to use a material in a stencil with an alpha channel, use alphatest.
[URL="https://developer.valvesoftware.com/wiki/$translucent#Flickering_and_reversed_depth"]It also allows the flashlight cast shadows from the material[/URL].

[B][URL="https://developer.valvesoftware.com/wiki/MIP_Mapping"]mips[/URL][/B]

[t]https://i.imgur.com/1acVkad.png[/t]

This makes low-res versions of the original texture that it uses as the texture gets smaller.
This can improve performance, and you usually can't tell the difference.
I don't usually use that though, since it probably makes the file size bigger.

[B][URL="https://developer.valvesoftware.com/wiki/Level_Overviews#Creating_the_VTF"]noclamp[/URL][/B]

[t]https://i.imgur.com/zWoKYQJ.png[/t]

This allows the texture to tile, so if you want a repeating pattern then this can help.
It also stops the edges getting stretched to fit, which can make it look smoother.
[img]http://wiki.garrysmod.com/favicon.ico[/img] [url=http://wiki.garrysmod.com/page/surface/DrawTexturedRectUV]surface.DrawTexturedRectUV[/url] will help you draw a pattern.

[B][URL="https://developer.valvesoftware.com/wiki/Valve_Texture_Format#Image_flags"]smooth[/URL][/B]

[t]https://i.imgur.com/Ydpj5Zq.png[/t]

This makes the texture look smoother when you scale it up or down.
It stops point sampling, which makes textures look like Minecraft.

[editline]28th October 2017[/editline]

You don't need to worry about being rude, I was being way more rude about that tiny bit of text on the wiki page. It is pretty hard to notice.

[editline]4th November 2017[/editline]

[URL="https://wiki.garrysmod.com/page/Material_Parameters"]Someone suggested putting this on the wiki, so I did[/URL]. Sorry for the mess.

[Deathking15]

[QUOTE=MPan1;52829551]You don't need to worry about being rude, I was being way more rude about that tiny bit of text on the wiki page. It is pretty hard to notice.[/QUOTE]

I appreciate everything you've posted! This has been extremely informative.

The next step is to try "smooth" as the second parameter and see where that gets me. If that fails to result in a nicer looking image, I may have to just resize the image in photoshop or something and smooth it out that way.

Alternatively, I've been told that if I turn the image into a .vtf, I have more control over the rendering of the image when it's in that format. Does anyone know anything about this?

[Deathking15]

NEXT UPDATE

This one's taken a but longer due to the intricacies of what I needed to do.

Here's what the main Loadout Menu looks like:
[IMG]https://i.imgur.com/zpkftVt.png[/IMG]

Features:
- Important weapon information dynamically updates based on currently attached attachments
- A preview of the weapon's model in-game
- Buttons to quick-change your role (without needing a specific function call/bind) and to cancel out of your selection
- Shop button (functionality coming soon)

To be compared to my previous menu:
[IMG]https://i.imgur.com/bjsM3cB.jpg[/IMG]

I'm in need of help for this one. How can I format and/or border the different options (primary, secondary, equipment) so that it's aesthetically pleasing? I've tried a variety of borders and accent lines and nothing works all that well.

Any input is appreciated!

[Deathking15]

I should clarify I'm [B]not[/B] currently looking for general tips or people's opinion over the new menu (although they are nice).

I'm looking [B]specifically[/B] for tips/advice with regards to the formatting of the weapons and the weapon information. It's currently separated with the Primary on top, with the secondary and equipment on bottom, sharing a 2/3 - 1/3 split vertically, but with no dividers or borders are accent lines. I [I]could[/I] do a simple box around each, but that looks kinda bad.

Just wanted to specify.

[Galaxy]

I know you're no longer really looking for feedback but I recommend lowering your font sizes to make things look less bulky.

[Deathking15]

[QUOTE=GalaxyBeatzz;52836418]I know you're no longer really looking for feedback but I recommend lowering your font sizes to make things look less bulky.[/QUOTE]

Sure, I'm still looking for feedback. What text are you suggesting gets slimmed down?

I was just trying to make a point, earlier, about [I]immediately needing[/I] tips and suggestions strictly about the formatting in the Loadout Menu because I don't know what to do with it next.

[Braindawg]

The information in top like SteamID and Cash seems a little too big, other than that it looks great.

[Deathking15]

[QUOTE=*Braindawg*;52836980]The information in top like SteamID and Cash seems a little too big, other than that it looks great.[/QUOTE]

Hmm, I'm not fully certain what that accomplishes. It's supposed to be a secondary title text. It's supposed to be one of the very first things your attention is drawn to, it's [I]supposed[/I] to be big and bold.

On another note, I've done some simple changes with the drawing and made some borders I'm quite happy with, looking for people's thoughts.
[IMG]https://i.imgur.com/4YHm1lr.png[/IMG]