PS-MCP
📋 项目简介
PS-MCP 是一个基于 Model Context Protocol (MCP) 的 Photoshop 集成服务器,旨在通过 AI 大模型(如 Claude、GPT 等)实现对 Adobe Photoshop 的智能控制。
本项目目前处于早期开发阶段,核心目标是实现设计稿的智能切图与资源导出,并计划在未来演进为 「设计稿分析 → 智能切图 → UI 代码生成」 的一站式工作流解决方案。
🎯 项目愿景
第一阶段:智能切图(当前重点)
- ✅ 通过自然语言指令控制 Photoshop 导出切片
- ✅ 自动识别设计稿中的图层、组件边界
- ✅ 支持多种格式导出(PNG、JPG、SVG、WebP)
- ✅ 智能命名与资源管理
第二阶段:设计稿解析
- 🔄 图层结构分析与语义理解
- 🔄 颜色、字体、间距等设计规范提取
- 🔄 组件库识别与归类
第三阶段:UI 代码生成
- 📋 基于切图结果生成前端代码(Vue/React/HTML)
- 📋 自动应用设计规范(Tailwind/UnoCSS)
- 📋 实现「设计稿 → 可运行代码」的完整闭环
🏗️ 技术架构
┌─────────────────────────────────────────────────────────────┐
│ AI 大模型 (Claude/GPT) │
└───────────────────────┬─────────────────────────────────────┘
│ MCP Protocol
┌───────────────────────┼─────────────────────────────────────┐
│ ▼ │
│ ┌────────────────┐ │
│ │ PS-MCP Server │ ← 本项目 │
│ │ (Python) │ │
│ └───────┬────────┘ │
│ │ │
│ ┌───────────┴───────────┐ │
│ │ │ │
│ ▼ ▼ │
│ ┌──────────────┐ ┌──────────────┐ │
│ │ Photoshop │ │ Export │ │
│ │ JSX/Script │ │ Assets │ │
│ └──────────────┘ └──────────────┘ │
└─────────────────────────────────────────────────────────────┘
核心技术栈
| 组件 | 技术 | 说明 |
|---|---|---|
| MCP Server | FastMCP | Python MCP 服务端框架 |
| 通信协议 | stdio/sse | 标准输入输出 / HTTP 流 |
| PS 交互 | ExtendScript / UXP | Adobe Photoshop 脚本接口 |
| 构建工具 | uv | 现代 Python 包管理器 |
🚀 快速开始
环境要求
- Python >= 3.14
- Adobe Photoshop 2022 或更高版本
- Claude Desktop / 其他 MCP 客户端
安装
# 克隆仓库
git clone https://github.com/pangxie231/ps-mcp.git
cd ps-mcp
# 使用 uv 安装依赖
uv sync
# 或使用 pip
pip install -e "."
配置 MCP 客户端
在 Claude Desktop 配置文件中添加:
{
"mcpServers": {
"ps-mcp": {
"command": "python",
"args": ["/path/to/ps-mcp/server.py"]
}
}
}
运行
# 开发模式
python server.py
# 或使用 uv
uv run server.py
📊 开发进度
| 功能模块 | 状态 | 说明 |
|---|---|---|
| MCP 服务框架 | ✅ | 基础服务搭建完成 |
| 工具注册 | ✅ | 测试工具可用 |
| PS 连接层 | 🚧 | 开发中... |
| 切图功能 | 📋 | 计划中 |
| 图层分析 | 📋 | 计划中 |
| UI 生成 | 📋 | 计划中 |
图例: ✅ 已完成 | 🚧 进行中 | 📋 计划中
🔧 可用工具
⚠️ 注意:以下工具列表将随开发进度持续更新
基础工具
| 工具名 | 描述 | 参数 |
|---|---|---|
hello |
测试连接 | 无 |
🤝 参与贡献
本项目欢迎贡献!由于处于早期阶段,API 和架构可能会有较大变动,建议先通过 Issue 讨论后再提交 PR。
贡献流程
- Fork 本仓库
- 创建功能分支 (
git checkout -b feature/amazing-feature) - 提交更改 (
git commit -m 'feat: add some amazing feature') - 推送分支 (
git push origin feature/amazing-feature) - 创建 Pull Request
📝 开发计划
近期目标 (v0.2.0)
- 实现 Photoshop 基础连接
- 添加图层信息获取工具
- 实现简单切片导出功能
中期目标 (v0.5.0)
- 智能组件识别
- 批量切图导出
- 设计规范提取
远期目标 (v1.0.0)
- UI 代码生成(支持 Vue/React)
- 完整的设计到代码工作流
- 插件生态支持
📄 许可证
MIT © 2026 ps-mcp Contributors
⚠️ 免责声明:本项目目前处于早期开发阶段,API 可能不稳定,不建议用于生产环境。
Made with ❤️ for better design-to-code workflow