[自荐] 本来只想让 Figma 稿动起来，最后做了个带光追的 3D 编辑器
各位 V 友，来打个广告，介绍一下我做的 Layer3D。
如果你给自己的产品做过宣传素材，可能经历过这种需求膨胀：
最开始只想让界面动一下。后来觉得，有点立体感更好。再后来想让镜头绕过去，Logo 厚一点，玻璃透一点，金属亮一点……一张设计稿，最后长成了一个 3D 项目。
Layer3D 就是给这种“再加一点点”的需求做的。
它是一个运行在浏览器里的 3D 设计和动画工具。可以把 Figma 里的设计导进来，继续改文字、形状和图层，再往上加几何、材质、灯光、相机和动画，一路做到视频导出。
和 Figma Motion 、Jitter 、Blender 比，位置在哪？
- Figma Motion：稿子就在 Figma 里，顺着把动效和开发交付做了。
- Jitter：快速做出漂亮的二维动效，文字、界面、品牌动画都很对路。
- Blender：完整的 3D 制作工具，能力和深度摆在那里。
- Layer3D：你已经有设计稿，现在想让它变成立体的、能打光的、能运镜的作品。
我想让“会做设计”和“能做 3D 宣传片”之间，少隔几道工序。
最容许我自吹一下的，是光追
做都做了，我把 WebGPU 路径追踪也接了进去。
给 Logo 换上金属，让它映出周围的环境；把形状做成玻璃，让后面的物体透过它发生折射；再让相机转起来，看高光沿着边缘走。
这些细节，恰好就是一段产品动画里让人愿意多看两秒的东西。
给出一些实时的效果，技术都是一键完成，从 figma 导入直接转化。
场景 1 (第一张是 Figma 截图/第二张是 Layer3D 一键生成)
场景 2 (第一张是 Figma 截图/第二张是 Layer3D 一键生成)
底下有渐进采样、自动收敛判断和 OIDN 降噪，动画也能逐帧光追导出。当然，光追要花时间，也需要设备和浏览器支持 WebGPU 。
有点野心地说：
我希望设计师给自己的产品做宣传时，除了录屏，还能有一条做出漂亮 3D 成片的路。
来试试，也欢迎挑刺
产品在这里：**Layer3D**
Figma 导出插件 Figma 插件
如果你手上正好有一个想做成立体动画的 Logo 、一张想拿来发布的产品界面，欢迎试试。
也欢迎把最难用的地方直接甩给我，问题我接着改。
Select Language