Impeccable `delight` 参考指南:为 AI 辅助的界面设计塑造恰如其分的惊喜时刻
导读:本文解读开源项目 impeccable 中
/impeccable delight命令的完整操作手册(delight.md),说明"让体验令人难忘"这一设计增强能力在项目中的定位:不是给界面披上一层通用俏皮装饰,而是在值得的时刻、用产品自身的性格去回应一次有用的交互、一句有人情味的文案,或一个出乎意料却体贴入微的细节。读完你将掌握 delight 的适用场景判定、机会点识别清单、"一句惊喜论点(delight thesis)"的定义方法、五种最小可实现系统、六个情感时刻的构建策略与不可逾越的红线,以及如何把成果交接给/impeccable polish做最终把关。
1. 能力定位:delight 是"产品性格的显影",不是"通用趣味层"
在 impeccable 的命令体系中,delight 属于 Enhance(增强) 类目,与 animate、colorize、typeset、layout、overdrive 并列。从 command-metadata.json 的元数据可以看到它的触发条件与期望:
Add moments of joy, personality, and unexpected touches that make interfaces memorable and enjoyable to use. Elevates functional to delightful.
其 argument-hint 为 [target],即总是针对某个具体表面(surface)工作,而不是面向整个产品做无差别加料。
要理解这一能力的边界,需要先了解 impeccable 对"模式(mode)"的定义。SKILL.md 用四种模式刻画"访客在该表面的成功形态":Persuade(说服)、Operate(操作)、Read(阅读)、Experience(体验)。模式依据"被请求的表面"而非"产品本身"来选择——同一款工具产品的落地页仍是 Persuade,而某个时尚品牌的文档仍是 Read。delight 参考文档正是在此模式下分层给出投放强度的:
- Persuade + Experience:个性可以渗透进 voice(文案语气)、composition(版式构成)、motion(动效)、discovery(发现感),前提是"作品/产物本身仍是焦点"。这类表面允许品牌气质更外放地流动。
- Operate + Read:把惊喜集中到真正有意义的时刻——首次使用、完成任务、故障恢复、掌握技能。其余一切由"可靠性(reliability)"承载。
这与 operate.md 中"Consistency over surprise … delight is saved for moments, not pages"(一致性优先于惊喜,惊喜属于时刻而非整页)的原则完全一致:Operate 类产品 UI 上,惊喜是"点"而不是"面"。
2. 寻找机会:在哪些时刻,产品"挣到了"一个惊喜?
在执行 delight 前,先做一次现场勘察(inspect the target),输入包括:目标界面本身、项目的 DESIGN.md(视觉世界)、产品 voice、该表面被反复使用的频率、以及用户所处的情绪语境(emotional context)。
在这组输入之上,delight.md 给出了六个值得寻找的机会点,逐一展开:
- 值得被承认的努力(effort worth acknowledging):用户刚刚完成一项耗时或高投入的操作,此刻值得一个与之匹配的正面回应。
- 可以变得"有信息量"的等待(waiting that can become informative):加载、同步、导出等不可消除的等待,如果无法缩短,就让它传递真实进度或有用上下文,而不是空转。
- 可以引导方向的空状态 / 首次使用态(an empty or first-use state that can orient):首次进入、尚无数据、无搜索结果等"空"的瞬间,正是教会用户界面如何运作的窗口(可配合
/impeccable onboard的流程设计)。 - 需要同理心的错误 / 恢复时刻(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)。只有当品牌的情绪范围或某处情境的风险无法从上下文推断时,才向用户提问。
3. 定义"一句惊喜论点":Delight thesis
勘察完毕、确认存在机会后,下一步是用一句话写下用户应当感受到什么、以及为什么这种感受属于这个产品(State in one sentence what the user should feel and why that feeling belongs to this product)。这一"论点"起到三个作用:它是取舍的依据、是验证的标准、也是防止"为惊喜而惊喜"的护栏。
论点确立后,选择能交付它的最小系统(the smallest system that can deliver it)。delight.md 给出了五种候选载体:
- 对某个有意义动作的独特响应(a distinctive response to a meaningful action);
- 在澄清含义的同时承载 voice 的产品化语言(product-specific language that clarifies while carrying voice)——文案的惊喜是"说得更清楚且更有人味",参见 /impeccable clarify 对文案可读性与语气的要求;
- 带有可识别的材质行为的交互或转场(an interaction or transition with a recognizable material behavior)——按钮、纸张、玻璃等真实材质的响应逻辑;
- 扎根于产品世界的插画、声音、触觉或环境细节(an illustration, sound, haptic, or environmental detail grounded in the product world);
- 一种能揭示真实效用的发现奖励(a discovery reward that reveals real utility)。
关键约束:处理手法必须从产品机制与视觉世界中派生(derive the treatment from product mechanism and visual world),而不是调用一套现成的俏皮素材目录。一个与产品无关的彩纸撒花,属于"generic whimsy",比中性的清晰更糟。
4. 构建情感时刻:六个场景的分寸把握
论点落定后,delight.md 按情感场景给出六组构建纪律:
4.1 成功(Success)
回应的强度要与付出的努力与后果的大小相匹配:重大里程碑(如发布、首次转化、项目完成)可以"放大庆祝";而例行保存这样的常规动作只需让人感到确定,不该喧宾夺主。
4.2 等待(Waiting)
展示真实的进度、有用的上下文或产品专属的活动。绝不伪造进度,也绝不为了编排一段华彩而人为拖延完成时间(Never fake work or delay completion to stage a flourish)。这与 clarify.md 对加载态"说出真实操作、在有确定进度时展示,绝不虚构进度"的要求同源。动效侧的执行细节(时长、缓动)可进一步参考 /impeccable animate:routine state change 通常落在 150–300ms,超过 500–800ms 只属于"刻意编排的焦点入场"。
4.3 空状态与首次使用(Empty and first use)
先让下一步动作清晰,再叠加个性。空状态首先是引导,其次才是展示个性——顺序错了,惊喜就会变成困惑。
4.4 错误与恢复(Error and recovery)
以问题和恢复方案为先导(lead with the problem and recovery)。温暖可以降低压力,但玩笑绝不能轻慢化损失、金钱、隐私、受阻的工作(loss, money, privacy, or blocked work)。这与 clarify 的"对隐私、支付、删除、访问丢失与受阻工作要严肃对待,欢迎温度、不要玩笑"完全一致。
4.5 反复交互(Repeated interaction)
好设计必须在第一百次使用时依然令人满意。变体(variation)只有在仍然连贯、且可预期到足以被信任时才有价值——如果每次点按的反馈都不可预测,趣味就会沦为摩擦。
4.6 发现(Discovery)
奖励好奇心,但绝不把必需功能藏在发现里(reward curiosity without hiding required functionality)。发现必须是"锦上添花",不能成为完成任务的必经路径。
贯穿以上所有时刻的总则:文案必须使用产品自己的语言。通用俏皮(generic whimsy)比中性清晰(neutral clarity)更糟——这是全文出现两次、值得重复强调的核心立场。
5. 保护体验:delight 不可越过的红线
delight.md 为"保护体验"开出一份明确的禁止清单,任何增强处理都不得:
- 延迟、阻塞或遮蔽主任务(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)。
对于需要创作者编排的动效,必须加载 animate.md 以遵循其全套约束。delight 尤其要求尊重:屏幕阅读器、键盘使用、触摸、本地化与文化语境;非必要的循环在隐藏时必须停止(nonessential loops stop when hidden);以及庆祝强度应与发生频率和后果成正比(celebration intensity proportional to frequency and consequence)——高频低危的操作庆祝级别必须低,低频高光的时刻才允许放大。
6. 验证:交付前过一遍"可审计清单"
在宣布完成之前,用 delight.md 的 Verify 清单逐一自检:
- 特异性:这个时刻足够具体,以至于相邻产品无法原样挪用?(The moment is specific enough that a neighboring product could not use it unchanged.)
- 价值:它确实提升了理解、信心、动机或情绪恢复中的某一项?
- 无退化:去掉这份惊喜后,界面依然快速且显而易见?
- 抗重复:反复使用不会把魅力变成摩擦?
- 可达路径:静音、键盘、触摸与本地化路径均正常工作?
- 归属感:最终结果感觉像"选定的那个世界",而不是一套通用的"delight"处理?
第 6 条实际上要求把惊喜与 DESIGN.md 记录的视觉世界做最终对位——个性必须显得"本就属于这个产品"。
7. 工作流位置:delight 之后做什么
值得注意 delight.md 结尾的交接约定:当个性显得"挣来了"(earned)时,交给 /impeccable polish 做最终把关。这符合 impeccable 各 reference 文档共同的工作流——增强之后总有一个收敛步骤。/impeccable polish(见 polish.md)执行的是精修而非隐性重设计:它会按 P0–P3 优先级排障、核对动效是否"连贯、可中断、高性能",并明确"不要仅仅为了让打磨可见而添加动画(Do not add animation merely to make polish visible)"——这正与 delight 的"最小的惊喜系统"哲学互为表里。
在跨命令协作上,delight 还与两个相邻参考形成互补边界:
- /impeccable animate(animate.md):当惊喜主要靠动效承载时,animate 提供材质选择、时长表(100–150ms 即时反馈 / 150–300ms 常规状态变化 / 300–500ms 布局与视图转场 / 500–800ms 刻意编排的焦点入场)、缓动建议(
cubic-bezier(0.16, 1, 0.3, 1)的自然减速)以及prefers-reduced-motion降级路径。delight 只在"这个时刻配得上一次编排"时使用动效,装饰性的动效属于动画债务。 - /impeccable clarify(clarify.md):当惊喜主要靠文案承载时,delight 的语言必须是"产品自己的语言",而这正建立在 clarify 的消息层级与 voice 规范之上——先决定此刻唯一需要的那个事实,再决定语气。
8. 一份可直接执行的最小检查单
把上述手册压缩成实施时可逐条对照的最小检查单:
| 阶段 | 关键动作 | 判定标准 |
|---|---|---|
| 定性 | 确认表面模式(Persuade/Experience 可外放,Operate/Read 收敛到关键时刻) | 模式决定投放强度 |
| 勘察 | 检查目标、DESIGN.md、产品 voice、使用频率、情绪语境 |
命中六个机会点之一 |
| 论点 | 一句话:用户该感受到什么、为何属于本产品 | 不能被相邻产品原样挪用 |
| 载体 | 从五种最小系统中择一 | 手法源自产品机制与视觉世界 |
| 构建 | 按成功/等待/空态/错误/反复/发现六场景把握分寸 | 高频低危从简,低频高光可放大 |
| 保护 | 对照六条红线 | 不阻塞任务、不覆盖无障碍、不擅自出声 |
| 验证 | 跑 Verify 六项 | 快速、明显、抗重复、本地化可用 |
| 交接 | /impeccable polish 最终把关 |
删除多余动效,收敛系统 |
一句话总结 delight.md 的设计哲学:惊喜不是一份可以被调用的装饰层,而是产品性格在恰当时刻的一次显影——它服务于理解、信心、动机与情绪恢复,而当它出现时,读者应当能认出"这就是这个产品",而不是"这又是一处通用趣味"。
延伸阅读(仓库内相对路径)
- 命令总览与模式定义:.trae/skills/impeccable/SKILL.md
- 动效增强规范(时长、材质、reduced-motion):.trae/skills/impeccable/reference/animate.md
- UX 文案与消息层级规范:.trae/skills/impeccable/reference/clarify.md
- Operate 表面的深度规则("delight 属于时刻而非整页"):.trae/skills/impeccable/reference/operate.md
- 最终质量把关流程:.trae/skills/impeccable/reference/polish.md
- 命令触发词与语义元数据:.trae/skills/impeccable/scripts/command-metadata.json
atomcodeClaude Code 的开源替代方案。连接任意大模型,编辑代码,运行命令,自动验证 — 全自动执行。用 Rust 构建,极致性能。 | An open-source alternative to Claude Code. Connect any LLM, edit code, run commands, and verify changes — autonomously. Built in Rust for speed. Get StartedRust0629
MiniCPM5-2BMiniCPM5-2B 是一款面向端侧、本地部署和资源受限场景的 2B 稠密 Transformer,能够达到同尺寸开源模型 SOTA 水平。Markdown00
GLM-5.3GLM-5.3 与 GLM-5.2 使用相同的基座模型——所有提升均来自后训练。与 GLM-5.2 相比,它在复杂编程和长程任务上的表现显著提升。Jinja00
HivisionIDPhotos⚡️HivisionIDPhotos: a lightweight and efficient AI ID photos tools. 一个轻量级的AI证件照制作算法。Python07
DragonOSDragonOS is an operating system developed from scratch using Rust, with Linux compatibility. It is designed for **Serverless** scenarios. 使用Rust从0自研内核,具有Linux兼容性的操作系统,面向云计算Serverless场景而设计。Rust00
Spark-X2.5-1.7BSpark-X2.5-1.7B 旨在让强大的 AI 更加实用、高效且易于获取。这些模型在广泛的日常任务中表现出色,涵盖对话、写作、翻译、推理、编程、工具调用和智能体工作流,并在同等规模的开源模型中取得领先结果。Spark-X2.5 将面向效率的架构与最高 1M tokens 的原生上下文窗口相结合,并支持 200 多种语言。Python00