GUI Guidelines

GUI 1

Design

Interfaces should apply basic design principles such as alignment, contrast, and hierarchy. Use simple, visually appealing colors and ensure all text is clear and easy to read for a comfortable user experience. 

Importing

-

Optimization

-

Interaction / Tween Service

-

Other

Imported UI can be UI1 if they do not meet the design requirements. 

GUI 2

Design

Designs may be inspired by other games, but must not be a direct 1:1 replication. Interfaces should maintain consistent padding, margins, and alignment, and apply cohesive color palettes throughout. Use shadows, gradients, or rounded corners where appropriate to enhance depth and polish. Ensure a clear visual hierarchy so that important elements stand out naturally. 

Importing

All interfaces must be created and functional within Roblox Studio, designed to scale properly across all device types and resolutions. Only minimal errors in padding or scaling are acceptable. The UI must not consist of a single imported image; instead, it should be divided into individual components such as buttons, frames, scrolling frames, and other interactive elements to ensure modularity and ease of editing. 

Optimization

Some optimization is present such as using Roblox UI elements instead of imported images when necessary. 

Interaction / Tween Service

-

Other

Requires pictures of explorer showing organization of UI.

GUI 3

Design

Designs must be original and not directly replicated from other games, demonstrating creativity. Interfaces should show excellent layout composition and visual flow, with navigation and logical structure. Maintain consistency in colors, typography, and iconography throughout the UI.

Importing

Imported interfaces must be replicated with at least 99% accuracy within Roblox Studio. Wherever possible, recreate elements natively in Studio and reuse existing image IDs to maintain consistency and efficiency. Visual adjustments should be achieved through properties such as ImageColor3 or elements like UIGradient. Ensure proper anchoring and unnecessary constraints. 

Optimization

Limited image use; reuse images to prevent overuse. Always be mindful of memory optimization. Canvas groups are not optimal, only use when the pros outweigh the performance use.

Interaction / Tween Service

Recommended. 

Other

Requires pictures of explorer showing organization of UI.

GUI 4

Design

Interfaces should form a complete and cohesive UI ecosystem, including panels, buttons, and HUD elements. All buttons must provide clear visual feedback. The visual hierarchy should naturally guide users through the interface, ensuring proper navigation. Overall, the design must be highly polished and visually appealing.

Importing

All UI designs must be highly editable within Roblox Studio, ensuring ease of use and modification for clients. Interfaces should maintain perfect scaling consistency, with no distortion or alignment errors. When applicable, implement image scaling techniques such as tiling or splicing to preserve visual quality and adaptability across different screen sizes. 

Optimization

UI should prioritize optimal loading on all devices. Techniques such as using text buttons instead of image buttons, reusing images, separating UI into multiple ScreenGui, frameworks (fusion, rex, aegis). 

Interaction / Tween Service

Advance level of UI tweening and interaction.

Other

We do not look at your scripts directly, we just want to see them in action. UI Frameworks may be submitted. Requires pictures of explorer showing organization of UI.

Extra Information

Separating UI into multiple ScreenGuis can improve performance; don't overdo it.

Frameworks make it easy to structure games, network, and edit for some clients, while not required or highly recommended it can be used to show advanced knowledge in UI: 

• Aegis 

• Fusion 

• React

• Knit