Roblox UI Visual Design
何时加载
用于 UI 设计或评审时加载。既有样式与美术方向优先。否则从游戏幻想与屏幕任务推导出一套克制的系统。加载 roblox-gui 以获取机制。
快速参考
建立视觉系统
检查现有界面、字体角色、边框、深度、图标、间距与动作颜色。复用一致的令牌。
如果不存在样式，先命名屏幕任务与游戏幻想，再选择颜色、字体或装饰。
定义一小组令牌：背景、表面、浮起表面、文字、弱化文字、强调色、危险色、边框、圆角、间距与字体角色。
根据任务与设备选择密度。HUD、物品栏网格、设置列表与购买提示不应共享同一种拓扑。
仅在游戏或美术方向需要时使用模拟器风格。完整参考保留可选的配方。
核心原则
拓扑：选择单焦点、集合、比较、HUD、列表或其他有依据的形态。不要把所有任务都塞进居中模态框。
层级：一个对象、状态或动作获得最强的对比与缩放。让次要内容安静。
流：每个重复的流只由一个归属者管理：UIListLayout、UIGridLayout 或共享列数学。
密度：围绕有用内容调整整个面板的尺寸。不要拉伸外壳或添加元数据来占满空间。
边界：累加宽度、间隙、内边距、边框与最小值。将描边与背景保持在父级内。
对齐：使用共享布局、固定图标槽与匹配的锚点。
状态：激活、可用、锁定、完成、选中与禁用状态需要颜色以外的表达。
输入：仅在设计存在悬停的地方设计悬停。触摸、手柄焦点、键盘与减少动效需要等效反馈。
验证：检查代表性目标视口的裁切、溢出、死区、字体、层级与焦点顺序。
中性回退
使用一种克制的表面与边框语言、一个展示角色、一个正文角色与一个强调色。让游戏内容、美术与动作重要性塑造身份。优先可读对比与清晰分组，而不是粗轮廓、装饰性深度或类型假设。
反模式
过大外壳、管理布局中的猜测偏移、动作漂移、空白物品框、仅颜色状态、仅鼠标反馈、装饰先于层级，以及在无关美术方向上粘贴熟悉的模拟器皮肤。
风格推断、可选模拟器配方、组合、交互状态与 QA：references/full.md