WEBKNOSSOS | Creating a Video of your Data in WEBKNOSSOS with Claude

Making a flythrough video of your data with WEBKNOSSOS and your AI coding agent

With your data in WEBKNOSSOS, you can create beautiful, professional-looking videos, which has become much easier now that we have AI coding agents (e.g. Claude).
The trick is that WEBKNOSSOS has a JavaScript API: a set of commands you can send to it from a small script that you paste and run in your browser's developer console. You don't need to be a developer: you can ask the AI to write that script for you. The WEBKNOSSOS API documentation contains many examples of what it can control.
With the API you can, among other things: set the camera position, set the zoom level, change a layer's opacity or the segmentation opacity, and take screenshots. Chain those together, one small step at a time, and you get a smooth zoom into your data, a layer fading in, and a scroll through Z, captured frame by frame and stitched into a video.

Building the flythrough

As an example, we'll use the beautiful Drosophila Male CNS dataset from Janelia (preprint, Berg et al. https://www.biorxiv.org/content/10.1101/2025.10.09.680999v2), which has a segmentation. We want to start at one position, zoom into another, smoothly fade the segmentation in, and then scroll through Z.

Start position and zoom level

Location for the pause, segmentation opacity slider

Everything you need to tell the AI agent is right there in the WEBKNOSSOS UI: the coordinates, the zoom level (note: a smaller zoom value means more zoomed in), and the segmentation opacity.

Here's the prompt I gave Claude:

Create a flythrough animation of my data in WEBKNOSSOS (zoom in, fade the segmentation in, then scroll through Z sections) and assemble the captured frames into a smooth video (30 fps, MP4). Capture the XY viewport.
Timeline (15 seconds total):
● Start: position 46410, 28964, 33454, zoom 83.73. Set the segmentation Opacity to 0%. Leave the segmentation's Pattern opacity unchanged for the whole video.● 0–8 s: zoom in from 83.73 to 0.86 (smaller = closer), staying centered on the start position.● 6–10 s: fade the segmentation in by raising its Opacity from 0% to 30% (don't touch Pattern opacity).● 8–10 s: hold still (no camera movement).● 10–15 s: scroll through Z, from Z 33454 to Z 33534.
Capture: one screenshot per frame, and wait until the data has fully loaded before each capture so no frame is half-rendered. Use ease-in / ease-out for the zoom, but scroll through Z at a constant (linear) speed. Then compile the frames into the final video.

Generating the video

Open your WEBKNOSSOS dataset and turn on every layer that should appear in the video (even ones that only become visible later - the data needs to be loaded so the script can capture it cleanly). Then open the browser's developer console and paste the script your coding agent prepared. For our demo, it's this:

webknossos-demo.sh

The script steps the camera and opacities forward one frame at a time, waiting for the data to finish loading before each screenshot so nothing is captured half-rendered. That's what keeps the motion smooth. When it finishes, you'll have a ZIP of frames in your Downloads folder.
Turn those frames into a video with this command (or just ask the AI to do it for you):
ffmpeg -framerate 30 -i frame_%05d.png -c:v libx264 -pix_fmt yuv420p -crf 18 flythrough_demo.mp4
And here's our result:

A 15-second flythrough of Janelia's Male CNS dataset in WEBKNOSSOS (zooming in, fading the segmentation on, and scrolling through Z) generated from a script Claude wrote for the browser console.

Good luck making your own animation!