ARTICLE DETAIL

建站实战干货

来自一线的建站与推广经验沉淀,每一条都经过真实交付验证。

Superpowers实战指南:浏览器中的多人实时协作开发环境

2026/10/8 5:20:51 拓冰建站 浏览量
Superpowers实战指南:浏览器中的多人实时协作开发环境 Superpowers 这个项目乍一看名字起得挺“中二”但用下来是真没辜负这个称号。它是一个开源的、协作式的实时开发环境专门用来做 Web 游戏和交互式应用。我用它折腾了大半年从一个人写小原型到和两个朋友远程一起开发一个小解谜游戏整个过程最大的感受就是这玩意儿把“团队一起改代码”的体验做得极其顺滑而且完全跑在浏览器里连本地 IDE 都不用装。如果你对 “多人实时协作开发” 这个概念感兴趣或者正想找一个轻量、能直接上手做 3D/2D 实验环境那 Superpowers 值得你花一个下午试试。我最初看到“Superpowers”这个搜索词时以为又是一个什么“超级能力”的营销套件后来才发现它其实是一个基于 Node.js 和 Web 技术的开源项目。它解决的问题很实在传统游戏开发里策划、美术、程序各用各的工具改一版同步一次沟通成本极高。Superpowers 把服务端跑在本机或者局域网内所有人通过浏览器打开同一个地址就能看到同一个项目实时看到对方的操作和代码改动。服务器挂了没关系它内置了版本管理。代码冲突它有合并机制。对于小团队和独立开发者来说这套东西比 Git 加 Trello 再加一堆沟通工具的链路要轻得多。这篇文章我会从零开始带着你完整走一遍 Superpowers 的安装、配置、上手实操以及我踩过的一些坑。就算你之前没写过任何一行代码只要会打开终端也能把这个环境跑起来。1. 项目概览与核心亮点1.1 Superpowers 到底是什么Superpowers 不是一个游戏引擎也算不上一个完整的“游戏制作套件”。更准确地说它是一个自托管的协作式开发环境。你可以把它理解成“带版本的、可多人同时编辑的 3D 场景编辑器加代码编辑器”。它内置了脚本系统脚本语言是 TypeScript底层渲染基于 Three.js还集成了纹理处理、模型导入、音频管理和可视化编辑功能。它有几个非常鲜明的标签开源免费整个项目代码都在 GitHub 上MIT 许可证你可以随意下载、修改、商用。Web 优先客户端就是一个浏览器页面不需要安装任何插件或额外软件Chrome、Firefox、Edge 都能跑。实时协作这是它最核心的卖点。多人同时打开同一个项目后每个人都能实时看到其他人的光标、代码改动和场景操作。你改一行代码我这边几乎无延迟地看到高亮变化。内置服务端它不只是一个编辑器还自带了一个小型服务端负责项目文件的管理、版本快照、用户权限控制和实时同步。我之所以说它“解决实际问题”是因为在传统工作流里你要先把代码推到仓库再让同事拉下来合作改同一个文件时会疯狂冲突。Superpowers 的协作模型有点类似 Google Docs但它针对的是代码和 3D 场景对象这个体验在开源工具里非常少见。1.2 适合谁用不适合谁用先说适合的人群独立游戏开发者一个人想快速验证一个玩法原型不想搭一整套 Unity/Unreal 工程Superpowers 十分钟就能把场景和脚本跑起来。小团队协作开发3~5 人的小团队需要美术和程序在同一个场景里实时配合。美术调整一个模型位置程序这边立刻能看到沟通成本直接砍半。Web 技术学习者想学习 Three.js、TypeScript 或者游戏开发基础的人用 Superpowers 可以省去配置构建工具的烦恼直接用浏览器上手写代码。培训班和在线教育老师开一个本地服务学生通过局域网访问同一个项目可以实时看到老师的演示操作也可以提交自己的修改。不适合的场景也很明显如果你做的是大型商业游戏需要高性能渲染、复杂的光照烘焙、资源热更、原生平台发布那 Superpowers 目前的能力范围撑不起来。如果你习惯用 VSCode 或 JetBrains 全家桶并且对现有 IDE 的插件生态依赖很强使用 Superpowers 内置的代码编辑器会感觉“太朴素”。如果团队已经有一套成熟的 Git 工作流和 CI/CDSuperpowers 的版本管理功能只能算锦上添花替代不了完整的工程化体系。我自己现在用它做两件事一是快速生成一些交互式网页原型二是当做一个“远程结对编程”工具。偶尔写文章需要配一个动态示意我也会用 Superpowers 搭一个简单场景导出到浏览器里演示。2. 环境准备与安装前的关键选择2.1 为什么需要 Node.js以及其他环境要求Superpowers 的服务端是 Node.js 写的所以安装它的前提是先装好 Node.js。我遇到过一些朋友上来就跳过 Node.js 去装 Superpowers最后卡在某一步怎么都跑不起来。这里必须说清楚Superpowers 不是那种“下载解压双击就能用”的绿色软件它需要 Node.js 运行时提供底层支持。我推荐你安装 Node.js 的最新 LTS 版本目前是 20.x 左右。为什么强调 LTS因为 Superpowers 这类开源项目的依赖包更新速度跟不上 Node.js 的版本迭代用奇数版本或者最新 Current 版本容易碰到原生模块编译不兼容的问题。LTS 版本意味着 API 稳定生态兼容性做得好踩坑概率最小。除了 Node.js还需要一个能跑终端的操作系统环境。Windows 上我是用的 PowerShellmacOS 和 Linux 上因为自带 bash/zsh直接开终端就完事。我试过在 Windows 7 和较早的 macOS 系统上跑均以失败告终因为它们自带的 TLS 库和新版 Node.js 不兼容。所以建议系统尽可能保持在近五年的版本之内。另外Superpowers 默认通过局域网提供服务所以如果你和远程小伙伴协作需要保证服务端所在的电脑有可用的网络。单机使用的话即使离线也能正常运行这一点很友好。2.2 安装方式的选择命令行全局安装还是下载桌面版Superpowers 官方提供了两种安装路径一种是通过 npm 全局安装命令行工具另一种是直接下载打包好的桌面客户端。我个人的建议是如果你会用终端优先选择命令行安装如果你实在不习惯命令行可以下载官方提供的桌面发行版但后续升级项目会比较麻烦。命令行安装的好处是一切操作都在终端里升级只需要一个npm install -g命令而且方便和脚本集成。桌面版的好处是装完就是完整的图形界面但对网络要求相对较高因为它本质上仍然是启动了一个本地服务再打开浏览器只是加了一层壳。我使用的是命令行方式下面所有步骤都以它为准。如果你用的是桌面版操作逻辑基本上是一致的只是启动入口不同。在开始之前请先确认 Node.js 是否装好。打开终端输入node -v npm -v如果能正常输出版本号说明 Node.js 环境就绪。如果提示找不到命令那就需要先安装 Node.js。Windows 用户可以在 nodejs.org 下载.msi安装包macOS 用户可以下载.pkg安装包Linux 用户建议用nvm安装避免直接改系统目录。我自己的实测环境是 Ubuntu 22.04 Node.js 20.11 npm 10.2全程没有遇到额外依赖问题。Windows 11 环境下我也跑通了一遍没有任何差异。macOS 的话如果你用的是 M 系列芯片需要注意安装包是否包含 x64/arm64 兼容层如果 npm 报Cannot find module之类的错误大概率是架构不匹配切换终端执行arch -arm64 npm或arch -x86_64 npm可以解决。2.3 全局安装命令的坑与权限问题在终端执行npm install -g superpowers-cli注意如果你用的是 macOS 或 Linux这条命令可能会因为权限不足而报错。npm 默认的全局安装路径是/usr/lib/node_modules或/usr/local/lib/node_modules普通用户没有写权限。我见过很多人卡在这一步解决方案有两种第一种修改 npm 全局路径到你自己的用户目录下这是最推荐的方式。命令如下mkdir -p ~/.npm-global npm config set prefix ~/.npm-global echo export PATH~/.npm-global/bin:$PATH ~/.bashrc source ~/.bashrc之后再次执行npm install -g superpowers-cli就不会有权限问题了。Windows 下通常在安装 Node.js 时已经配置好了全局路径很少遇到权限限制。第二种用sudo强行安装。虽然能用但不太推荐因为后续你通过npm安装其他全局包时还可能遇到同样问题而且 sudo 安装的全局包如果版本跟系统自带模块冲突排查起来更麻烦。安装完成后验证一下superpowers --version如果能输出版本号恭喜工具本体已经就位。如果你的 npm 源是默认的官方源安装过程一般很顺。如果用了淘宝镜像或者其他私有源可能会拉到一个过旧或者被篡改的包建议安装完先检查版本再决定要不要继续用那个源。3. 项目初始化与启动流程3.1 初始化一个空白项目用命令行工具创建一个新项目。命令如下superpowers start --create demo-project实际运行后它会问你一些基本配置比如项目名称、端口号、最大协作人数等。我建议第一选择保持默认直接回车等熟悉了再自定义。这个命令会自动完成以下事情创建一个包含server、client、data、settings等目录的项目骨架。生成一个默认配置文件和静态资源目录。在本地启动一个服务端并监听一个端口默认是 8080。如果你只想启动一个已经存在的项目去掉--create参数直接进到项目目录运行superpowers start这个命令会读取你当前目录下的项目配置并启动。这个设计很人性化每个项目就是一个普通文件夹可以用 Git 管理也可以压缩打包带走。启动成功后终端通常会输出一段提示类似Superpowers is running at http://localhost:8080此时不要关闭终端打开浏览器直接访问这个地址即可。3.2 端口被占用怎么办默认端口 8080 很容易被其他程序占用。我自己就遇到过 Jenkins、Hugo 等工具占用了这个端口。如果启动时提示EADDRINUSE说明端口冲突。解决办法是用--port参数指定一个新端口superpowers start --port 8081或者也可以修改项目配置里的端口选项。我个人的习惯是把端口固定到9471这种偏门数字不容易冲突。启动后访问http://localhost:9471就能打开了。还有一个容易忽略的问题如果你在服务器上启动了 Superpowers浏览器访问的是服务器的公网 IP而不是localhost。这时候需要注意防火墙和安全组是否放行了对应端口。云服务器用户尤其容易卡这一步。本地调试就不需要管。3.3 浏览器端登录与权限认证第一次访问项目地址时Superpowers 会要求你输入用户名和密码。默认情况下如果你是在创建项目的电脑上访问会有一次“管理员”级别的登录入口。官方文档里说初始超级管理员密码是admin但我实测下来不同版本可能不一样。如果你打开页面发现默认密码不对去项目目录下的data/config.json或环境变量里查看初始账号信息。登录成功后你看到的是整个项目的管理面板。里面会有用户列表和管理按钮。已打开项目的实时会话列表。服务器状态信息CPU、内存、连接数。项目设置入口修改名称、端口、密钥等。把项目地址分享给同事后对方只需要在浏览器打开同一个地址用自己的用户名密码登录就能加入会话。如果你不希望陌生人加入可以在项目管理器里关闭“允许公共注册”只保留预置的邀请账号。3.4 局域网与远程协作的连接细节如果你和同事在同一个局域网直接让同事访问http://你的局域网IP:8080就行。怎么查局域网 IPWindows 用ipconfigmacOS 用ifconfigLinux 用ip addr。找到类似192.168.x.x的地址替换掉localhost即可。如果不在同一个网络但不想走公网可以使用内网穿透工具把 8080 端口暴露到一个临时的公网域名。我之前用过 ngrok、Tailscale也用过 frp 自建隧道。需要注意Superpowers 的实时协作依赖 WebSocket穿透工具必须能支持 WebSocket 长连接否则别人的浏览器只读到静态页面却连不上协作服务器。ngrok 默认支持得很好Tailscale 由于是组内局域网转发也不会有问题。我还试过把 Superpowers 部署在低配云服务器上用来做远程演示。效果很好但要注意服务器的带宽如果同时有 5 个人协作每个人每秒都会传输场景变化数据带宽太小的 VPS 会明显卡顿。我的建议是5 人以内协作带宽至少 10Mbps 起10 人以上最好 50Mbps 以上。4. 创建第一个场景从编辑器到代码4.1 编辑器界面布局当你登录项目后会进入一个类似 IDE 的工作区。整体布局可以分成几个区域左侧是资源树和项目文件树中间是场景编辑视口右侧是属性编辑器底部是代码编辑器和日志输出。这个布局是 Superpowers 经过多年迭代定型下来的很符合游戏开发者的习惯。资源树里可以看到模型、纹理、声音、脚本等资源双击一个 .ts 脚本文件就能在底部打开代码编辑器。中间的场景视口支持视角旋转、缩放、平移也支持直接用鼠标拖动场景里的对象。右侧属性编辑器会显示当前选中对象的组件列表比如变换、光照、碰撞器等。一开始接触这个界面可能觉得有点简陋不如 Unity 和 Unreal 华丽。但它胜在轻量和统一。你不需要来回切换多个软件所有资源都在同一个页面上。而且它支持多标签页可以同时打开多个代码文件。4.2 创建一个简单的旋转立方体我们先做一个最经典的原型一个自动旋转的立方体。这个流程能帮你理解 Superpowers 的“实体组件”数据模型以及它与代码的联动方式。第一步在顶部菜单找到“创建实体(Create Entity)”按钮在场景中创建一个空实体。或者使用快捷键我印象中是Shift A可以弹出创建菜单。选择“Cube”。第二步你会看到场景视口里出现一个灰色的立方体。默认情况下它会带有一个“渲染组件(Renderer Component)”和“变换组件(Transform Component)”。“变换组件”决定实体在场景中的位置、缩放和旋转“渲染组件”决定它怎么显示。第三步给这个立方体挂上一个“行为组件(Behavior)”也就是脚本。在资源树里新建一个 TypeScript 脚本命名为Rotate.ts然后双击打开代码编辑器。默认生成的脚本大概是这样的import { ScriptBehavior } from superpowers; export class Rotate extends ScriptBehavior { // 在这里编写脚本逻辑 }我们稍微改一下代码让实体不断地绕 Y 轴旋转import { ScriptBehavior } from superpowers; export class Rotate extends ScriptBehavior { private speed 60; // 每秒旋转度数 onUpdate(delta: number) { this.entity.setLocalRotationY( this.entity.getLocalRotationY() this.speed * delta ); } }保存代码后回到场景视口你会看到立方体已经开始动了。这就是 Superpowers 的“热更新”能力保存脚本的瞬间所有在线用户的场景都会同步更新不需要重启服务也不需要刷新页面。我在代码里用了onUpdate这个生命周期方法它会在每一帧被调用参数delta是距离上一次调用经过的秒数。用帧率无关的方式来累加旋转角度这样在不同机器上旋转速度保持一致。这里我想特别提一下 TypeScript 的类继承写法。如果你没写过 TypeScript第一眼可能有点懵。其实你只需要记住extends ScriptBehavior表示这个类不是普通的数据类而是挂载到实体上的“行为”。Superpowers 会为每个行为组件实例化出一个独立的类对象。你在类里面定义的公开字段还能直接出现在右侧属性编辑器里方便你在可视化界面里调整参数。这个特性很实用。4.3 从脚本里克隆实体与操作场景除了让已有的实体动起来Superpowers 的脚本 API 还支持动态创建和删除实体。这在你做射击游戏、粒子效果或者随机生成关卡时非常常用。举个例子我想要每隔一秒在随机位置生成一个小球。继续在代码里实现import { ScriptBehavior, Entity } from superpowers; export class Spawner extends ScriptBehavior { private timer 0; onUpdate(delta: number) { this.timer delta; if (this.timer 1) { this.timer 0; // 创建一个新的实体 const sphere new Entity(this.entity.scene, Sphere, { position: [Math.random() * 10 - 5, 5, Math.random() * 10 - 5] }); // 为实体添加渲染组件 sphere.addComponent(Renderer, { material: standard, color: [1, 0, 0] }); // 为实体添加一个脚本组件 sphere.addComponent(Behavior, { class: ballScript }); } } }当然前提是你得有一个名为ballScript的脚本类并把它作为全局可访问的类。Superpowers 的机制是把项目脚本编译成模块然后在实体组件里按名字引用。这种动态创建设计让我想起了很多传统引擎的Instantiate方法只不过它用的是 Web 标准的 Entity 和 Component 模型。我在实际操作中很少直接在代码里写死坐标更多是通过编辑器把预制体Prefab创建好然后在代码里调用“克隆实体”的方法。这样可以避免大量重复的组件配置代码。4.4 烘焙场景与导出 Web 页面做完一个小场景后你可能希望能把它嵌入到自己的网页里或者干脆导出一个独立的 HTML 文件。Superpowers 提供了“导出”功能可以把整个项目打包成一套静态资源部署到任何静态服务器上。导出步骤很简单在项目管理界面找到“导出(Export)”选项选择导出格式。通常会有两种选择导出为可部署的 Web 应用包含所有资源和脚本压缩成一个 ZIP。导出为单一 HTML 文件适合快速演示和分享。我推荐用前者因为后者虽然方便但体积太大时加载会变慢。导出完成后把 ZIP 解压放到 Nginx 或 GitHub Pages 上就能直接访问。如果你想离线保存一个 Demo导出一个 HTML 发过去就完事。我实际用导出功能做过一个交互式产品展示页放在服务器上手机扫码就能打开场景并且操作。相比用 Three.js 从零写一个展示页面Superpowers 帮我省掉了大量样板代码。5. 常见问题排查与避坑指南5.1 启动失败与依赖错误下面是几个我经常在交流群里看到的问题按出现频率排序现象可能原因解决办法执行superpowers提示 command not foundnpm 全局路径没配置好检查~/.npm-global/bin是否加入 PATH或确认安装了 superpowers-cli启动时提示Cannot find module xyz全局包的依赖损坏或 Node 版本不兼容执行npm install -g superpowers-cli --force重装或切换到 Node LTS 版本启动时提示Missing package.json当前目录不是有效项目目录先执行superpowers start --create myproject创建项目再进入项目目录启动打开页面显示白屏控制台有 WebSocket 错误端口被防火墙或代理拦截确认防火墙放行端口如果使用代理关闭代理或将 localhost 加入代理排除多个用户同时打开没有看到实时光标浏览器不支持 WebSocket 或协作被禁用换 Chrome/Edge/Firefox 最新版检查服务端是否处于协作模式控制台频繁输出Failed to upload texture纹理文件格式不支持或路径错误使用 PNG/JPG且文件大小尽量控制在 512KB 以内5.2 版本管理没有 Git 也能后悔很多人不知道 Superpowers 内置了一个版本管理功能。它会在服务端对项目文件做快照你可以随时回到之前的某个版本。这个功能在项目开发初期非常救命。在管理面板里找到“历史记录(History)”标签页会看到时间轴上的快照列表。可以查看每个快照的改动文件也可以一键恢复。我建议你在每次完成一个可运行节点时手动创建一个快照命名成“v0.1-基础场景”“v0.2-加入交互”这样的风格。这样即使后面改坏了也能精准回退。但要注意这个内部版本管理不等同于 Git。它不会保存分支也不会跨项目共享。如果你需要长期维护还是建议在项目文件夹内运行git init把项目代码纳入 Git 管理。Superpowers 的项目文件夹是一个标准的 Web 项目结构Git 完全兼容。我之前用内部快照加 Git 双保险开发了两个月也没有混乱。5.3 性能卡顿与资源优化经验Superpowers 在开发阶段很流畅但如果你在场景里放了大量高精度模型和贴图帧率会直线下降。这不是因为引擎不行而是因为默认情况下它会实时同步所有资源到所有在线用户。每个用户打开项目都需要同步整个项目资源。如果项目里有 100MB 的贴图五个人同时连接服务端内存和带宽压力会非常大。我的优化建议是贴图统一压缩到 2048 分辨率以下能用 JPG 的地方别用 PNG。模型尽量用低模导入前用 Blender 简化网格。音频使用压缩格式例如 mp3 或 ogg避免原始 WAV 直接入库。代码里不要每帧创建大量临时对象。onUpdate里频繁new Entity是性能杀手尽量把实体预创建好在需要时隐藏/显示。另外一个很容易被忽略的点如果你只是单机运行看看效果没必要开着浏览器里的 FPS 监视器一直跑。那会把 CPU 占用拉高影响整个操作体验。我一般只在想确认渲染性能时才打开平时都是合上的。5.4 多用户同时编辑的冲突处理Superpowers 虽然主打实时协作但并不是完全没有冲突。如果两个人在同一个脚本文件里同时修改同一行代码系统会尽力做合并但遇到完全冲突的情况它会提示“有人提交了冲突版本”需要你手动选择保留哪一边。我经历过一次很惨烈的现场我和一位朋友同时修改了同一个Player.ts文件里的移动速度常量他改成 5我改成 8结果保存后他的代码被覆盖。后来我们约定了一个简单的协作规则每人在编辑公共脚本前先到团队通讯软件里喊一声“我要动 Player.ts 了”。修改完马上保存并通知其他人。尽量不要同时在同一个文件里做 20 行以上的修改会把冲突合并搞得很麻烦。当然Superpowers 本身也有“锁文件”的能力可以临时锁定某个文件让别人只读。如果你实在需要独占编辑可以右击文件选择“锁定”。不过这个功能我没怎么用因为锁定后别人看到的是灰色只读状态体验会割裂。5.5 浏览器兼容性移动端能玩吗用 Superpowers 做的项目在浏览器里运行理论上移动端浏览器也能打开。但我实测下来iOS Safari 和部分 Android 内嵌浏览器对 WebGL 的支持不太稳定尤其是有多个 Renderer 组件时偶尔会出现黑屏或贴图闪烁。如果你需要做移动端演示最好先在移动端浏览器里实际测试一下。我在项目里发现 Touch 事件默认会触发页面滚动导致拖动摄像头视角时手一滑就页面上下移动。解决办法是在index.html里加上样式html, body { touch-action: none; overflow: hidden; }这是我的独家小技巧官方文档里没写但实测有效。另一个坑是iOS 的 Safari 对 WebAudio 的自动播放有限制如果你做了背景音乐需要在用户点击屏幕后再初始化音频上下文否则静音无声。6. 从新手到熟练我的使用心得与扩展建议6.1 怎么让 Superpowers 融入你的工作流如果你只把 Superpowers 当做一个“玩具”那确实有点浪费。我个人推荐一种组合用法用 Superpowers 做原型用传统代码库做生产。具体的做法是先用 Superpowers 快速搭出一个可交互的场景测试玩法手感确认没问题后把核心逻辑参数记录下来再用 React/Vue Three.js 或 Unity 去实现正式版本。这样既能享受 Superpowers 的高迭代速度又不会让正式项目受到它框架限制。我自己是用它做“交互验证”例如一个电商产品页面里3D 模型应该怎么旋转、什么角度引导用户能看到最吸引人的视角我先在 Superpowers 里调节导出预览链接发给同事确认后再让前端同事按照这个交互性能去实现。6.2 进一步扩展的几种方向Superpowers 的插件系统可以让你扩展新的资源类型、面板和实体组件。虽然大部分使用者不需要深度定制但了解它的扩展点能让你在遇到瓶颈时知道往哪个方向去解决。比如我写了一个导入 CSV 坐标数据的插件实现了“读取拍卖记录在地图上生成柱状图”的功能。这个插件在 Superpowers 的管理后台注册后新导入的资源类型就会出现。由于项目本身基于 TypeScript插件的 API 文档也相对清晰比起很多闭源工具修改起来方便得多。另外Superpowers 支持导入外部纹理和模型文件。我最常用的流程是在 Blender 里建模、展 UV、烘焙贴图然后导出为.gltf或.obj文件直接拖进 Superpowers 的资源树里。它虽然不会帮你自动转换成引擎原生材质但基础渲染效果已经足够应对大多数原型展示。如果你希望把它变成教学工具也可以搭一个“协作课程”老师准备一个项目模板里面只包含基础的场景学生通过浏览器登录后各自复制一份项目然后修修改改老师通过管理面板能看到所有学生的动态。我在一次线下工作坊中这样做过效果不错学生不用一开始就装一堆工具注意力全部放在代码和玩法上。6.3 写在最后我的切身体会用了这么久Superpowers 给我的最大冲击不是技术本身而是“处于同一时空的协作感”。那种你刚保存一段代码同事马上说出“我看到你的立方体开始旋转了”的即时反馈是传统 Slack 加 Git 流程完全给不了的。它把开发变成了一种更接近共同创作的体验。可能有人会担心它的未来维护问题毕竟这个项目不像大厂产品那样有持续的商业支持。但在我眼里开源恰恰是它的优势你可以把代码库 fork 下来按照自己的需要修修补补。我在本地就维护了一个分支加上了对中文资源文件名的更好支持还顺手改了一个导出资源时 URL 编码不规范的 bug。这种自由度是闭源软件很难提供的。如果你也想尝试我的建议是不要一上来就追求完整大作先照着这篇流程把安装跑通做一个旋转立方体再尝试导入一个模型改改它的颜色。等你习惯了这种“保存即生效”的节奏自然会想到更多可做的事情。Superpowers 不是万能的但在快速原型和多人共研这个细分赛道上它是我目前用过的最顺手的一把锤子。最后分享一个实操细节每次启动服务之前我都会先看一下项目目录下有没有多余的临时文件尤其是系统自动生成缩略图或者日志文件。Superpowers 会把整个项目文件夹同步给所有协作者如果你往项目里拖了一个.zip或者一个几 GB 的视频所有人都要默默下载一遍。保持项目干净是一个合格使用者的基本素养。好了这次就先聊到这里。我用它做了一个内部工具网站现在每天都在浏览器里开着两个项目会话一个自己开发一个给同事查看最新原型。如果你装好之后遇到什么奇怪的问题欢迎按照我上面整理的那张排查表先自查一遍大概率都能解决。如果你折腾出了一个好玩的场景也可以分享出来我很期待看到你用这个“超能力”做出了什么不一样的东西。