Managing GUI sizing across devices

Note: I’m using scale already, this is not a question on how to scale across devices, but what would be best for users.

I’ve created a GUI that scales and looks okay on PC, and is the same size on mobile however on PC I’m keeping GUI small for the sake of reducing visual clutter and keeping it as out of the way as possible, and this is okay because using a mouse is super easy even on small buttons and everything is suitably big to read on a monitor. However this introduces the issue where buttons are too small on small screens, and some text becomes more difficult to read.

What is the best way to approach fixing this? I’ve thought about creating a GUI for pc, and a GUI for mobile with larger buttons and text, then just switching them out, but this could introduce the problem where if you’re on a tablet or some mobile device with a bigger screen the GUI would be too big. Therefore I’m unsure this would be the best route, any advice?

You can create 2 guis
1 for pc and others for mobile

and then just switch if the user is on pc or mobile (detect that using user input service, and see if touchscreen is enabled or not)

1 Like

You can make 2 seperate guis and use and check what size the screen is and use that to put in what gui you would want to use depending on the screen size ^ better than above because that method is buggy sometimes.

workspace.CurrentCamera.ViewportSize
2 Likes