Разница между покадровой и марионеточной анимацией в веб-дизайне заключается в процессе создания:

1. Покадровая анимация предполагает шаг за шагом добавление очередного элемента движущейся картинки. 1 В ключевой покадровой анимации сцена планируется заранее, затем рисуются ключевые позы персонажей, после чего прорисовываются дополнительные фазы между ключевыми позами. 4
2. Марионеточная анимация создаётся с помощью инструмента Puppet Warp («Марионеточная деформация») в программах, например Photoshop. 1 Для этого берут изображение в формате PNG без фона, «прикалывают» его с помощью кнопок и оставляют свободной только ту часть, которая будет двигаться в анимации. 1 Затем левой кнопкой мыши зажимают ту часть картинки, которая должна находиться в движении, и слегка тянут в нужную сторону. 1

Таким образом, покадровая анимация даёт высокий уровень контроля над каждым кадром, в то время как марионеточная анимация позволяет создавать анимацию быстрее, но с менее реалистичным движением, так как картинка двигается постепенно. 14