How to fix this common gui issue?

hello everyone, I am trying to make an ending screen gui:


and it looks good like this, but when i make the screen smaller or larger the ending screen changes:

I know this is a common issue, but I was wondering if any of you smart people know how i would be able to fix this

1 Like

Make sure you’re using Normalized Device Coordinates.
In the size and position properties of your GuiObjects, Make sure you have the offset on 0, and the scale 0-1.
The offset is in pixels, while the scale is based on the screen’s size.
To easily convert your UI to Scale, use a UI scaler plugin such as: AutoScale
image

1 Like

i did everything except for normalized device coords, how do i do that? also it still is giving the same issue

1 Like

can i see the sizes and positions?

1 Like

Are you using any sort of ui constraint?

1 Like

sorry for the late response:
these are the sizes and positions
Screenshot 2024-06-21 144928
Screenshot 2024-06-21 144950
Screenshot 2024-06-21 145012
Screenshot 2024-06-21 145030

no, i’m not

Use scale instead of offset. Plugins like AutoScale Lite or UI Tools can help with converting from offset to scale.

Also use constraints, I believe AutoScale Lite helps you with that, not entirely sure though.

how exactly would i use constraints? and what do you mean by “use scale instead of offset”?

I made a video on how to do it

not sure if its gonna be sent though

so if I do that then instead of the gui getting spread apart like so:


it will look good no matter how i change my screen?

because it didn’t…

do them one by one not all together that could cause problems

just found a video on how to do it manually