裂隙 Rift

对着摄像头，用双手把眼前的现实像纸一样撕开，裂缝后面是一整个粒子宇宙。 捏住画面里的一样真东西（猫、杯子、你自己），把它从现实里抠下来，变成一团粒子；甩出屏幕边缘，它会从朋友的手机里飞出来。

在线玩：https://sovven.github.io/rift/

玩法

手势	触屏	作用
双手捏住，往两边拉	两根手指按住，往两边拉	撕开现实
单手捏住一样东西	长按一样东西	把它从画面里抠出来
捏着它移动，松手时用力一甩	拖着它，甩出去	扔出去；甩出屏幕边缘就是投送
捏着它握拳，再张开	拖着它，另一根手指点一下	捏碎
把它放回原处	同左	它回到现实里，洞会愈合
两只手掌张开，慢慢合拢	点「愈合」	裂缝愈合
双手比心	撕开一大片后轻点	爱心 / 揭开藏起来的信

• 投送：两台设备在「投送」里输入同一个四位房间号，就能隔空互扔东西（WebRTC 点对点，用 PeerJS 公共信令服务）。
• 写信：写一句话生成链接，对方要撕开自己房间的画面才能看到裂缝后面的字。文字只存在链接里。
• 录制：录 10 秒视频，手机上可以直接分享。
• 换现实：没有摄像头时可以上传一张照片来撕。

隐私

手部识别和抠图都在浏览器里完成（MediaPipe），摄像头画面不会上传。投送时只发送被抠出来的那一小块图片，直接发给房间里的另一台设备。

本地运行

node tools/serve.mjs

然后打开 http://localhost:5197 。摄像头需要 https 或 localhost。

技术

• 渲染：Three.js，全屏着色器合成「现实 / 撕纸边 / 宇宙」，CPU 模拟 + GPU 绘制粒子
• 手部识别：MediaPipe Hand Landmarker
• 抠图：MediaPipe Interactive Segmenter（magic touch）
• 投送：PeerJS
• 所有依赖和模型都放在仓库里（vendor/、models/），不依赖外部 CDN

模型来自 Google MediaPipe（Apache 2.0）。