粒影 Particle Studio：从可拨动的照片，到能带走的动效卡

照片变成粒子之后，能留下什么

粒影最初的目标很直观：把一张照片变成可以拨动的粒子。静止时尽量保留照片的主体和原色，按住鼠标时让颗粒柔和地散开，松手后有弹性地归位。

但做出互动效果后，另一个问题变得更重要：玩过一次之后，为什么还要打开它？能旋转、能拨散、参数很多，都不能自动成为持续使用的理由。

因此，粒影开始往照片动效卡的方向整理。使用者可以放进一张照片和一句标题，选一个完整模板，加入本地音乐，再带走一段人物介绍、动态封面或祝福短片。互动工作台仍然保留，创作的终点变得更明确。

这次转向还没有被真实用户的长期使用证明。V0.1 完成的是一条可实际走通的制作与交付流程；它是否值得重复使用，需要从别人愿不愿意用自己的照片做第二份作品来判断。

现在可以直接打开粒影试用，也可以先看中文图文使用手册。

先让照片站得住，再谈粒子有多炫

照片粒子效果很容易在演示图里成立，却在普通人像里暴露问题：颗粒太小会漏出空隙，太大又会糊掉眼睛和发丝；错误的颜色转换还会让肤色看起来不对。

粒影的纯粒子模式没有在后面铺一张完整照片来补洞。每个颗粒来自源图的一个位置，保留颜色和透明度；黑色像素仍然是图像内容，透明像素才被过滤。这样，拨散、侧看和导出展示的都是同一组真实粒子。

默认起点是 30,000 粒子。粒子预算和颗粒大小可以独立调整，预设的覆盖率通过实际人物照片校准。密度提高到 80,000 时，已有粒子的身份与源图位置保持稳定，不会让选区或保护区域跟着随机变化。

高分辨率导出也不会悄悄增加粒子数量。它放大的是当前作品，不会凭空找回采样已经省略的细节。因此，颗粒边缘、小空隙和细节简化都是需要让使用者看见并能调整的结果。

拨动是一段完整的输入过程

我更希望照片有柔和、可靠的手感，而不是鼠标一经过，整张图就持续爆炸。默认工具是观察；切换到拨动后，按住施力、松开归位，支持推开和吸引。

这个规则也延伸到边界情况：离开画布、取消触屏指针、失去焦点、切到后台或暂停，都要解除外力。重新进入画布后，需要再次按下。只有正常松手的演示好看，而取消操作留下残余力量，仍然算交互失败。

运行时使用固定步长的 CPU 模拟和复用数组，渲染共用一个循环。每帧的粒子位置没有塞进 React 状态。这样的组织便于控制归位、暂停和回放，也避免界面更新拖累模拟。

空间观察不等于生成完整的三维人物

最初的有限侧看满足不了“在 3D 空间里查看”的期待。后来观察扩展到环绕、屏幕方向平移、光标附近缩放，并提供正交还原与空间透视两种投影。

正交适合检查照片还原，远近颗粒大小一致；透视让前后的起伏更容易读出来。“立体视角”提供一个可直接进入的斜侧观察角度，“正面”则恢复角度、缩放与平移。

这里的深度依然来自照片明暗，属于艺术浮雕。浮雕、分层、反转和平滑可以改变空间形态，却不理解鼻子实际有多高，也不会补全照片背面。一个可以环绕的视图，和一个完整的三维人像模型，需要明确区分。

局部控制让作品不只剩下全局参数

想让背景运动、脸部稳定，只靠全局强度是不够的。粒影把选择、保护和局部深度编辑放在源图坐标里，让它们跟随照片内容，而不是当前屏幕的角度。

选区决定哪些粒子参与局部效果，保护限制它们受到的运动与变形。完全保护的区域不会被拨动、音乐节奏或照片到文字的过渡带走。深度画笔则单独负责形态，不被保护画笔阻挡。

这种区分会影响实际成片：给人脸加了保护，再套一个全画面的文字模板，部分粒子可能仍保留人像，标题就不完整。模板不能为了“看起来成功”偷偷清除使用者已经画好的保护。

深度画笔提供凸起、后退、平滑和恢复。正面辅助图负责找准区域，斜侧预览负责判断起伏。橙色和蓝色分别表示前后方向；可以逐笔撤销，确认后整体提交，取消则恢复进入编辑前的状态。

已确认的手工起伏独立于基础明暗层。切换平面或浮雕、改变粒子密度、应用参数预设，不应该顺手抹掉此前的雕刻。关闭这一层只是暂时不用它，清空后确认才真正删除。

用三个完整模板缩短制作距离

早期工作台允许观察、拨动、变形和录制，但一段完整演示仍需要使用者自己安排开头、停留、转场与收尾。动效卡把这些安排收进三个固定模板。

模板	时长	完整过程
人物介绍	8 秒	粒子聚成人像，轻推镜头，再聚成标题
音乐封面	8 秒	照片与标题过渡，再返回照片；可加入节奏驱动
祝福卡	10 秒	照片出现，展示祝福，最后返回照片停留

标题通过真实粒子变形呈现。制作入口只要求照片、标题、模板和输出选项；可以先预览，也可以直接导出。导出从模板开头重新运行，不要求使用者手工录下一段恰好合适的动作。

横屏、竖屏和方形输出采用完整照片适配，留白由背景填充，避免换成横屏后把人物上下裁掉。未修改的标题会复用已经生成的文字像素，重复导出不会重新换字体或增加一条无意义的撤销记录。

这三种编排是当前的产品边界。它们可以制作成片，但还不是带关键帧、剪辑轨道和任意转场的完整时间线。

音乐也留在使用者的浏览器里

本地音乐既是配乐，也能驱动颗粒轻微聚散和前后波纹。音量与节奏力度分开设置，音乐起点可以调整；即使音量为零，仍可观察由音频驱动的粒子变化。

分析依据实际音频能量，而不是预先做好的循环动画，也不是识别曲风或专业 BPM 网格。支持浏览器能解码的普通音频文件，上限为三分钟、20 MiB；具体编码支持仍取决于浏览器。

工程保存规范化的音频副本，保留最多两个声道。这样重新打开时声音和分析有明确来源，代价是工程包会变大。音乐从设定起点播放到结尾，不自动循环；不足成片长度的部分会静音。

启用音乐时，视频同时编码画面和实际音轨。工程重开后不会自行播放，点击预览或播放才开始；切到后台会停止声音。测试也需要解码导出文件中的声音，不能因为预览时听到了音乐，就认定视频已经带有配乐。

工程、操作记录和成片各自保留什么

粒影没有把“保存工程”和“保留眼前这一刻”当成同一件事。工程用于继续编辑，包含照片、参数、蒙版、深度以及已加入的目标和音乐；重新打开时临时粒子运动归位。

如果想留下拨散的一帧，暂停后导出当前姿态 PNG。静态导出使用不可变的帧快照，随后继续观察或改变设置，都不能改变那张已经开始生成的画面。基础形态 PNG 则适合保留归位后的作品。

操作录制保存可重演的控制输入，最长 30 秒，可以随工程回放。换照片、改变效果或音乐后，旧记录可能不再对应同一作品，所以会提示重新录制。操作记录也不是视频，还需要再导出才能分享给普通播放器。

视频采用浏览器实时采集，提供实际支持的 WebM 或 MP4，720p / 1080p，使用实色背景。它避免把整段逐帧图像留在内存里，但需要页面持续可见，也不承诺离线无损或完全恒定的编码帧率。

本地优先也需要处理丢失与恢复

照片处理、模拟、渲染、音乐解码、保存和导出都在使用者自己的浏览器中完成。Vercel 提供静态应用和授权示例，不承担照片上传、云端渲染或云端工程存储。

浏览器内保存使用原子提交，保留最近成功版本及少量历史检查点；下载 .particle-project 可以迁移到其他设备。原照片和音乐文件不会被覆盖，工程保存的是工作副本和配置。

相应的限制也必须说清：本地数据按网站来源和浏览器隔离。换浏览器不会自动同步，清理站点数据可能移除作品。因此保留固定试用域名，并把下载工程备份作为完整制作流程的一部分。

没有账号降低了初次使用的门槛，但也意味着没有服务器替使用者找回作品。断网后的核心流程以应用资源已经加载为前提，首次离线启动尚未支持。

验证好看之外的那些事

正确性验证覆盖方向、比例、原色、黑色与透明像素、稳定采样和投影。工程往返检查音乐和深度资产的实际内容；透明 PNG 检查真实 alpha；录制检查真实画面变化、声音及取消后的资源释放。

人物视觉验收另做主体、肤色、头发和颗粒覆盖检查。色块夹具可以证明颜色或边界规则，却不能证明一张人像看起来好看。

截至这次发布，50 项单测通过，Chrome 与 Edge 的完整回归各 43 项通过，随后最终模板与音乐的 8 项定向复验也在两个浏览器通过。不能把后来加入的用例写成此前已经运行过的完整套件。

性能测量使用本机 RTX 4060 Laptop、实际 NVIDIA / ANGLE 渲染器、1920×1080、DPR=1。祝福卡配立体声音乐的 9.8 秒场景中，30k 和 80k 都约 59 FPS，p95 帧时约 16.8 ms；这是该设备与条件下的结果。

实现中也遇到过真实的慢场景：80k 配镜头、动态和变形时一度只有约 8 FPS。热点在逐粒子路径中反复创建相机对象和计算形态。改成复用数组、每帧合成显示位置后，同一组合场景恢复到约 60 FPS，没有靠静默减少粒子遮住问题。

触屏只做了浏览器模拟，真实手机、Safari 和 Firefox仍未实测；初版的 20 分钟稳定性记录也不当作新版重复完成的长期验证。技术验收和使用价值是两份不同的证据。

下一步，先看它能不能被真正用起来

我暂时不打算把更多特效当作主要目标。更有意义的试用问题是：别人能否用自己的照片完成第一份作品，是否愿意导出发给朋友，下一次修改标题或换音乐时，能否顺利从工程继续。

人物介绍、祝福卡和音乐封面只是三个起点。哪一种被反复使用、哪一步让人停下来，才会影响下一版该改模板、简化交互，还是扩展新的创作能力。

V0.1 已经把照片、互动、局部编辑、本地音乐和短片交付连成一条路径。接下来要验证的，是这条路径是否能留下一件使用者愿意保存、分享和继续修改的作品。

文中截图来自实际运行的授权示例，照片来源为 Pexels #220453，仅作技术演示，不代表人物推荐或代言。真实用户素材不随文章发布。