jakubkrehel/skills

一组帮助构建优秀界面的 agent skills，涵盖动画、UI 打磨、无障碍和产品文案等各个方面。

Skills

• better-interface: 用户主动触发的跨学科界面评审，协调下方所有 skill。
• interface-review: 用户主动发起的评审，针对未提交改动、当前分支或 pull request，对照下方所有 skill 进行检查。
• better-ui: 让界面感觉精致的设计工程细节：圆角、阴影、动画和微交互。
• better-typography: 网页排版，从字体选择到间距、换行和无障碍。
• better-colors: OKLCH 色彩空间：调色板生成、对比度、色域处理和主题。
• better-accessibility: 焦点状态、键盘支持、ARIA、表单、屏幕阅读器、点击区域和动效。
• better-layout: 布局结构、分组、对齐、阅读顺序、渐进式披露和自适应断点。
• better-writing: UX 文案和界面文本，从按钮标签到错误信息、设置和空状态。

Install

作为 Claude Code 插件

一次性安装本仓库的所有 skill，并支持原地更新。在 Claude Code 中运行：

/plugin marketplace add jakubkrehel/skills
/plugin install interfaces@interfaces

使用 skills CLI

适用于 Claude Code、Codex 和其他 agent。你可以选择安装部分 skill 或全部安装。better-interface 协调六个领域 skill，interface-review 基于 better-interface 构建，因此当你需要整体评审或变更范围评审时，建议安装完整集合。

npx skills add jakubkrehel/skills

npx skills add jakubkrehel/skills --skill '*'

Use

有两个 skill 通过名称调用。使用 better-interface 评审某个屏幕、流程或功能，使用 interface-review 评审你所做的更改：未提交的工作、当前分支或 pull request。

默认评审模式为 full。传入 quick 以进行更简短的评审。对于 better-interface，在模式后添加屏幕、流程或功能。对于 interface-review，在模式后添加目标；省略时自动检测分支或未提交的更改。

在 Claude Code 中，作为插件。插件 skill 带有命名空间，因此每个 skill 都带有 interfaces: 前缀。

/interfaces:better-interface
/interfaces:better-interface quick
/interfaces:better-interface full checkout flow
/interfaces:interface-review
/interfaces:interface-review quick pr 482

在 Claude Code 中，通过 skills CLI 安装：

/better-interface
/better-interface quick
/better-interface full checkout flow
/interface-review
/interface-review quick pr 482

在 Codex 中：

$better-interface
$better-interface quick
$better-interface full checkout flow
$interface-review
$interface-review quick pr 482

前缀仅影响你通过名称调用的 skill。六个领域 skill 无论哪种方式都会根据上下文自动匹配。