用 ChatGPT 检查界面的视觉层次
EnglishChatGPT 安装步骤
- 在支持创建技能的 ChatGPT 工作区打开「插件 → 技能 → 创建 → 使用编辑器创建」。
- 对照固定版本 GitHub 原文,在编辑器新建技能,将 `design-system` 的纯文本工作流程改写为技能说明。
- 保存后,在新对话输入 @ 并选中刚创建的技能,再用示例试用。
中文摘要
根据字号、强调色、间距和动效规则,检查界面是否有清晰的视觉焦点。
SKILL.md 中文导读
可复现示例
根据 Harbor 报名页的文字说明给出界面调整建议。
page="Harbor signup"; currentHeadingPx=16; currentBodyPx=16; buttonAccentCount=3; cardGapPx=13; primaryAction="Reserve a seat"工作步骤
- 根据字号和空间规则梳理页面层次。
- 确认唯一的主操作并检查强调色与动效。
验收方法
把 `Reserve a seat` 作为唯一主操作,建议标题 28px、正文 16px,按钮共用一种强调色,卡片间距统一到 16px。动效用于反馈状态变化。
GitHub 原文 · 更新日期
适用环境
支持创建技能的 ChatGPT 工作区。使用以下虚构材料作为纯文本输入。
常见问题
如何用 ChatGPT 检查界面字号和间距?
用字号拉开标题与正文的差异,用统一的间距组织内容,再给主操作保留一种强调色。动效用于动作反馈。