Engineering
anima avatar

anima

Anima is a TypeScript animation engine for creating programmatic mathematical visualizations. Use it to script geometric animations, graphs, and complex movements with a fluent, Manim-inspired API.

Introduction

Anima is a specialized TypeScript-based animation framework designed for developers, educators, and data scientists who need to create precise, programmatically generated mathematical visualizations. Built on Bun and HTML5 Canvas, it allows users to author complex animations through a fluent, chaining API that manages scenes, mobjects (mathematical objects), and camera movements. It is particularly effective for those creating educational content, technical explainers, or visual demonstrations of algorithms and geometric concepts, offering a development experience reminiscent of the popular Python-based Manim library but optimized for the TypeScript/web ecosystem.

  • Provides a robust suite of geometric primitives including circles, rectangles, lines, polygons, and arcs, all fully animatable with properties like stroke, fill, and opacity.

  • Features a comprehensive camera system with support for zooming, panning, orbiting, and dynamic fitting to bounding boxes of specific objects.

  • Offers over 30 built-in easing functions, including standard linear/quadratic/cubic options and specialized Manim-style rates like smooth, rushInto, and thereAndBack.

  • Includes advanced capabilities for text rendering with font support, graph layouts (tree, circular, force-directed), and multi-property keyframe animations for complex motion paths.

  • Supports multi-format rendering including MP4, WebP, GIF, and PNG sequences, with built-in segment caching for rapid iteration and CLI-driven production workflows.

  • Utilizes a structured scene lifecycle model where users extend a Scene class to handle instantiation, frame rate control, and sequential/parallel animation execution.

  • The engine operates within a world-coordinate system where (0,0) is the center, with Y pointing upwards, simplifying mathematical layout calculations.

  • Input is typically a TypeScript source file; output is a rendered video or image file generated via the CLI commands such as anima render.

  • Users should leverage the saveState/restore methods to manage complex object transformations and use the VGroup class for managing parent-child object hierarchies and group-level styling.

  • Performance-sensitive scenes benefit from preview-quality modes during development before committing to final high-resolution production renders.

  • While ideal for mathematical visualizations, the library requires familiarity with TypeScript or JavaScript and basic understanding of coordinate-based graphics.

Repository Stats

Stars
4
Forks
0
Open Issues
0
Language
TypeScript
Default Branch
main
Sync Status
Idle
Last Synced
May 3, 2026, 10:05 PM
View on GitHub