Communitygithub.com

DanielNoamTuby/claude-skills

面向 Claude Code 的通用技能集:包含从设计到构建的工作流程(grill-me、design-brief、information-architecture、design-tokens、brief-to-tasks、frontend-design、design-review)以及 token-saver 和 work-report。

claude-skills 是什么?

这是一个专为 Claude Code 设计的通用技能集合,涵盖从设计到开发的全链路工作流。该技能集包含多个子技能:grill-me(需求追问与澄清)、design-brief(设计简报生成)、information-architecture(信息架构设计)、design-tokens(设计令牌管理)、brief-to-tasks(从简报拆解任务)、frontend-design(前端设计实现)以及 design-review(设计审查)。此外,还提供了 token-saver(令牌节省器)和 work-report(工作报告生成)两个辅助工具。该技能集旨在帮助开发者高效地将设计想法转化为可执行的开发任务,并优化 AI 交互中的令牌使用成本。它适用于 Claude Code 平台,通过结构化的提示和指令引导 AI 执行特定任务,提升开发效率。

兼容平台✓Claude Code~Codex CLI~Cursor
npx skills add DanielNoamTuby/claude-skills

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

claude-skills 是做什么的?

面向 Claude Code 的通用技能集:包含从设计到构建的工作流程(grill-me、design-brief、information-architecture、design-tokens、brief-to-tasks、frontend-design、design-review)以及 token-saver 和 work-report。

子技能概述

技能名称功能描述
grill-me通过主动追问澄清需求细节,确保初始需求被充分理解
design-brief基于需求生成结构化的设计简报文档
information-architecture设计信息架构,包括页面结构和导航流
design-tokens管理和应用设计令牌(颜色、间距、字体等)
brief-to-tasks将设计简报自动拆解为可执行的技术任务
frontend-design根据设计指令生成前端实现代码
design-review对设计实现进行审查,提供改进建议
token-saver优化提示词结构,减少不必要的令牌消耗
work-report生成结构化的开发工作报告

使用方式

在 Claude Code 提示中使用以下格式激活技能:

/skill grill-me

或通过组合使用实现完整工作流:

/skill grill-me
/skill design-brief
/skill information-architecture
/skill design-tokens
/skill brief-to-tasks
/skill frontend-design
/skill design-review

工作流示例

  1. 使用 grill-me 澄清初步设计需求
  2. 调用 design-brief 生成设计简报
  3. 使用 information-architecture 定义信息架构
  4. 应用 design-tokens 建立设计规范
  5. 使用 brief-to-tasks 将设计分解为开发任务
  6. 通过 frontend-design 进行代码生成
  7. 使用 design-review 进行设计审查

辅助工具

token-saver

优化 AI 对话中的提示词结构,减少冗余内容,从而降低令牌消耗。

work-report

基于当前对话记录,自动生成包含已完成工作、待办事项和关键决策的总结报告。

注意

  • 所有技能路径和命令均保持不变
  • 环境变量 CLAUDE_SKILLS_DIR 应指向技能目录(如果使用自定义路径)

相关技能