「界面微文案」是前端工程师的高频任务。它的输入通常是界面截图与场景,期望得到的是文案建议。这类有固定流程、又需要一点判断力的工作,很适合封装成智能体 Skill。

单个技能解决一个环节,把几个技能串起来,才能覆盖一整段工作。本文示范「界面微文案」与三个相关技能的组合。

组合方案

顺序技能作用交给下一步的东西
1页面结构说明为前端页面生成结构说明,便于新人理解结构文档
2界面微文案为按钮、空状态、错误提示写清晰的界面文案文案建议
3表单校验为表单生成前后端一致的校验规则与错误提示校验代码与文案
4行为场景编写把需求写成 Given-When-Then 场景行为场景文件

交接格式是关键

技能之间靠“上一步的输出就是下一步的输入”衔接。建议约定:

  • 每个技能的输出都带固定标题,便于下一个技能定位内容
  • 不确定项统一放在“需人工确认”小节,后续技能不得把它当作确定事实
  • 「界面微文案」接收的是界面截图与场景,如果上一步给的格式不同,先做一次转换

怎么编排

有三种常见方式:

  1. 人工串联:每一步结束后由人确认,再触发下一个技能,最稳妥
  2. 编排指令:写一个总技能,列出调用顺序与交接要求,由智能体依次执行
  3. 工作流平台:在 Dify、扣子、n8n 等平台中把每个技能做成节点,用条件分支处理异常

编排指令示例(示意)

# 组合流程:页面结构说明 → 界面微文案 → 表单校验 → 行为场景编写
1. 调用 web-scraper-safe-ui,保存输出为 step1
2. 以 step1 为输入调用 micro-copy,保存为 step2
3. 以 step2 为输入调用 form-validation
4. 调用 bdd-scenarios 做收尾
- 任一步出现“需人工确认”时暂停,等待用户回复后再继续

注意事项

  • 链条越长,错误越容易被放大,关键节点要有人看
  • 风险较低,但输出仍需快速过目再使用
  • 每个技能单独测试通过后再组合

相关技能

准备一份好范例

在技能的参考资料里放一份你认可的文案建议范例,往往比多写十条规则更有效。好范例应当:

  • 来自真实工作,但已去除个人信息和敏感数据
  • 体现团队习惯的结构、措辞和详略程度
  • 包含一处“需人工确认”的标注示范,让智能体学会如何表达不确定
  • 篇幅适中,不要比平时的产出长太多

范例不必多,一到两份即可;太多范例反而会让智能体机械模仿某一份的细节。

每一步要产出什么

把每一步的中间产出写清楚,智能体就不容易跳步,人也方便定位问题:

  1. 识别场景与用户意图:产出一段简短的中间结果,并注明依据来自界面截图与场景的哪一部分
  2. 写简短文案:产出一段简短的中间结果,并注明依据来自界面截图与场景的哪一部分
  3. 统一语气:产出一段简短的中间结果,并注明依据来自界面截图与场景的哪一部分
  4. 提供备选:产出一段简短的中间结果,并注明依据来自界面截图与场景的哪一部分

最后一步之后,再把这些中间结果汇总成文案建议。中间结果可以折叠或省略展示,但在技能指令中要求智能体“先完成再汇总”,能明显减少遗漏。

延伸阅读

说明:文中的配置、代码与目录结构均为示意,用于说明思路;各平台的入口、字段名与能力会更新,落地前请以对应官方文档为准。示例中的数据与场景为虚构,不代表真实案例。