Best way to build an Image based GUI with interact-able elements without ruining the quality?

My artist draws GUI elements for me to import into my game and my job is to put it together.
If my artist has each element automatically where it needs to be for the in the image, I can very easily import them by setting the Size to {1, 0},{1, 0} and changing the ScaleType to Fit.

Here’s an example:
noFilter (2)
Background:
noFilter3

When making these both scale size (1, 1) and changing the ScaleType to Fit, they look great on all screen resolutions, but this makes it impossible to interact with workspace click detectors and I don’t know how I would go about making the lock click-able.

What would be the best way to build an Image based GUI with interact-able elements without ruining the quality?

You can try manipulating the “Active” and “Interactable” property of the GUI elements.

Here’s what the 2 properties do:

  • Active - Checks if any workspace element behind the GUI can be interacted with.
  • Interactable - Checks if any GUI behind the GUI can be interacted with.