How would I go about creating this UI?

Hi all, I’m not sure the best way of going about this UI design idea I have. But first here are the things I need to happen with it:

  • It needs to not change size/squish the image
  • Needs to scale nicely across all platforms

So here is the design:


It has these images for the corners that I don’t want the size being anything else than a square to keep them like that. It would also be handy for them to stay the same size no matter the size of the parent frame so it’s like a template.

Thanks.

I think it has something to do with turning offset off

You could possibly create a squared image that is L-shaped. Have four duplicates of them with different rotations in all corners. Make sure you align them properly by using AnchorPoint and Scale(or Offset) in UDim2.

Alright, but I’m not all that sure how to use AnchorPoint.

To explain what AnchorPoint is, there’s an article about it.


Furthermore, you can have a fixed scale size on them, so they are perfectly squared. Use this object along with it: UIAspectRatioConstraint | Documentation - Roblox Creator Hub

2 Likes