Data Story

Use this when the user wants a data-driven video with animated charts, metrics, and explanatory steps.

Install

npx remotion-ui@latest add data-story animated-bar-chart metric-ticker timeline-steps caption-bumper

Agent instructions

• Use DataStory for a full composition.
• Use AnimatedBarChart, MetricTicker, and TimelineSteps for custom scenes.
• Convert user data into typed arrays before rendering.
• Keep text short and video-readable; split long explanations across scenes.

Typical imports

import { DataStory } from "@/compositions/data-story";
import { AnimatedBarChart } from "@/remotion/scenes/animated-bar-chart";
import { MetricTicker } from "@/remotion/scenes/metric-ticker";