所以最近我们做了一个小实验：用 3D 粒子效果 把核心信息“动起来”，再用 手势交互 把它变成一支“能玩”的视频广告（顺便也当作一个可复用的互动落地页模板）。

这篇文章会放出试玩链接和源代码，欢迎你来体验、Fork、改造；如果你也在做产品宣传/作品集展示，希望它能给你一些灵感。

先看效果（视频）

相关链接（先放最重要的）：

• AI 简历构建器：https://viberx360.com
• 手势互动广告源代码：https://hiwifi.denq.us:8418/AIStudio/viberx-app

这支广告想传达什么？

• 一句话：用最“上头”的方式告诉你 —— 来 viberx360.com 把你的简历做成一个更像作品集的网站。
• 两件事：它既是视频广告，也是一个小游戏入口；看完想玩、玩完想试产品。

去哪里试玩？

• 试玩链接（手势互动/小游戏）：先卖个关子——我会把试玩地址放在评论区置顶
• 直接体验 AI 简历构建器：https://viberx360.com

如果你对这个互动广告/小游戏感兴趣，欢迎在评论区留言（比如你想要的交互玩法、你想复刻成什么主题）。我会在评论区更新试玩链接，并持续迭代。

如果试玩页面需要摄像头来做手势识别，请在浏览器弹窗里允许访问摄像头；我们建议优先使用桌面 Chrome。

这到底是个什么“游戏”？

核心玩法很简单：

1. 屏幕中心是一团 3D 粒子（会不断聚合/发散出不同的形态）
2. 右上角是手势识别预览画面（提示 Hand Tracking Active）
3. 你用手势做“推/拉/抓取/旋转”（具体以页面说明为准），粒子会做出对应反馈
4. 最后它会把视线引导到 viberx360.com：如果你对这种“更有表达力”的呈现方式有感觉，欢迎来把自己的简历也做成一个可分享的页面

手势互动广告源代码

• 源码仓库：https://hiwifi.denq.us:8418/AIStudio/viberx-app
• 快速运行：见仓库 README（我会补一条最短命令）

等我把代码开源出来后，这里会包含：

• 一键启动的本地开发命令
• 关键参数说明（粒子数量、阈值、交互强度、性能档位）
• 可替换素材的位置（文案、Logo、视频叠层等）

做这个项目时踩过的坑（简版）

• 性能：粒子数量上来后，移动端会明显掉帧；我们会提供低配档位。
• 光照/背景：摄像头画面和前景粒子叠加时，要小心对比度与可读性。
• 手势稳定性：不同环境光和手势距离会影响识别；需要做阈值与平滑处理。

如果你想复刻/改造

你可以把它当成一个“可复用的互动广告模板”：

• 换文案与颜色，做成你的产品广告
• 换成你自己的粒子模型/Logo
• 把交互改成小游戏关卡（比如限定时间内把粒子“拼”成某个形状）

如果你做出了有趣的版本，欢迎把链接发给我们，我们会挑选一些作品放到后续文章里展示。