mcpField
T
taste-ux-copy

taste-ux-copy

github.com/madebymustafa设计与 UI20055 次安装11 周前更新
代码仓库

关于 taste-ux-copy

taste-ux-copy 是用于编写界面文案的技能,面向产品设计和内容工作。它为语气、标题、按钮、错误、空状态与状态消息提供具体规则,并纳入包容性和本地化准备要求。

主要功能

  1. 01语气与品牌声音选择
  2. 02标题和按钮文案规则
  3. 03错误消息的说明与修复指引
  4. 04空状态和下一步行动设计
  5. 05进度及完成状态文案
  6. 06包容性与本地化准备检查

适用场景

  1. 01撰写产品页面标题和行动按钮
  2. 02改写表单错误提示
  3. 03为无内容页面设计后续行动
  4. 04统一加载、进度和完成消息

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/madebymustafa/design-taste --skill taste-ux-copy

安装后在 Claude Code 中输入/taste-ux-copy确认已加载。

详细介绍

taste-ux-copy

文案是界面的个性,也是它的使用说明。糟糕的文案会让优秀的设计显得像是坏掉了。

1. 语气与风格(先确定,再动笔)

根据品牌定位选定一种语气,并保持一致:

语气听起来像适用场景
朴实直白“我们会告诉你哪里出了问题,以及该怎么做。”企业、金融科技、医疗健康
直接“少打字,多交付。”开发者工具
温暖“快完成了——还差最后一步。”消费者产品、教育
冷幽默“不,这不是邪教。只是我们的邮件通讯确实好得离谱。”消费者产品、独立品牌

无论采用哪种语气,都要遵守以下规则:表达具体(说“42 行”,而不是“一些数据”);诚实(不要说“只需”——“只需输入你的邮箱”并不诚实);在营销内容中用“你”称呼读者;除每页一次的庆祝语外,不用感叹号;错误提示中不用被动语态;不说企业套话(如“利用”“精简”“强大”)。

2. 标题(行之有效的公式)

  • 结果 + 受众:“无需数据团队的分析工具。”
  • 之前 → 之后:“从‘我的用户都去哪儿了?’到‘哦,在那儿。’”
  • 点明痛点:“你的注册表单流失了 63% 的访客。”
  • 权威性 + 承诺:“2026 年独立 SaaS 定价指南。”
  • 用好奇心吸引读者,并给出答案(不能只吊胃口):“我们删掉了仪表板。来看看我们用什么替代了它。”

规则:H1 少于 12 个词;只表达一个想法;产品名称可以放在副标题中,不要放在 H1 里;不要玩弄标点(?!、!!!);不要用“X 的未来”开头。

3. 按钮与操作(页面上最常读到的文字)

  • 按钮要写明操作:“保存更改” > “提交” > “确定”。第一人称措辞能提高面向消费者产品的转化率:“开始我的免费试用”。
  • 破坏性操作要说明会删除什么:“删除项目”(绝不要只写“确定”)。同时配一个同样醒目的取消按钮。
  • 加载/禁用状态要说明正在发生什么,而不是许下承诺:“正在保存…” > “请稍候”。如果无法确认进度,绝不要写“即将完成”。
  • 脱离上下文后,标签也必须清楚易懂:图标按钮必须配有无障碍文本。

4. 错误(公式:发生了什么 + 为什么 + 如何修复)

每条错误消息都按顺序包含三个部分:

  1. 发生了什么,用简单明了的语言说明(“我们无法保存此部分”)。
  2. 为什么(最多一个分句:“文件大于 10 MB”)。
  3. 如何修复(用动词说明:“移除一些图片后重试”,或提供链接)。

修改前后示例:

修改前修改后
“错误 500 — 请稍后重试”“我们这边的页面出了点问题。重新加载——你的内容已保存。”
“输入无效”“至少输入 8 个字符。加上一个数字会更好。”
“密码错误”“密码不匹配。忘记密码了?在这里重置。”

字段级错误应显示在对应字段旁边,而不是出现在屏幕另一侧的 Toast 提示中。绝不要责怪用户(将“你输入了……”改为“此字段需要……”)。

5. 空状态(每个空状态都要发挥作用)

  1. 说明空的是什么(“还没有项目”)。
  2. 说明为何为空(用一行文字:“创建项目后,它们会显示在这里”)。
  3. 说明下一步操作(一个按钮:“创建你的第一个项目”)。
  4. 可选:给一个小小的好消息(“大约需要 4 分钟”)。

没有下一步操作的空状态就是死胡同。死胡同就是产品失败。

6. 状态与加载

  • 进度:用动词,不要许诺(“正在上传 8 个文件中的第 3 个……”)。
  • 完成:说明发生了什么变化,不要只说“完成”(“已将 8 个文件上传到 /reports”)。
  • 通知:主题 + 一个分句 + 可选操作,不超过 20 个词:“付款失败——你的银行卡被拒绝。点击此处更新。”
  • 骨架屏:如果显示时间超过约 2 秒,必须附带一条消息。

7. 为包容性与本地化做好准备

  • 不用“伙计们”“人时”等表达,也不在通用文案中使用带性别的代词;可以使用“他们”。避免使用“轻松”“简单”“只需”(这些说法会轻视读者所处的情境)。
  • 数字:需要精确时写“1,024”,不要写“1k”;日期在可能产生歧义时写全(7 月 3 日 ≠ 7/3)。
  • 为翻译而写:不要在句子中间嵌套变量(将“你的 {{count}} 个朋友”改为“朋友:{{count}}”);不要使用习语(如“快速上手”);不要只用表情符号传达信息。

8. 检查清单(出现以下情况时,文案不予通过……)

  • 任何包含“leverage”“streamline”“robust”“seamless”“cutting-edge”的句子。
  • 任何没有修复方法的错误。
  • 存在适用的实际动词时,任何写着“Submit”或“OK”的按钮。
  • 任何没有后续操作的空状态。
  • 任何超过 12 个词或带有“!”的标题。
  • 任何页面无法在同一视口内证实的说法。
  • 同一页面上,同一操作使用了两个不同的标签。

评论

支持 Markdown