项目简介

QBIC (Multi-Agent Programming Across Creative Tools) 是一个下一代智能体编排框架，它利用 Model Context Protocol (MCP) 使LLM智能体能够实时控制和协调跨创意和技术工具（如 Figma, IDEs）的行动。QBIC通过MCP协议层连接不同的工具，使智能体能够查询上下文、修改内容以及触发多步操作，从而实现自然语言驱动的工作流程。

主要功能点

跨应用智能体编排: 无缝连接智能体到 Figma、IDE 等工具，无需手动GUI交互即可触发上下文感知的操作。
自然语言到系统执行: 将对话指令解析为结构化操作，通过可组合的工具创建或修改内容（例如 UI、代码）。
模块化 MCP 工具接口: 通过 MCP 将每个工具暴露为声明式命令接口，定义任务、内省点、创建工具和响应钩子。
丰富的Figma操作工具: 提供多种与Figma交互的能力，包括获取文档信息、选择、节点详情，创建矩形/文本/框架，设置颜色、位置、尺寸，删除节点，导出图像，设置圆角，扫描/设置文本内容，获取/设置批注，扫描特定类型节点，设置自动布局属性（模式、间距、对齐、尺寸），以及处理原型连接（获取反应、设置默认连接线、创建连接线）。

安装步骤

安装 Bun (一个快速的JavaScript/TypeScript运行时，类似于 Node.js):

curl -fsSL https://bun.sh/install | bash

克隆 QBIC 仓库并进入目录。
安装项目依赖并运行设置脚本：
```
bun install
bun setup
```
'bun setup' 可能会注册 QBIC 到您使用的 MCP 客户端（如 Cursor）的配置中。

MCP 服务器配置 (供 MCP 客户端使用)

QBIC MCP 服务器通过标准输入/输出 (Stdio) 与 MCP 客户端通信。要将 QBIC 配置到您的 MCP 客户端中，您需要提供启动 MCP 服务器的命令和参数。

以下是一个示例 JSON 配置结构（具体配置方式请参考您的 MCP 客户端文档）：

{
  "name": "QBIC Figma MCP",
  "description": "MCP server to control Figma via QBIC framework",
  "command": "bunx",
  "args": ["qbic-mcp"],
  "environment": {
    // 可选: 如果需要指定WebSocket服务器地址 (默认为 ws://localhost:3055)，请在这里设置
    // "QBIC_SERVER_URL": "wss://your_server_address"
  }
}

'name': 显示在 MCP 客户端中的服务器名称。
'description': 服务器功能的简要描述。
'command': 执行 QBIC MCP 服务器的可执行文件或命令。'bunx' 用于直接运行 'node_modules/.bin' 中的脚本。
'args': 传递给命令的参数。'qbic-mcp' 是启动 MCP 服务器的脚本名称。
'environment': 可选的环境变量。'QBIC_SERVER_URL' 可用于配置 MCP 服务器连接到的 WebSocket Hub 地址，如果 WebSocket Hub 运行在非默认地址或需要使用 WSS。

基本使用方法

确保您已按照安装步骤完成安装。
启动 WebSocket Hub（默认端口 3055）：
```
bun socket
```
启动 MCP 服务器（使用之前生成的 Stdio 配置，由您的 MCP 客户端运行）：
```
bunx qbic-mcp
```
MCP 服务器启动后，会尝试连接到 WebSocket Hub。
在 Figma 中加载 QBIC 插件 ('src/cursor_mcp_plugin/manifest.json')，并确保插件中的 WebSocket 设置与启动的 WebSocket Hub 地址一致。
在您的 MCP 客户端（例如 Cursor AI 助手）中，确保已配置并连接到 QBIC MCP 服务器。
现在，您可以通过自然语言向 MCP 客户端发送指令，客户端将通过 MCP 协议调用 QBIC 服务器暴露的工具来控制 Figma。例如，您可以尝试发送 "create a blue rectangle" 或 "scan all text nodes in this frame"。

关键词

信息