像素画风吹动画:粒子、头发和植物

像素画风吹动画:粒子、头发和植物前言风本身看不见,像素里只能靠“带动的东西”来骗眼睛。SLYNYRD 这篇 Pixelblog 33 给了一套很实用的工具箱:粒子、尘土、布料/头发、以及植被动画。

图注:先感受“粒子轨迹”的节奏,再拆到各模块。第一步:粒子轨迹到尘土粒子轨迹:最轻量,适合暗示气流;叠 落叶、碎屑、尘土立刻成立。

尘土:从地面卷起,颗粒感更重,适合土路、沙漠、干地——地球上大部分户外场景都适用。图注:基础粒子、小型烟尘、大型烟尘。

图2

第二步:布料与头发——用“轨迹 + 等距波”做可循环流程四步:先简化 会被吹动的外轮廓轨迹;  在 最受风的边缘 上标 流径点;  沿流径做 波形曲线运动:波幅从小变大,像能量往外送;  要 循环 时,波与波之间 间距相等,且 每帧位移恒定。

举例:流径点 相隔 12px,每帧 平移 2px,则 6 帧可闭环。旗帜一列里 重复多道波,就是同一规律的复制。

图3

头发在同样波形上再 拆绺:大形动完,再给刘海等局部加次级摆动。小精灵上 平涂 往往比复杂阴影更干净,阴影加不好会把动态噪声放大。

图4

图注:重点在“等距 + 等速”才能无缝 loop。第三步:植被——摇曳、飘落和沙沙,可单用可混搭摇曳(Waving):把树冠拆 多层,每层做极简 菱形路径(例如:右上 1px → 下 1px → 左 1px 回位),各层 错相位 就成片浪。

大形满意后,再在某些帧 改叶团剪影 做细节。飘落(Falling):从 2×2 粒子复制一堆,沿路径 每帧 1px 走;再隔帧 削掉粒子上半 制造翻转感。

图5

沙沙(Rustling):超省事:单片叶子 2~4 个姿势来回;按风向 依次触发邻近叶片,形成 定向流动感,4 帧往往就够一股温和的风。图注:三种可叠加,风会立刻“有层次”。

图6

结语场景不动时,先想 要不要加风,再选 粒子 / 布料 / 植被 哪一层最划算。循环动画记得先算 间距 ÷ 每帧步长 = 循环长,别画完才发现对不上。

参考资料[1]https://www.slynyrd.com/blog/2021/7/16/pixelblog-33-wind-effects: https://www.slynyrd.com/blog/2021/7/16/pixelblog-33-wind-effects

Author: PixelBear