UI Studio
After this page you can design a game screen visually - at the device size you care about, over a real game backdrop - and push the finished layout straight into your place.
Plan: every plan, including Free. Cost: charged by usage, like chat, and you need at least 0.1 credits to start. Changing the style, the device or the backdrop is free. Limits: up to 60 saved designs, and one design imports up to 1400 objects. Needs: Roblox Studio connected, but only for the import step.
UI Studio is not switched on for every account. If there is no UI Studio button in your left rail, it is not available to you yet - use the chat instead, as described in Build UI with AI. Everything below applies once the button is there.
Where it lives
The left rail of the dashboard, second button down, marked with a wand: UI Studio. Opening it replaces the chat with a full design workspace. The back arrow at the top left, Back to navigation, takes you out again.
Two ways to start
From a starter. Twelve designs are ready to open and change: Shop, Gamepasses, HUD, Egg shop, Inventory, Daily rewards, Leaderboard, Level up, Settings, Main menu, Pause menu and Redeem codes. Open the closest one and edit from there - it is almost always faster than starting empty.
From a sentence. The empty state is headed Design a screen. Type what you want and press Design:
a shop screen with four item cards, a coin balance at the top right,
and a big green buy buttonOnce a design exists the button reads Refine, and every message after the first changes what is already on the canvas instead of starting over:
make the cards wider and move the balance to the top leftSeeing it in context
The toolbar across the top is the reason to open UI Studio at all - it shows you the things a static preview cannot.
- Device - Desktop 1920 x 1080, Laptop 1366 x 768, Tablet 1180 x 820, Phone 844 x 390, and Phone in portrait 390 x 844. Flick between desktop and phone before you import anything. A panel that falls off the edge on a phone is the single most common UI bug in a Roblox game.
- Backdrop - put the screen over a real scene: Obby or outdoors, Lobby, Neon arena, Tycoon, Dungeon, Candy world, City, Space station, or no background at all. A menu that looks crisp on grey can vanish over a bright obby.
- Blur - blur the backdrop the way a pause menu would, so you can judge contrast honestly.
- Visual style - eight looks that restyle the whole design in one click: Simulator, Candy, Neon, Slate, Royal, Sunset, Clean and Forest.
Style, device and backdrop changes are free. Try all of them; it costs nothing.
Also along the top: a count of the objects in your design, a Library of everything you have saved, Undo (Ctrl+Z), Redo (Ctrl+Shift+Z), a Properties panel for whatever you have selected, and Save.
Getting the design into your game
Two buttons take a design out of the panel.
Import to Studio is the main one. It compiles your design into a single tree and pushes it into the open place through the Revix plugin. If Studio is not connected the button is disabled and reads Connect Studio to import - open Studio, connect, then press it again. See Plugin Connection.
Send to chat hands the design over to the normal Revix chat instead. That is what you want when the next thing you need is behaviour rather than layout.
When to use it instead of just asking in chat
They are good at different halves of the same job.
| Reach for UI Studio when | Reach for chat when |
|---|---|
| You are still deciding how it should look | You already know what you want |
| You want to try eight styles in a minute | You want the screen wired up and working |
| You need to check phone and desktop | The screen has to react to what a player does |
| You want to see it over a real game scene | It needs to be placed where your game can use it |
The difference that matters: asking in chat gets you the screen and the script that makes the buttons do something, placed where Roblox expects it. UI Studio gets you the layout.
A good order of operations is: settle the look in UI Studio, import it, then switch to chat and say "wire the buy button on this shop up to my coin system".
Practical notes
- Saved designs live in the Library, up to 60 of them.
- A design compiles to at most 1400 objects. A very dense screen can hit that ceiling before it looks finished - split it into two screens.
- Refining costs credits, because Revix is doing real work each time you press it. Restyling, resizing and changing the backdrop do not.