I just started learning UI and I’m working on a currency UI for my game, but I don’t really know if this fits the theme of a simulator game. Can you please give feedback on how I could make it better?
You can use UiGradient, UiStroke elements on the frame and text for more effect if you would like. If you have the time and expertise, learning how to use a photo editing software like Photoshop, Clipart, or Photopea can help with making a better looking GUI.
Heres a series someone made on making certain types of gui.
Contains around 103 videos of different style GUI’s, such as anime designs, simulator designs, FPS designs and more.
If you would like to follow through, I would suggest using https://www.photopea.com/ if you don’t have the other software’s as its free to use. Not that you need these editing software’s to begin with, as you can make a perfectly decent GUI with the ROBLOX engine itself.
For designs in backgrounds, I use 18,000+ Background Pattern Pictures. Though I should note that I pay for it to not source the content and get more photos to use.
If you are wanting to get a reference on what good GUI looks like, go visit some popular games that you’re making yours around and see how they made theirs, and use that as inspiration (not copying their mojo).
Finally, learning how to tween GUI elements on events can add that extra bit of life into your GUI elements. Take for example this menu I’m making on my own, and how I used certain aspects of the TweenService to my advantage!
With TweenService, you can edit multiple aspects of an GUI element when played.
-- How to format a TS:Create()
local GUI = script.Parent -- Change this to the GUI element you would like to tween.
local tweenInfo = TweenInfo.new(
1, -- Time for Tween
Enum.EasingStyle.Sine, -- The style the GUI element will move with.
Enum.EasingDirection.Out -- The way the GUI element will move.
)
local properties = { -- Enter in the desired properties of the GUI you would like to edit.
--[[Position = UDim2.new(0,0,-.3,0),
BackgroundTransparency = 0,
etc,etc...]]
}
local properties2 = { -- Enter in the current properties of the GUI you are editing.
--[[Position = UDim2.new(0,0,0,0),
BackgroundTransparency = 1,
etc,etc...]]
}
-- properties will hold the elements of the GUI we would like to edit on tween.
-- properties2 will hold the current status of the elements on the GUI we would like to edit on tween.
local tween = game:GetService("TweenService"):Create(GUI,tweenInfo,properties)
local tween2 = game:GetService("TweenService"):Create(GUI,tweenInfo,properties2)
--For example, lets say that local GUI was a textButton. We will make tween play on GUI Mouseclick...
GUI.MouseButton1Click:Connect(function()
tween:Play()
task.wait(1)
tween2:Play()
end)
-- On mouse press, the GUI element will go down -.3 with the SineStyle Out. After 1 second has passed, it will move back to its original position and rest until button is pressed again.
More EasingStyles can be found with this link here. https://create.roblox.com/docs/en-us/reference/engine/enums/EasingStyle
Please let me know if there’s anything else you would like to know, thanks!
Also I think I just missed the whole point of this post, sorry about that
How much time did that take for you to type?
Not long, nothing to worry about.
Also, you mentioned everything in the post, except for a high-quality vector asset pack that’s actually free
looks great, I dont see alot of things to improve further here (im not a ui designer in more casual games) But, It looks good enough.
Yeah that I’m not too sure about, I use shutterstock but thats something you have to pay for