甲板管
代理优先的幻灯片渲染引擎。 代理将每张幻灯片编写为HTML/CSS/JS;deckpipe将其渲染在一个沙盒1920×1080阴影根中,通过甲板级CSS变量对其进行主题化,为每个甲板提供一个可共享的查看器URL,并支持协作者的线程评论。
- 主办单位: deckpipe.dev
- 远程MCP:
https://deckpipe.dev/mcp(流式HTTP) - MCP 工作站 :
npx deckpipe-mcp
______________________________________________________________________
运作原理
一位代理人打来电话 create_deck 每张幻灯片使用HTML、CSS和(可选)JS:
{
"title": "Q2 Launch",
"head": [
{ "tag": "link", "attrs": { "rel": "stylesheet", "href": "https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400&display=swap" } }
],
"stylesheet": ".hero { font-family: 'Fraunces', serif; font-size: 128px; color: #0f172a; }",
"slides": [
{
"layout": "canvas",
"content": {
"html": "
Q2 launch
",
"js": "slide.querySelector('h1').animate([{opacity:0},{opacity:1}], 600);"
}
}
]
}每个滑块安装在一个 打开阴影根,所以CSS是自动作用域的——没有BEM,没有类前缀。甲板层 stylesheet 每张幻灯片都采用了这种设计方法,因此一次编写的设计系统随处可见。通过加载字体 head 条目并在样式表中引用它们。
审阅者打开查看器URL,可以对以下内容发表评论 任何DOM元素 (通过自动锚定 data-dp-anchor 用于跨编辑的稳定性)。代理通过MCP读取这些评论,编辑甲板并回复——这是一个完整的协作循环,无需人类接触JSON。
deckpipe.dev上的托管实例是免费且未经身份验证的——甲板由不可访问的ID寻址。您还可以自托管整个堆栈。
用它
来自Claude.ai/克劳德桌面/任何可流式传输的HTTP MCP客户端
添加 https://deckpipe.dev/mcp 作为定制的远程MCP服务器。没有身份验证。
来自克劳德代码(当地标准)
claude mcp add deckpipe -- npx deckpipe-mcp手动MCP配置
{
"mcpServers": {
"deckpipe": {
"command": "npx",
"args": ["-y", "deckpipe-mcp"]
}
}
}然后让代理人“围绕X构建一个甲板”。代理会返回一个您可以打开并评论的查看器URL。
你的代理人的技能
MCP INSTRUCTIONS 你的代理人故意收得太紧。更丰富的设计指导——简短的澄清问题、密度规则、参考样式备忘单、布局安全模式、创建后溢出扫描——都存在于 开放式代理技能.
阅读: ****
使用开放代理技能CLI进行安装(适用于Claude Code、Codex、Cursor、Windsurf、Cline、Roo等):
npx skills add bjoern2000/deckpipe手动安装(克劳德代码):
mkdir -p ~/.claude/skills/deckpipe-design
curl -o ~/.claude/skills/deckpipe-design/SKILL.md https://deckpipe.dev/skill.md规范源代码位于此仓库中 .claude/skills/deckpipe-design/SKILL.md.
自托管
git clone https://github.com/bjoern2000/deckpipe
cd deckpipe
npm install
cp .env.example .env # set DATABASE_URL, PORT, IMAGE_STORAGE_PATH, etc.
npm run db:migrate # apply SQL migrations (local Postgres)
npm run dev # API on :3010, viewer on :5173
npm run build # production builds for all packages将您的MCP客户端指向 http://localhost:3010/mcp,或使用以下命令运行stdio垫片 DECKPIPE_API_URL=http://localhost:3010 npx deckpipe-mcp.
建筑
这是一个单一的Node.js/TypeScript单仓库(npm workspaces)。五个包:
| 包装 | 什么 |
|---|---|
packages/shared | Zod模式、类型、ID生成器。数据模型的真实来源。 |
packages/mcp-core | MCP工具定义(registerTools, INSTRUCTIONS).由两个MCP传输导入——单一的真相来源。 |
packages/api | 上的Express REST API /v1/* 加上远程MCP传输 /mcpPostgreSQL与JSONB。 |
packages/viewer | Lit web组件。将画布幻灯片渲染为阴影根,处理编辑模式、评论覆盖、演示者/打印模式。 |
packages/mcp | 独立npm包 deckpipe-mcp --用于本地代理的stdio+HTTP传输。纯运输管道,呼叫 mcp-core. |
工具(MCP):
| 工具 | 说明 |
|---|---|
create_deck | 创建一个新的组,获取一个可共享的查看器URL |
get_deck | 阅读甲板状态,包括开放评论。 |
update_deck | 编辑幻灯片内容,重组幻灯片,更改主题。 |
delete_deck | 永久删除甲板。 |
upload_image | 上传base64 PNG/JPG/WebP,获取托管URL |
search_images | Unsplash搜索,自动归因+下载跟踪。 |
preview_slide | 渲染一张瞬态幻灯片(无持久性),并返回屏幕截图+渲染报告。 |
get_slide_screenshot | 渲染现有幻灯片组的特定幻灯片。已缓存 updated_at. |
list_layouts | 描述画布布局和甲板级主题选项。 |
list_comments | 在甲板上列出评论(按状态、幻灯片、时间戳过滤)。 |
reply_to_comment | 回复评论帖子。 |
resolve_comment | 将评论标记为已解决。 |
布局说明:甲板管0.2有25个模板布局(title_and_bullets, stats, swot等等)。它们现在已被新内容弃用-- canvas 是MCP宣传的唯一布局。使用模板布局的现有甲板仍然保持不变,模式仍然接受它们。看 CLAUDE.md → "Resurrecting deprecated layouts" 用于在MCP表面上重新启用它们的步骤。
贡献
欢迎问题和拉取请求。在发送实质性更改之前,请打开一个问题来讨论该方法。
许可证
麻省理工学院 --商业化使用、修改、分叉、托管和运输。
“甲板管”是一个单独持有的商标。叉子必须重命名。
版权所有©2026 Björn Schefzyk。
