SuperAPI AI 工具集

roblox-ui-implementation

前端与建站

查看项目

更新于 10-16 01:13

技能介绍

用途:在 Roblox Studio 中实现可读、响应式、触控友好的 UI,并将其连接到真实游戏状态,同时不把有价值决策交给客户端。

设计前置:不要临时发挥做 UI。构建非平凡界面前,先读取已批准的设计简报:design/DESIGN.md(全局调色板、字体层级、间距、模式);design/features/<feature-slug>/design.md(该界面的布局、状态及移动/平板/桌面行为),且必须标注 Status: approved。若简报缺失或仍为草稿,应停止并先运行 roblox-game-ux 生成并批准它(或获得用户明确覆盖)。需构建简报规定的所有状态:默认、空、加载、错误、权限/锁定,而非仅正常路径,并匹配其移动/平板/桌面行为。

架构:UI 构建与状态更新放在客户端控制器;奖励、购买、库存、货币决策放在服务端;共享 UI 常量或格式化辅助放 ReplicatedStorage;用 remotes 请求动作,而不是直接授予价值;UI 变大时分离 HUD、菜单、通知和输入处理。

布局规则:手机优先;有意识地使用 UIScale、约束和锚点;重要按钮远离角落和系统手势区;使用大点击目标和清晰的按下/禁用/加载状态;避免文本在小组件中溢出;保持核心 HUD 可见且不遮挡游戏区。

常见界面:HUD(目标、货币、生命/能量、进度、下一奖励)、升级面板(当前值、下一值、成本、可负担性)、商店(可选报价、清晰收益、不施压首次会话)、奖励(简短庆祝、可见增量、下一目标)、设置(音频、图形/性能、输入偏好)。

MCP 构建流程:用 script_search、script_grep、search_game_tree 定位 UI 脚本与 GUI 实例;用 script_read 读脚本、inspect_instance 检查 GUI;用 multi_edit 改代码或 execute_luau 定向构建 GUI;用 start_stop_play、user_mouse_input、user_keyboard_input、screen_capture 验证;检查 get_console_output。

验证:确认文本适配手机尺寸、按钮有明确外观与状态、UI 不阻挡首个操作、有价值动作经服务端校验、构建界面在移动/平板/桌面匹配已批准简报(含空/加载/错误状态)、无新控制台错误。

后续:用 roblox-mobile-playtest 和 roblox-playtest-qa 验证;若 UI 驱动了新服务端动作,用 roblox-security-economy 审查信任边界;回到 roblox-to-issues / roblox-game-development-lifecycle 下一环节。