Impeccabledelight指南为界面注入产品个性、打造值得记忆的时刻【免费下载链接】impeccableThe design language that makes your AI harness better at design.项目地址: https://gitcode.com/GitHub_Trending/im/impeccable本指南以 impeccable 技能体系中的 delight 参考文档delight命令的核心操作手册为主体结合仓库中 SKILL.src.md、animate.md、polish.md 与 DESIGN.md 等源码与配置证据展开。读完你将掌握如何判断一个界面值得哪些愉悦时刻、如何写出单句 delight thesis、如何为成功/等待/空状态/错误恢复等情绪节点设计方案以及如何用一条保护清单防止个性变成干扰。这套方法适用于你使用 impeccable 处理前端界面时的一切让它更有趣、更有个性、更令人难忘的诉求。Impeccable 的核心定位是 The design language that makes your AI harness better at design其技能体系把界面工作划分为 Build / Evaluate / Refine / Enhance / Fix / Iterate 六类命令其中delight归属于Enhance增强类别。在技能命令总表中它的定位是一句话Add personality and memorable touches添加个性与令人难忘的细节。delight.md这份参考文档则回答了更深一层的问题什么时候应该加个性、加在哪个时刻、用什么原则来保证它不伤害可用性。在开始成文前需要先交代本文所依据的文档结构。delight.md以一条元信息开头Additional context needed: the brands emotional range.这是 impeccable 参考文档体系的固定开场animate.md、adapt.md、clarify.md 等都有同类条目只是各自索取的上下文不同。它意味着在执行delight任务前操作者必须额外获取品牌的情绪区间the brands emotional range这一上下文——即这个产品能允许、且应该呈现出多大范围的情感表达。这是整个 delight 工作的前提脱离品牌情绪区间去发挥个性等于脱离产品世界去堆砌装饰。在 command-metadata.json 中该命令被进一步展开为供 Agent 判断调用意图的说明Add moments of joy, personality, and unexpected touches that make interfaces memorable and enjoyable to use.Elevates functional to delightful.Use when the user asks to add polish, personality, animations, micro-interactions, delight, or make an interface feel fun or memorable.也就是说当用户提出让界面更有趣/更有个性/更令人难忘/加一点微交互与愉悦感时Agent 应路由到 delight.md 并按本文档的方法执行。总纲Delight 不是一层面具delight.md开篇给出了一条必须贯穿全程的定义它同时是能做什么和不能做什么的边界Delight is not a layer of generic whimsy; it is product character revealed through a useful interaction, a humane response, or an unexpectedly considered detail.Delight 不是一层通用的俏皮装饰它是通过一次有用的交互、一个有人情味的回应、或一个出人意料却经过考量的细节所显露出来的产品性格。这句话隐含了三个判断标准必须挣来的moments that earn it只有值得记住的时刻才值得被设计成 memorable必须产品化的个性来源于产品机制与视觉世界而非一套可以套在任何产品上的库存套路必须有用的一个愉悦时刻至少要承担一次交互、一种回应或一个细节的功能。这条定义与仓库中 SKILL.src.md 反复强调的原则一致Go all out. No hedging 与 the brief wins 并不矛盾——delight 要求大胆但大胆必须锚定在品牌与产品的既定世界上而不是脱离 brief 去炫技。第一步按访问者模式决定个性浓度delight 首先不是无差别加戏而是先要回答这个表面属于哪种访问者模式。文档给出两种典型的个性浓度分派Persuade Experience说服 体验型表面个性可以贯穿 voice文案语调、composition构图、motion动效与 discovery发现感前提是作品本身始终是焦点——说服型页面的主角是产品/服务体验型页面的主角是内容本身界面必须退后。Operate Read操作 阅读型表面把 delight集中在有意义的时刻例如首次使用、任务完成、错误恢复、掌握熟练之时其余一切由可靠性reliability兜底。工具界面、仪表盘、编辑器、文档站里扫描性、一致性、原生预期与真实使用场景的优先级高于表达。关于访问者模式的更完整定义可参见 SKILL.src.md 的 Modes 一节——它把表面划分为 Persuade访问者做决定并行动设计即产品、Operate访问者完成任务、Read访问者理解内容、Experience访问者置身作品内部四类并强调模式由请求的表面而非整个产品决定一个工具类产品的落地页仍是 Persuade一个时尚品牌的文档仍是 Read。第二步寻找真正值得愉悦的机会点在没有机会的地方强造惊喜是 delight 最常见的失败方式。文档要求先检查目标本身、DESIGN.md既定视觉世界、产品 voice、重复使用频率、情绪上下文然后专门寻找以下六类机会值得被认可的努力effort worth acknowledging用户付出了真实成本例如一次复杂配置的完成可以变成有信息量的等待waiting that can become informative加载是客观存在的关键是如何让等待不说废话可以承担指引方向功能的空状态或首次使用态an empty or first-use state that can orient新用户第一眼需要被引导需要共情的错误或恢复时刻an error or recovery moment that needs empathy出问题时用户正处于低情绪点其物理或语言反馈能表达品牌的交互an interaction whose physical or verbal response could express the brand如开关、滑块、按钮反馈这类产品可以说一句话的地方值得被用户发现的实用能力a useful capability people might enjoy discovering把真实功能藏在可被好奇发现的入口里。配套红线不要为一次普通点击制造庆祝Do not manufacture a celebration for an ordinary click。只有当品牌的情绪区间或利害关系stakes无法从上下文推断时才需要向用户提问。第三步定义单条 delight thesis愉悦命题与其散点式加彩蛋文档要求收敛为一句话的愉悦命题State in one sentence what the user should feel and why that feeling belongs to this product.即一句话说清用户应该感到什么 这种感觉为什么属于这个产品。命题成立后再选择能承载它的最小系统the smallest system。文档给出五条可选的最小载体对某个有意义动作给出一个有辨识度的响应使用产品专属语言——既澄清信息、又承载 voice 的文案一个具有可识别材质行为的交互或转场material behavior一个扎根于产品世界的插画、声音、触觉或环境细节一个揭示真实实用价值的发现奖励discovery reward that reveals real utility。硬性约束treatment 必须源自产品机制与视觉世界而不是来自素材库存目录a stock catalog。若脱离产品世界再精巧的动效也只是外贴的皮。第四步为六类情绪时刻分别建造文档把建造情绪时刻拆成六个具体场景每个场景都有明确的设计策略成功Success让反馈的规模与付出、后果成正比。重大里程碑milestone可以展开庆祝常规保存只需让人感到确定simply feel certain——不必每次都放烟花。等待Waiting展示真实的进度、有用的上下文、或产品专属的活动。绝对禁止伪造工作fake work或故意拖慢完成来导演一场表演。空状态与首次使用Empty and first use先让下一步动作清晰可见再谈个性。个性永远排在可操作性之后。错误与恢复Error and recovery先呈现问题与恢复路径。温暖可以降低压力但玩笑绝不能轻描淡写地对待损失、金钱、隐私或被阻断的工作。重复交互Repeated interaction让反馈在第一百次使用时依然令人满意。变化只有在其仍然连贯、可预期、值得信任时才有价值——为变而变反而破坏信任。发现Discovery奖励好奇心但不能把必需功能藏在发现里reward curiosity without hiding required functionality。贯穿始终的文案铁律Copy must use the products language. Generic whimsy is worse than neutral clarity.文案必须使用产品自己的语言。通用的油腔滑调不如中性的清晰。这与仓库中 clarify.md改进 UX 文案的原则彼此呼应——delight 文案若失去清晰度就沦为噪音。第五步保护体验——Delight 的红线清单愉悦必须永远为任务让路。文档给出Delight must not愉悦不得清单共六条禁令不得拖延、阻塞或遮蔽主任务delay, block, or obscure the primary task不得覆盖平台惯例或可访问性override platform conventions or accessibility不得添加未经要求的陈述性主张add unrequested factual claims——例如给产品编造不存在的能力不得未经同意播放声音或无视静音设置play sound without consent or ignore mute settings不得在重复使用时变得强制、不可跳过、令人疲惫become mandatory, unskippable, or exhausting on repeat不得为某一瞬间添加不成比例的依赖或资产成本add a dependency or asset cost disproportionate to the moment。同时文档要求凡是涉及亲手创作动效authored motion的部分必须加载 animate.md——那是动效专题的操作手册定义了 100–800ms 的时长分级、cubic-bezier(0.16, 1, 0.3, 1)等缓动建议、CSS transitions / Web Animations API / View Transitions 的实现取舍以及prefers-reduced-motion的降级路径尊重屏幕阅读器、键盘、触控、本地化与文化语境非必要的循环动画在隐藏时必须停止庆祝的强度要与使用频率和后果成正比make celebration intensity proportional to frequency and consequence——低频、高后果的时刻可以有更盛的庆祝高频低后果的时刻必须克制。这条强度与频率成正比的定律正好回扣了仓库中 DESIGN.md 里 Neo Kinpaku新金箔视觉世界的实践——金箔高光与铜绿质感只出现在承载品牌重量的时刻hero 接缝、CTA 填充、分隔线而普通卡片保持扁平克制就是庆祝强度与时刻分量匹配的落地样本。第六步验证清单与收尾移交delight.md以一份六项验证清单收尾每一条都可作为 Agent 自检的判据唯一性这个时刻是否足够具体以至于相邻产品无法原样挪用The moment is specific enough that a neighboring product could not use it unchanged.有效性它是否改善了用户的理解、信心、动机或情绪恢复独立性去掉华丽之后界面是否依然快速、显而易见The interface remains fast and obvious without the flourish.耐久性重复使用是否没有把魅力变成摩擦Repetition does not turn charm into friction.可达性静音muted、键盘、触控、本地化路径是否都正常工作世界一致性最终效果是否像被选定的那个世界而不是一套通用的 delight 处理文档最后给出了移交建议当这份个性真正挣得了自己的位置时交给/impeccable polish做最终润色。这与 polish.md 的定位ship 前的最终质量关卡负责检查动效一致性、键盘焦点、控制状态、DESIGN.md 吻合度等构成流水线闭环delight 负责加对polish 负责加得干净、收得完整。仓库中的落地形态一份多副本、被路由的增强命令最后说明该文档在仓库中的实际组织方式这有助于 Agent 与读者理解它的生态位delight.md以多副本形式存在于各类 Agent 运行时目录.rovodev/、.claude/、.cursor/、.gemini/、.agent/等以及 plugin/skills/impeccable/reference/delight.md、skill/reference/delight.md供不同工具链按需加载主体与 SKILL.src.md 中Commands总表的 Enhance 类别一致它与 animate.md动效专项、polish.md最终润色、routing.md无参数时的上下文路由决定何时推荐某条命令是协同引用关系任何 delight 任务都可能顺带触发其中一条command-metadata.json 是该文档的机器可读入口Agent 据此把make it fun / memorable / add personality类请求路由到delight命令再载入本文档执行。换言之delight.md不是一份孤立的设计随笔而是 impeccable 命令路由链中Enhance → delight环节的操作准则上承 SKILL 的命令总表与 routing 判断旁通 animate 的动效实现下接 polish 的最终质检。理解这一点你就能在正确的时机、正确的节点用这条文档的方法论为界面注入恰到好处的产品个性。【免费下载链接】impeccableThe design language that makes your AI harness better at design.项目地址: https://gitcode.com/GitHub_Trending/im/impeccable创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考