Do you wish it was possible to preview any UI, regardless of what folder it’s in?
Are your StarterGui’s ScreenGuis getting in the way of development?
Well do I have the plugin for you!
Introducing UI Previewer, a plugin that allows you to preview UI elements in a plugin widget
Description
Select an element to preview by clicking the Selection button, and selecting a valid GUIObject. You should see a clone of this element¹ and its children in the Plugin widget
All changes you make to your UI elements should be reflected in the preview window
To clear the selection, press the button next to the name of the top level element.
To make a new selection, click the Selection button again and select a new one, much like how you would set an adornee.
Hot off the press Get your UI Previewer here
Please report any bugs you find² in the thread, or in a DM!
If you have any feature requests or other feedback, please share in the comments
Testimonials
“This plugin feels illegal to use, it’s that good I love how it allows you to isolate components and preview ratios!” - @Wsly
“It’s pretty dope” - @aaron_mccoy
“Wait what is this quote for” and “An absolute UNIT of a plugin” - @Dev_Anthony
“holy macaroni it’s something I’m probably actually going to use” - @PeZsmistic
¹ If you select a LayerCollector, this element is not cloned. The plugin’s ScreenGui takes on some of the properties of it, and the plugin should handle any new children and also if the element is deleted. ² There are definitely bugs, and I really appreciate any bug reports! UI is complicated and peoples behaviors are all different. The plugin is forgiving though, so if anything ever gets out of sync, just re-select the current element and things should look better.
This should honestly be a part of Roblox Studio! It’s kind of annoying when I have to keep re-enabling it’s visibility to see how the UI looks. This will make things a lot easier.
Really sick for making changes to UI when the organizational scheme for UI management keeps StarterGui clear. This is a great plugin that opens the door for more ways of approaching the developer experience by eliminating barriers fundamental to the basic set-up of Studio. This is awesome!
Just tested, the resolution display is a really neat feature as well!
In a literal sense, nothing, but here’s some reasons why that might not be optimal
If you keep all your UI in StarterGui, but keep some enabled and some disabled, you might forget to disable a UI that you enabled for testing/visualization purposes
If you don’t keep your UI in StarterGui, you have to physically move UI over to StarterGui to visualize/test - which is extremely tedious for making small visual tweaks (like adjusting size and trying to make sure the flow isn’t weird post-change). An example of this
If you want to view/make edits to the obscured UI, something like this is very helpful (for the same reasons as points 1-2)
Ex: obscured UI when using this plugin
That’s not to say this plugin is essential for all developers - it’s not necessarily. If you create all your UI via code, then this obviously has 0 practical usage. However, there are lots of reasons for a developer to want to use this.
Hello @BitwiseAndrea , nice plugin you got there, but speaking of folders, can you fix this annoying glitch of which you can’t move gui objects in a folder? (Not in plugin) if you do, thanks.
Got it! Funny enough, thats how i had the original implementation But I found it to be less useful to me when working on a large system. I could add a “lock” or “unlock” button that makes the preview update with any new GUI selected, does that support your use case?