Agent skill · gamedev-skills

roblox-ui

Build production Roblox interfaces with ScreenGui/PlayerGui lifecycle, responsive UDim2 layouts, safe insets, reusable editable Instances, cross-device input and selection, restrained motion, cleanup, and multi-viewport verification. Use for Roblox HUDs, inventories, shops, settings, ability bars, ScrollingFrames, AutomaticSize, GuiService, gamepad focus, touch UI, or UI that clips, resets on respawn, looks generic, or was generated as one giant LocalScript.

What it needs

About 6k tokens when loaded.

What this skill does

Roblox UI Implement deliberate, editable Roblox UI that preserves the experience's visual language and works across supported devices. Targets Roblox's rolling platform APIs. Pair with game-ui-ux for engine-neutral information architecture and UX; this skill owns Roblox Instances and APIs. When to use Use for authored ScreenGui interfaces, Roblox layout/constraint APIs, UI lifecycle, input, focus, animation, performance, or responsive/device fixes. Use to replace brittle pixel layouts, runtime-created Instance tangles, mouse-only menus, or generic generated styling with a maintainable hierarchy. When not to use: general UX flow and accessibility principles belong to game-ui-ux; raw gameplay action mapping belongs to input-systems; server trust belongs to roblox-networking. Workflow 1. Inspect before designing. In Explorer, inventory existing ScreenGuis, UI modules, fonts, colors, icon family, spacing, corners, strokes, animation timing, naming, and reusable components. Capture representative screenshots at two viewports. Extend that language. 2. Define ownership and lifecycle. StarterGui is the authored template; Roblox clones it into each player's PlayerGui. Decide whether each ScreenGui should persist across respawn with ResetOnSpawn = false; never keep stale references to a destroyed clone. 3. Author a readable hierarchy. Prefer meaningful editable Instances and small behavior modules. A normal screen should be understandable in Explorer; procedural generation is for genuinely data-driven repetition, not the whole shell. 4. Build responsive structure. Combine UDim2 scale for placement with bounded offsets, correct AnchorPoints, layouts, padding, content sizing, and constraints. Choose explicit narrow/wide arrangements instead of shrinking a desktop panel until it technically fits. 5. Handle platform obstructions. Keep interactive UI in CoreUISafeInsets (the recommended ScreenGui.ScreenInsets default), and account for touch controls and TV distance/overscan. 6. …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills gamedev-skills/roblox-ui

View the source on GitHub

Browse the @skills marketplace