ChatGPT Compose 设计组件规格技能:写清变体、插槽和浅深预览
EnglishChatGPT 安装步骤
- 打开固定提交的 .claude/skills/write-design-system-component/SKILL.md,核对原文的输入和输出。
- 在 ChatGPT 打开「插件 → 技能 → 创建 → 使用编辑器创建」。
- 按下面的工作流程填写技能规则。提供组件设计、已确认状态、现有令牌、同类实现和可用本地化文本。
- 保存技能,在新对话输入本页的虚构示例并核对结果。
中文摘要
把确认过的组件设计整理成 Compose 实现规格。记录命名、状态、文案资源、主题令牌和各变体需要的预览。
SKILL.md 中文导读
可复现示例
虚构任务标签有默认、选中、禁用三态,图标可由调用者提供,屏幕朗读需要中文标签。请拟 Kuvio 组件交付规格。工作步骤
- 按变体和状态整理规格。
- 确定插槽、命名和主题引用。
- 写浅深预览与可访问性核对。
验收方法
给每个状态明确表现,描述可选图标插槽和字符串资源。列浅色、深色与读屏验证,颜色映射使用已给的主题语义。
GitHub 原文 · 更新日期
适用环境
需要启用了技能创建的 ChatGPT 工作区。这里使用基于 GitHub 原文编写的文本改编。
常见问题
图标颜色和大小都应变成独立参数吗?
先检查系统已有图标规则和组合插槽。只有确有调用场景时才新增可配置项,避免给同一职责多个入口。