UI Overlay Visualization Tool

Resources Community Resources
1

As a UI designer I find it rather annoying when Roblox’s UI overlaps my own, so I decided to recreate Roblox’s UI layout as a visualization tool. This contains only the most commonly used core GUIs, so it will be easier for UI designers to account for and design around them, as well as maintain a consistent design. It’s quite simple as anyone can make it, though I’m providing it here so you won’t have to go through the trouble of making it yourself.
The idea for this came from this: Show off your UI designs - #2210 by InsanityFE4R

Edit: Do note some of these (such as the Leaderboard, Chat, and Backpack) do not match the sizes for all devices, as it’s primarily for a 1080x1920 resolution screen.

image
image1920×1080 53.4 KB

Enjoy!
UI_OVERLAY.rbxm (5.1 KB)

LAST UPDATED 9/30/25

14 Likes
2

This is cool, you should make mobile version too :slight_smile:

3

ill think about it since there’s a lot of devices and the sizes all vary depending on the device’s resolution, i’d probably have to look into some of the… mathematics roblox used to scale them