Tejashmakwana/motionmaxxing

What it solves

Most AI-generated motion graphics suffer from "slop"—a generic, unpolished look characterized by slide-deck layouts, repetitive corner labels, and uninspired timing. This project provides a structured, agent-based framework to transform these "mid"-tier AI videos into professional-grade motion graphics that follow established design principles.

How it works

It functions as an agent skill that integrates with tools like Claude Code. The process follows a strict 10-step protocol: it analyzes a brand's website to extract identity, generates a storyboard, and builds the animation using a custom runtime (motion.js). The project relies on "measured motion," where timing and easing are derived from an analysis of 53 professional motion moments. After rendering, the agent uses automated scripts to perform a "Mog check" (a series of quality gates) to detect and fix common AI design flaws like page chrome, dead frames, and improper easing.

Who it’s for

This tool is designed for creators, developers, and motion designers who use AI agents to generate product promos, launch films, or kinetic typography and want to ensure their output meets professional aesthetic standards rather than generic AI defaults.

Highlights

• Measured Motion: Uses 12 professionally measured easing curves and frame-accurate timing rules to replace default AI animation patterns.
• Automated Quality Gates: Includes a "Mog check" system that automatically audits films for common AI errors (e.g., page chrome, lack of movement, poor end-holds).
• Deterministic Runtime: The motion.js runtime ensures every frame is a pure function of time, making animations reproducible and seek-safe.
• Design-First Approach: Replaces generic fades and slide-deck layouts with techniques used by professionals, such as cutting on motion and using 3D depth for hero elements.