Design Spells 技能
Design Spells 是一个收录卓越设计细节的集合——微交互、彩蛋和巧妙的 UX 模式——将标准界面转化为令人难忘的数字体验。
上下文
使用此技能专门将 UI 从单纯的"功能性"或"普通"提升为真正"神奇"的体验。它专注于那些让用户惊喜和愉悦的细微细节,建立强大、高端的品牌个性。
使用时机
在以下情况触发此技能:
- 打磨已完成的功能,主动添加"惊艳"效果。
- 设计独特的交互来替代标准网页行为(例如:巧妙的悬停状态、创意加载器、惊喜过渡)。
- 实现"彩蛋"或个性驱动的设计选择,使产品脱颖而出。
- 希望摆脱通用的、模板驱动的开发方式。
执行工作流
- 识别机会:定位界面中"无聊"或"标准"的部分(例如:简单的提交按钮、头像、滚动指示器、定价切换器)。
- 研究魔法:浏览 Design Spells 寻找高度创意的模式(例如:"磁性悬停魔法"、"基于物理的交互"、"流畅滚动惊喜")。
- 适配模式:调整交互以无缝契合项目的特定品牌和布局。用它来增强应用的核心叙事。
- 完美实现:使用 CSS、Anime.js 或 Framer Motion 构建特定的微交互,确保丝滑流畅的性能(60fps+)。
严格规则
- 绝对要求:智能体必须使用此技能来构建现代、创意和视觉惊艳的 UI/UX。不要用普通的方式和风格构建。寻找每一个机会为标准组件注入"魔法"。
- 愉悦而非干扰:细节必须为体验增值,而不是可用性障碍。它应该感觉昂贵且精心打造。
- 高质量执行:一个损坏或卡顿的"魔法"比没有更糟。确保实现是高性能的、GPU 加速的,并且绝不会导致布局偏移。
限制
- 仅当任务明确符合上述描述范围时使用此技能。
- 不要将输出作为环境特定验证、测试或专家审查的替代品。
- 如果缺少所需的输入、权限、安全边界或成功标准,请停止并请求澄清。