roblox-gui — скилл для Claude Code: что делает и как установить
Набор правил для вёрстки интерфейсов в Roblox. Помогает адаптировать HUD и магазины под смартфоны и консоли.
npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a claude-codeЧто делает roblox-gui
Скилл задаёт правила адаптивной вёрстки интерфейсов Roblox в среде Claude Code и других агентах. Проектирование строится по принципу mobile first: сначала разметка тестируется на компактном смартфоне с сенсорным управлением, затем переносится на планшеты. Правила требуют резервировать системные зоны вроде CoreUISafeInsets и экранного джойстика. Если элементы накладываются друг на друга, скилл предписывает менять компоновку, а не сжимать текст.
На консолях учитывается TV-safe area и параметры ViewportDisplaySize. Для геймпадов прописано чёткое управление фокусом: один владелец SelectedObject, границы в SelectionGroup и послойная обработка кнопки «Назад». Сервер остаётся единственным авторитетом для состояния игры, поэтому кнопка клиента не может напрямую решать исход действия. Это критичный рубеж для защиты сетевой логики.
При работе с реактивным интерфейсом скилл требует освобождать ресурсы экрана при закрытии и проверять утечки памяти повторным открытием окон. Стартовые экраны загрузки размещаются в ReplicatedFirst.
Какие задачи решает
- адаптировать разметку Roblox под сенсорные экраны телефонов
- настроить навигацию геймпада через SelectionGroup и SelectedObject
- устранить наложение элементов HUD на системный джойстик и чат
- предотвратить утечки памяти при повторном открытии реактивных меню
Примеры запросов агенту
- Проверь разметку меню магазина на экранах мобильных устройств в Roblox
- Настрой навигацию с геймпада для окна инвентаря через SelectionGroup
- Сделай экран загрузки в ReplicatedFirst с учётом CoreUISafeInsets
Как установить roblox-gui
1Через Skills CLI (Vercel)
npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a claude-code2Вручную: положить файлы
~/.claude/skills/roblox-gui/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/roblox-gui/
1Через Skills CLI (Vercel)
npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a codex2Вручную: положить файлы
.agents/skills/roblox-gui/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a cursor2Вручную: положить файлы
.cursor/skills/roblox-gui/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install TabooHarmony/roblox-brain roblox-gui2Вручную: положить файлы
.github/skills/roblox-gui/SKILL.md1Через Skills CLI (Vercel)
npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a gemini-cli2Командой платформы
gemini skills install https://github.com/TabooHarmony/roblox-brain --path skills/gameplay/roblox-guiВручную: положить файлы
.devin/skills/roblox-gui/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о roblox-gui
Как установить roblox-gui в Claude Code?
Выполните команду npx skills add TabooHarmony/roblox-brain --skill roblox-gui -a claude-code.
Что делает roblox-gui?
Скилл передаёт агенту правила адаптации интерфейсов Roblox под мобильные экраны и геймпады. Он помогает избежать перекрытия системных кнопок и утечек памяти в меню.
Как скилл настраивает управление с геймпада?
Он предписывает задавать границы навигации через SelectionGroup, назначать ровно одного владельца для SelectedObject и послойно обрабатывать кнопку отмены.
Исходный текст
SKILL.md · MIT
--- name: roblox-gui description: "Use when building or fixing Roblox menus, HUDs, shops, dialogs, or UI that must work on phones, tablets, desktop and console." when_to_use: "Also when changing or reviewing any UI, or when UI overlaps, is cut off, too small, misplaced or unreadable on mobile, a phone, tablet, TV or with a controller." last_reviewed: 2026-10-14 sources: - https://create.roblox.com/docs/ui - https://create.roblox.com/docs/ui/position-and-size - https://create.roblox.com/docs/ui/styling - https://create.roblox.com/docs/ui/list-flex-layouts - https://create.roblox.com/docs/input - https://create.roblox.com/docs/input/mobile - https://create.roblox.com/docs/production/publishing/console-guidelines - https://create.roblox.com/docs/studio/device-simulator - https://create.roblox.com/docs/reference/engine/classes/GuiService - https://create.roblox.com/docs/reference/engine/classes/ScreenGui - https://create.roblox.com/docs/projects/server-authority - https://create.roblox.com/docs/input/input-action-system - https://create.roblox.com/docs/reference/engine/classes/ReplicatedFirst - https://create.roblox.com/docs/reference/engine/classes/ContentProvider - https://create.roblox.com/docs/reference/engine/classes/UIPageLayout - https://create.roblox.com/docs/reference/engine/classes/SelectionBox - https://create.roblox.com/docs/reference/engine/classes/Decal - https://create.roblox.com/docs/reference/engine/classes/VideoPlayer - https://raw.githubusercontent.com/Roblox/focus-navigation/main/README.md - https://devforum.roblox.com/t/introducing-improvements-to-directional-ui-selection-on-gamepad/3864317 - https://devforum.roblox.com/t/what-are-the-best-ui-screeninset-settings-for-buttons/3519333 - https://devforum.roblox.com/t/screenguiscreeninsets-topbarinsets-regression/4047230 - https://raw.githubusercontent.com/Roblox/react-luau/main/README.md - https://raw.githubusercontent.com/dphfox/Fusion/main/README.md - https://raw.githubusercontent.com/centau/vide/main/README.md - https://raw.githubusercontent.com/ffrostfall/fluid/main/README.md - original --- # roblox gui ## When to Load HUDs, menus, shops, dialogs, world UI, and layout bugs on phone, tablet, desktop or TV. ## Quick Reference - Mobile first: design on the smallest landscape phone with touch controls, then grow (full.md §11). - Reserve top bar, thumbstick, jump, chat; interactive UI in `CoreUISafeInsets`; place by measured `AbsolutePosition`/`AbsoluteSize`. - Check every element pair that can show together; reflow, don't shrink. - Gamepad: one `SelectedObject` owner, `SelectionGroup` bounds, restored focus, layered Back (§8). - Console: TV-safe area, `ViewportDisplaySize`, no chat window. - Layouts own repeated layout; UI shows server state; a button is not an authority boundary. - Reactive UI: per-screen cleanup; repeat open/close to test leaks. Loading UI in `ReplicatedFirst`. - TextBox submit, grids, truncation, RichText safety, deprecated APIs: full.md. > Details: [references/full.md](references/full.md)
© TabooHarmony · MIT · TabooHarmony/roblox-brain
