naksha-studio
把 26 名设计专家装进终端,让 AI 编程工具秒变设计团队
加载项目详情…
本应用为开源项目,仅供学习研究,请遵守其开源协议。
把 26 名设计专家装进终端,让 AI 编程工具秒变设计团队
加载项目详情…
本应用为开源项目,仅供学习研究,请遵守其开源协议。
你曾经有没有这样的经历?凌晨两点赶一个产品 demo,想给 SaaS 仪表盘加上专业的视觉效果,但团队的设计师早就下班了。你自己写的界面总感觉差点意思——配色保守、间距不对、动效全靠默认样式。
naksha-studio 就是来解决这个问题的。它是一个开源的 AI 编程插件,把一整支虚拟设计团队(26 个专业角色、62 条命令、15000+ 行设计知识)直接嵌入 Claude Code、Cursor、Windsurf、Gemini CLI 和 Copilot 的工作流中。不需要切换窗口,不需要 Figma,不需要设计评审会议——在终端里就能调出一支设计天团。
这个项目的作者 Aditya Raj 是一名独立开发者,在构建 AI 应用时频繁遇到设计瓶颈。他的核心痛点很典型:写代码是把好手,但设计产出总是不够专业。 找设计师外包太贵、周期长;用 AI 画图工具又缺乏系统性,无法生成完整的设计系统。
他想到一个思路:如果把专业设计师的思维方式「结构化」成可复用的 Prompt,然后嵌入到 AI 编程工具里,是不是就能随时调用专家级的设计建议?这个想法催生了 naksha。2026 年 3 月发布 v1.0,到 6 月底已迭代至 v5.1,累计超过 2900 Star,进入了 Claude Code 插件市场。

图1:naksha-studio 项目封面图,展示其作为终端内虚拟设计团队的核心定位
naksha 的设计理念借鉴了好莱坞电影团队的运作模式:不是一个人做所有事,而是由一个 Design Manager(设计总监) 根据任务需求,自动召集最合适的专家角色。
角色分为五个层级:
策略层:Design Manager(统筹调度)→ Creative Director(视觉方向)→ Product Designer(产品策略)→ Brand Strategist(品牌定位)
用户研究层:UX Researcher(用户洞察)→ Content Designer(内容策略)
视觉执行层:UI Designer(界面视觉)→ Motion Designer(动效)→ Illustration Director(插画/图标)→ Print Designer(印刷品)
专项领域层:Social Media Designer/Strategist/Copywriter(社交媒体全栈)→ Email Designer/Copywriter(邮件营销)→ Data Viz Designer + Dashboard Architect(数据可视化)→ Presentation Designer(演示文稿)
AI 创作层:AI Image Director → AI Video Director → AI Audio & Voice Producer → AI Prompt Engineer
每个角色的专业知识被封装成独立的 Markdown 文件,通过斜杠命令触发。例如:
| 命令 | 功能 |
|---|---|
/design <任务描述> | 完整设计工作流,自动组装团队 |
/design-review <文件/截图> | 质量审核,支持 HTML、Figma URL 或截图 AI 视觉评审(6 项原则 0-10 分) |
/design-system | 生成/提取/审核设计 token |
/figma <URL> | Figma 设计稿转生产代码 |
/brand-kit | 生成品牌视觉套件 |
/chart-design | 数据图表专项设计 |
/design-reel | 录制设计团队工作过程,生成分享视频(9:16 + 16:9),v5.1 新增 |
/email-design | HTML 邮件模板设计与合规审查 |
naksha 的技术选型非常「轻」——主语言是 HTML(项目本身即是文档),核心实现完全依赖 Markdown 文件 + Claude Code 插件系统,没有一行后端代码。
naksha-studio/
├── .claude-plugin/ # Claude Code 插件声明(200+ 关键词触发规则)
├── agents/ # 7 个 Agent 描述文件(design-critic、figma-creator、design-qa 等)
├── commands/ # 62 条命令的详细 Prompt
├── skills/design/ # 主 Skill 编排器(49KB SKILL.md,是整个项目的核心)
├── types/v5.ts # TypeScript 类型定义文档(描述 v5 架构契约,非执行代码)
├── hooks/hooks.json # Session 生命周期钩子(自动上下文检测、设计产物验证)
├── packages/naksha-reel/ # 视频录制能力(v5.1 新增)
├── scripts/ # 12 个辅助脚本(token 生成、lint 检查、行为冒烟测试等)
└── install.sh # 一键安装脚本(symlink 热更新机制)
从 v4 到 v5,项目经历了三次重大架构演进:
.naksha/project.json 持久化机制,Design Manager 具备项目记忆v5 的 Memory 机制通过 Claude Code 的 Stop Hook 实现:SessionStop 钩子解析 HTML 评论块中的 naksha-memory-update 指令,将设计决策(品牌色、字体、框架偏好)写入 project.json,下次对话自动读取。
naksha 最有价值的设计决策之一是不绑定单一 IDE。它为每个主流 AI 编程工具提供了适配方案:
.claude-plugin/)+ marketplace + hooks,63 条命令全部可用.cursor/rules/naksha.mdc 规则文件.windsurfrules 全局规则GEMINI.md 项目级说明文件.github/copilot-instructions.md 指令集AGENTS.md + skills/design/SKILL.md这意味着团队成员可以各用各的 IDE,但共享同一套设计知识库。
naksha 的安装极度简单,核心就一行:
git clone https://github.com/Adityaraj0421/naksha-studio.git
cd naksha-studio && bash install.sh
install.sh 脚本做了三件事:
~/.claude/naksha-marketplace/ 创建本地插件市场git pull 即可热更新,无需重装)claude plugin install 完成注册安装完成后,重启 Claude Code,直接输入:
/design Build a landing page for a SaaS analytics product
Design Manager 会自动分析任务,召唤 Product Designer 确定信息架构 → UI Designer 生成视觉稿 → Motion Designer 加入微交互 → Design System Lead 注入设计 Token。整个过程在终端里完成,输出是可直接部署的 HTML/CSS/JS。
naksha 不是万能的。它的本质是 Prompt 封装,而非真正的 AI Agent 执行引擎:
此外,项目采用 MIT 许可证,商业使用无法律障碍,但核心代码(49KB 的 SKILL.md)完全在 Claude Code 的黑盒执行环境中运行,缺乏可审计性。
naksha 的出现折射出一个更大的趋势:当 AI 编程工具从「代码补全器」进化为「编程助手」后,用户对「代码输出质量」的期待也在升级——不只是功能正确,还要视觉专业、交互流畅。
过去,只有大公司才有专职设计师来保证产品的视觉品质。naksha 通过将设计专家知识结构化,第一次让独立开发者、小团队也能在代码层面获得专业级的设计指导。这是一场「设计平权」运动。
从增长数据看,项目 2026 年 3 月发布 v1.0,到 6 月已迭代至 v5.1.1,3 个月内 Star 从 0 增至 293,62 条命令从最初十几条翻了几倍。v5.1 新增的 /design-reel 功能还把设计过程本身变成了一种可分享的内容形式——设计师可以录制 AI 设计自己界面的过程,发到社交媒体展示技术栈。
如果你经常需要在 AI 编程工具里写前端界面,或者你的团队没有专职设计师,naksha-studio 值得一试。