10 分钟上手「界面微文案」Skill:从零到第一次跑通
「界面微文案」是前端工程师的高频任务。它的输入通常是界面截图与场景,期望得到的是文案建议。这类有固定流程、又需要一点判断力的工作,很适合封装成智能体 Skill。
这篇是最短路径:不追求完美,只求在 10 分钟内让「界面微文案」第一次跑通。
准备(2 分钟)
- 一份真实但已脱敏的界面截图与场景
- 一个支持技能或自定义指令的智能体工具(如 Claude Code、Cursor、GPTs、扣子等任一)
- 一份你认可的文案建议范例(可选,但很有帮助)
第 1 步:写最小指令(3 分钟)
任务:界面微文案
输入:界面截图与场景
步骤:
1. 识别场景与用户意图
2. 写简短文案
3. 统一语气
4. 提供备选
输出:文案建议,末尾列出需人工确认的内容。
信息不足时先提问,不要编造。
第 2 步:放到工具里(2 分钟)
把上面的内容放进所用工具的规则或技能位置:Claude Code 放进 .claude/skills/micro-copy/SKILL.md(前面补上 name 与 description),Cursor 放进 .cursor/rules/,GPTs 放进 Instructions。具体位置见各平台版本的文章。
第 3 步:跑一次(2 分钟)
用一句自然语言发出请求,例如:
帮我做一下界面微文案,材料是附上的界面截图与场景。
观察智能体是否按步骤执行,输出结构是否符合预期。
第 4 步:修一处(1 分钟)
找出输出中最不满意的一点,只改对应的那一句指令,再跑一次。不要一次改很多处,否则不知道是哪处起了作用。
跑通之后
每一步要产出什么
把每一步的中间产出写清楚,智能体就不容易跳步,人也方便定位问题:
- 识别场景与用户意图:产出一段简短的中间结果,并注明依据来自界面截图与场景的哪一部分
- 写简短文案:产出一段简短的中间结果,并注明依据来自界面截图与场景的哪一部分
- 统一语气:产出一段简短的中间结果,并注明依据来自界面截图与场景的哪一部分
- 提供备选:产出一段简短的中间结果,并注明依据来自界面截图与场景的哪一部分
最后一步之后,再把这些中间结果汇总成文案建议。中间结果可以折叠或省略展示,但在技能指令中要求智能体“先完成再汇总”,能明显减少遗漏。
领域注意事项
「界面微文案」属于前端与界面领域,使用者多是前端工程师,工作环境通常是浏览器、组件库与设计稿。这个领域最重要的一条底线是:视觉与交互结果要在真实浏览器里确认。
建议把这条底线原样写进技能的约束部分,而不是指望智能体自己意识到。同时,在团队内部明确:智能体给出的文案建议只是初稿或建议,最终由谁签字确认、出了问题由谁负责。
常见变体
同一个技能可以按使用场景派生出几个变体:
- 简版:只保留核心步骤(识别场景与用户意图、提供备选),适合快速过一遍
- 详版:每一步都写出理由与依据,适合交给他人复核或留档
- 批量版:一次处理多份界面截图与场景,输出汇总表,适合定期集中处理
变体之间共享同一套约束,只在步骤详略和输出格式上有差异。可以在一个技能里用参数区分,也可以拆成几个名称明确的技能。
延伸阅读
- 界面微文案 · Dify 工作流 版
- 界面微文案 · SKILL.md 写法
- 界面微文案 · 组合用法
- 组件生成 · 快速上手
- 设计变量同步 · 快速上手
- 智能体Skills 分类:625 个技能 × 32 个角度
说明:文中的配置、代码与目录结构均为示意,用于说明思路;各平台的入口、字段名与能力会更新,落地前请以对应官方文档为准。示例中的数据与场景为虚构,不代表真实案例。