Shape Morphing

Python Code

from dataclasses import replace

from vood.components.renderer.path import PathRenderer
from vood.components.states.path import PathState
from vood.converter.converter_type import ConverterType
from vood.tat.logger import configure_logging
from vood.velements import VElement
from vood.vscene import VScene
from vood.vscene.vscene_exporter import VSceneExporter

configure_logging(level="INFO")

START_COLOR = "#FDBE02"
END_COLOR = "#AA0000"

START_SHAPE = "M 0,-50 L 14.43,-15.45 L 47.55,-15.45 L 23.56,6.18 L 36.99,40.45 L 0,20 L -36.99,40.45 L -23.56,6.18 L -47.55,-15.45 L -14.43,-15.45 Z"
END_SHAPE = "M 50,0 C 50,27.6 27.6,50 0,50 C -27.6,50 -50,27.6 -50,0 C -50,-27.6 -27.6,-50 0,-50 C 27.6,-50 50,-27.6 50,0 Z"

/Users/dorjeduck/dev/2025/vood/output/20_shape_morphing.mp4
def main():

    # Create the scene
    scene = VScene(width=256, height=128, background="#000017")

    start_state = PathState(
        data=START_SHAPE,
        fill_color=START_COLOR,
        stroke_color=START_COLOR,
        stroke_width=4,
    )

    end_state = replace(
        start_state,
        data=END_SHAPE,
        fill_color=END_COLOR,
        stroke_color=END_COLOR,
    )

    # Create a text renderer for all numbers
    renderer = PathRenderer()

    element = VElement(
        renderer=renderer,
        states=[start_state, end_state],
    )

    # Add all elements to the scene
    scene.add_element(element)

    # Create the exporter
    exporter = VSceneExporter(
        scene=scene,
        converter=ConverterType.PLAYWRIGHT,
        output_dir="output/",
    )

    # Export to mp4
    exporter.to_mp4(
        filename="shape_morphing",
        total_frames=60,
        framerate=30,
        width_px=512,
    )

if __name__ == "__main__":
    main()

Remarks

• Vood uses flubber.js to morph shapes (closed paths). You need to install it as node package in your project root via: npm install flubber