Need some advice from other UI Designers. I’m not sure if I should use scale for all my UI. Scale seems to make UI more stretched on certain monitors which is why I prefer offset. I’ve looked for guides on the DevForums and I see some people saying to always use Scale while other people, one being from a Top Contributor saying to mostly use Offset to stay consistent.
Here’s a example of one of my recent designs that was published to a semi large game and what it looks like on my monitor (1920x1080). People are complaining about how its too crowded on their smaller monitors (1280x720)
You are already off track by trying to decide between them. You use both.
You can’t use just offset and expect your UI to magically not get cut off or be in wonky position/size proportions in relation to the screen size.
The link you provided where the user only uses offset, that was specifically for size. But it really doesn’t make sense for the size of a UI object to stay the same size across the board when the screen is getting bigger or smaller. What happens when you move up to a 4K screen from 1080p? The UI will be way too small!
If you know a scenario in which you know the exact pixel count an object needs to be adjusted by then you can use offset. This is usually in relation to the size of other UI objects.
How is your UI structured? Whats your Relative property set to? Are you using ratio constraints/other UI objects?
All of these will affect how your UI scales.
Yep, I agree. I guess I didn’t write that section of my guide properly as Offset sucks on its own.
I find using Offset for sizes of (visible) elements is pretty useful. This is because it guarantees aspect ratio and image quality – however like you said it doesn’t scale well on larger/smaller monitors. I’ve yet to try using scale majorly in my designs for sizes (but I will be doing it ASAP) but I’m thinking it might be used more by myself in the future. I’ve noticed that UIAspectRatio constraints really suck to use (they don’t work for reasons that don’t make sense, and their documentation is a joke) which is what is holding me back in that area right now.
Personally I’m still trying to find a good way to do things – because not only do screen resolutions change, but also screen DPI and viewing distance. To get the ‘perfect UI’ you’d need to scale procedurally based on all of three of those variables, which is also somewhat impossible in Roblox for the latter two.
I don’t like scale due to the stretchy look it gives to UI especially if designed on a wide screen going to a boxier monitor, or a boxy monitor to a wide screen. It also limits some of the UI effects I can do. The main problem I don’t like is that text cannot be uniformly scaled across multiple instances, such as assuming the smallest FontSize out of a group of TextLabels or TextBoxes which requires TextSize to either be set to a specific size that won’t match all resolutions or be scaled small and large on the same UI.
Yeah, I wish there was a way to force a scaled value which will then be uniformly applied to everything. Leading on the from that, that also means we can’t scale sizes (of the container of a text label with TextBounds, for example) of scaled objects due to how TextScaled behaves.
I use offset + a UIScale modifier to scale depending on platform. If on mobile/low res screen then set the UIScale to 0.5 and if on console then set the scale to 2
