{
  "id": 15985754,
  "title": "Making images wobble in the browser: masks, spring motion and local GIF/MP4/WebM export",
  "url": "https://urgent.news/2026/10/22/making-images-wobble-in-the-browser-masks-spring-motion-and-local-gif",
  "topic": "tech",
  "section": "Tech",
  "published": "2026-10-22T02:06:38.000Z",
  "source": {
    "name": "Dev.to",
    "slug": "dev-to",
    "url": "https://dev.to/yksalun/making-images-wobble-in-the-browser-masks-spring-motion-and-local-gifmp4webm-export-567k"
  },
  "original_language": "en",
  "account": "\"Purupuru Maker\" is a browser tool that lets users create wobbling animations, named after the Japanese word for something soft and jiggly. The tool works entirely in the browser without the need to upload or account for user data. The process begins with decoding a static image, such as a PNG, JPEG, or WebP, into memory. A mask is then applied to determine which regions of the image can move. This mask is not a simple binary selection, but rather a graded brush that controls the strength of each pixel's movement. The resulting soft-body-like deformation is rendered using WebGL2, allowing for real-time preview and export of the animation as a GIF, MP4, or WebM file. The tool supports various motion presets, each defined by parameters like strength, speed, and direction, which can be adjusted to achieve different effects. The final animation is encoded using the WebCodecs VideoEncoder API, probing the device's capabilities to determine the most suitable encoding method. If MP4 or WebM encoding is not supported, the tool falls back to GIF. The export process runs independently of the main UI thread, ensuring a responsive user experience.",
  "summary": "Disclosure: I made Purupuru Maker , the browser tool this post is based on. \"Purupuru\" (ぷるぷる) is the Japanese onomatopoeia for something soft and jiggly, like pudding, cheeks or a jelly cat. The tool does one thing. You paint where a still image should wobble, preview the jelly motion, and export a GIF, MP4 or WebM. All of it runs in the browser tab, with no upload and no account. Below…",
  "key_points": [
    "Purupuru Maker creates wobbling animations in browser",
    "Image decoded into memory, mask applied for movement",
    "Animation exported as GIF, MP4, or WebM using WebCodecs"
  ],
  "editors_take": "Processing animations entirely within the browser via WebGL2 and WebCodecs removes the privacy risks of data uploads while providing users with real-time, local control over soft-body image deformations.",
  "illustration": null,
  "coverage": {
    "outlets": 1,
    "also_reported_by": []
  },
  "ai_generated": true,
  "disclaimer": "Summaries, key points and the editor’s take are written by software from other outlets’ reporting and may contain errors — always check the linked original."
}