Feedback on Art (GUI Buttons, Frames, etc)

[MazinMark]

So I have made lots of art in the past, but I never really got opinions from others telling me how to fix or adjust or what should be removed/added to the art. So my main focus is to get feedback on my art to see how I can improve (hopefully). The first piece of art I made was for Mark IT, a game I’m still working on today. The art didn’t fit in the Game user interface (GUI) correctly and it would always mess up, so I knew some stuff of what to do and what not to do, but my main focus now is to make sure that I cut these mistakes by asking the Roblox Developer Forum for some answers. This, hopefully, will speed up my pace on creating Roblox content because I will know what to do when a problem ever occurs concerning GUI images.

Here is the photo before (I had inspiration from PlaceRebuilder):

Now although this looks fine here, in the studio it has some problems. For example this is the current GUI in MarkIT (you can see loads of mistakes, my apologizes if its blinding):

Now this is the updated image I made to kind of fit a simplistic but sharp look, you can definitely see how I took some pixel art knowledge from the stuff I did in the past (I’ll give an example from a texture I created for another game.):

Example image of what I done in the past similar to atm:

Both Images still have the shading pr had to, this makes a little more detail on the simplicity instead of looking and 2 colors, which in my opinion is not very nice to look at.

Before I end this I also wanted to ask some questions and I’ll try to explain it in the best possible way.
Questions:
1. When making the Art should thier be a blank (non colored) border around the image as long as it’s not too big? for example:

The grey and white dots indicate transparency (in this case 100% transparent).

2. Should I recolor or use the image multiple times? or should I put time in to coloring/Making a new image?
Example: using the same image or the same image just colored differently over and over again.

3. From your experience, whats the best way to make images for the GUI, whether it being just to rely solely on roblox’s GUI customization properties.
Example: Making Art for the game, or basing the art from roblox’s options of GUI’s.

I Hope you were able to read all that, Its my first post and I’m already shivering like I did something wrong. To summarize this topic I have a problem with doing art for roblox, and want to avoid mistakes as much as possible with the help from the roblox developer forums. Sorry If I wasn’t clear enough or I broke a rule, I have uhh many many… things… that make me special.

Ok but in all seriousness If something is wrong about the post inform (But don’t go looking for an answer like punctuation, I mean a rule broken) Not saying because I don’t know most of the rules, its because I might forget one or two, which is human nature. (some studies found that we break four laws on the way home from the grocery store.)

Thank You so much for viewing (and helping out by commenting your ideas/thoughts on this topic, please don’t say what I’m doing wrong without an answer to help it, criticism is nice but I want help too!)

              - Sincerely, MazinMark

[RipperGFX (Ripper)]

1:Border

It depends on the style of UI you’re going for; if its cartoony, then yeah something with that level of depth (i.e. minimal) is fine.

2:Recoloring

This varies depending on whether it looks repetitive having the same shape of UI repeated for the sake of saving effort. I’d go with the safe option and make multiple, different sized and styled versions so there’s a bit of variance in the interface.

3:Creating UI

You can use programs like paint .net or photoshop to create UI, and with the style that you’re going for, you don’t need a particularly complicated or advanced editor, unless you want to add some flare to your designs. If you’re thinking of making more in the future, I would recommend aiming to use those programs to a more thorough extent.

Hope this answers your questions!

A bit of advice on future posts on the forum by the way; try and condense your posts to only the most necessary information, since a lot of this was irrelevant to the questions themselves (not to say you shouldn’t have said it, but just something to consider for ease of reading). For example, the entire first paragraph was more or less unnecessary, even if it adds some background.

[ZednovB (Zednov)]

Sleek, I’d add some more dark outline to the text.

[MazinMark]

Very Nice, I like that I got a solution to a problem that I may encounter in the future (but hopefully will prepare by using what I know). Answer number 3, I didn’t think using big programs would help on the art style either but good job pointing that out. Answer number 2, yes I would take a better more safer root than just recoloring or resizing the image, a clear example is the second image. Answer number 1, yes that is some information I needed, I don’t want to encounter too much problems so that helps a lot! Thank you for reviewing and answering my questions, and thanks for the tip!

         -Sincerely, MazinMark

[chenami]

Looks great. Though, I would recommend removing the border pixel (thin black lines) on the UIs. It will look cleaner.

[MazinMark]

This wasn’t my product I was aiming for, the main focus was to get a better product like the grey box above. This was a representation of the mistakes / past products I had made. At least you noticed the point to remove the border, as that is one of my questions needed for awnsering.