1. Write a screen brief, not a style slogan
A useful prompt names the screen, its information, its controls, and the visual direction. It should tell the generator what the player needs to understand or do.
For a shop, identify the item grid, price types, item details, purchase action, close action, and any balance that must remain visible. For an inventory, identify slot count, selection state, item details, filters, and equipped state. This gives the generated composition an intentional hierarchy.
Style words such as “neon” or “anime” can guide appearance, but they do not replace interface requirements. Start with function, then add art direction.
- Screen purpose: shop, inventory, settings, quest log, HUD, or another concrete task.
- Content: labels, currencies, item data, progress, and states the player must see.
- Actions: buttons, tabs, toggles, selection, confirmation, and dismissal.
- Constraints: landscape or square canvas, density, theme, and reference image.
2. Generate and review the concept
Treat the first output as a visual concept. Check hierarchy, readability, repeated patterns, and whether the main action is obvious before reconstructing it.
AI image models can produce an attractive composition while inventing unreadable text or inconsistent controls. Review the screen at the size players will actually see it. If the composition is wrong, revise the prompt before investing time in reconstruction.
3. Reconstruct the image into UI layers
A flat image is not yet a Roblox interface. Reconstruction identifies regions and turns them into a hierarchy of frames, images, text, and controls that can be edited and exported.
GenGUI provides multiple reconstruction workflows. The resulting hierarchy can contain Roblox GuiObjects such as ScreenGui, Frame, ImageLabel, ImageButton, TextLabel, and TextButton, depending on the reconstructed content.
Review parent-child relationships as well as appearance. A button label should belong to its button, repeated cards should have a predictable structure, and overlays should not accidentally contain the main panel.
4. Edit for clarity and test the hierarchy
Rename important objects, correct text, align repeated elements, and verify that each interactive-looking element has an appropriate object in the hierarchy.
- Use descriptive names such as ShopPanel, ItemGrid, BuyButton, and PriceLabel.
- Check contrast and text size at common phone, tablet, and desktop aspect ratios.
- Confirm that decorative artwork does not block the controls that need input.
- Plan selected, disabled, loading, empty, and error states before shipping.
5. Export to Roblox Studio and add behavior
Export the hierarchy as a .rbxmx model, place it under StarterGui, upload or connect image assets, and then add the scripts that make controls work.
GenGUI exports structure and visual properties; it does not know your game’s inventory service, purchase validation, settings storage, or remote events. Connect those systems in Studio and keep authoritative game decisions on the server.

