Deft
Ask AI

Search

Search skills, authors and topics

oil-oil / oil-ui

oil-ui

Design, improve, and review interfaces for websites, apps, dashboards, and components: explore directions, generate side-by-side comparisons, and refine visual hierarchy against real screenshots. Delivers a comparison page, design notes, a comp, or a working interface when asked. Design judgment only. Hand off to oil-ui-pro when that skill is installed.

Install

npx skills add https://github.com/oil-oil/oil-ui --skill oil-ui

游玩与强手感操控

小游戏、抽奖、扭蛋、计时养成,以及旋钮、拉杆、摇杆这类强手感操控,过程本身就是产品:用户来看转轮减速、硬币被推下、娃娃差点滑落。这类界面先读本文,其余规范照常适用。

先盘点特有对象与状态

先填对象与状态表,再选参考、出概念或画灰度结构。只列页面、按钮和通用资源不算完成:

特有对象用户怎样辨认主动作怎样改变它必须有的状态状态的可见反馈素材与渲染成本

对象覆盖用户在这个玩法里真正操控、生成、消耗和结算的东西;状态按核心循环列出开始、可操作、输入或演出、锁定、结算、失败与恢复,玩法没有的状态删掉,实际存在的特有状态补上。每个对象和状态都要能在画面里辨认,不能用同一张静态图配不同文字充数。

再写一条 主动作 → 特有对象变化 → 可见反馈 → 下一次操作或结算 的核心循环,标出每屏唯一主角和唯一主动作。写清主视口的输入方式和反馈位置;触摸与指针的操作确有差异时再分别写,不重复两套相同说明。对象或状态缺项、核心循环走不通、输入或反馈无法执行时,退回盘点,不进入素材制作和灰度结构。

过程即玩法

  • 演出可以比普通界面切换长,例如三个转轮依次停下共 2 秒左右,不按“超过 500ms 就会让人等”截短。
  • 扣了费、出了结果就先存好:刷新不丢,不重复扣,奖励只结算一次。在哪一刻存,按玩法定。
  • 演出期间写清哪些操作锁住;连按不能重复扣费。
  • 旋钮、拉杆这类手势从按下的位置开始跟手,过了生效点才算一次,没到就松手不扣。
  • 减少动态效果时,玩法照常算出结果,只是画面直接到位;不能把玩法本身停住。
  • 状态与变化用序列图看;正常速度下的手感通过直接操作判断:减速是否连续、停下时有没有顿挫、收益从哪里飞到哪里。录屏只按 工具 [blocked] 的条件取用,不能仅凭序列图宣称手感已验证。

素材与渲染

  • 对象与状态表完成后,把需要制作的项转成素材清单。角色、藏品、道具、符号和材质贴图是这类界面的主角,默认用生图做。手写 SVG 和 CSS 只画界面图标和简单图形,拿它们画角色和道具,会落到图标包的质感。成套出图的做法见 素材 [blocked] 的“成套素材”,素材来源也按同一份文件的顺序选择;都无法生成时,按该文件交素材简报,不拿手画的图形冒充成品。
  • 乐趣来自空间和物理时,用实时 3D 渲染场景,例如堆叠、碰撞、推挤、摆动,或透明、金属材质;生成的图当贴图和精灵用,做法见 素材 [blocked] 的“实时 3D”。树木生长、天气这类自然变化,用成套生成图通常更好。
  • 素材放进场景后再看一次:受光和场景一致,有接触阴影,侧面、背面和翻落时不露出纸片的边。图生成了,不等于放进场景就可信。