Skip to content

Fluvie Documentation

Create stunning videos programmatically with Flutter

Fluvie is a powerful Flutter library that lets you compose and render videos using familiar Flutter widgets. Whether you're building Spotify Wrapped-style year reviews, animated social media content, or automated video generation pipelines, Fluvie gives you the tools to create professional videos entirely in code.

Quick Example

import 'package:fluvie/declarative.dart';

Video(
  fps: 30,
  width: 1920,
  height: 1080,
  scenes: [
    Scene(
      durationInFrames: 90, // 3 seconds at 30fps
      background: Background.gradient(
        colors: {0: Colors.purple, 90: Colors.blue},
      ),
      children: [
        VCenter(
          child: AnimatedText.slideUpFade(
            'Hello, Fluvie!',
            style: TextStyle(fontSize: 72, color: Colors.white),
          ),
        ),
      ],
    ),
  ],
)

Table of Contents

Getting Started

New to Fluvie? Start here:

Guide Description
Installation Add Fluvie to your project
FFmpeg Setup Configure video encoding for your platform
First Video Create your first animated video

Platform-specific setup: - Linux | macOS | Windows | Web | Mobile

Core Concepts

Understand how Fluvie works under the hood:

Topic Description
Architecture The dual-engine model (Flutter + FFmpeg)
Frame-Based Animation Why frames matter for video
Rendering Pipeline How widgets become video
Preview vs Render Mode Interactive development vs final export

Tutorials

Step-by-step guides to build complete videos:

Tutorial What You'll Build
Simple Animation Image, animated text, and background music
Advanced Composition Multi-scene video with transitions, effects, and embedded video

Widget Reference

Core Widgets

The building blocks of every Fluvie video:

Widget Purpose
Video Declarative composition root (high-level API)
VideoComposition Low-level composition root
Scene Time-bounded section of video
Sequence Basic timing container
TimeConsumer Frame-based animation driver

Layout Widgets

Video-aware layout with timing and fade support:

Widget Purpose
LayerStack Z-indexed layer composition
Layer Individual layer with visibility timing
VStack Video-aware Stack
VColumn Column with stagger animation support
VRow Row with stagger animation support
VCenter Centered content with timing
VPadding Padded content with timing
VSizedBox Sized box with timing
VPositioned Positioned elements with hero transitions

Audio Widgets

Add music, sound effects, and audio-reactive features:

Widget Purpose
AudioTrack Precise audio timing and sync
AudioSource Audio file references
BackgroundAudio Full-video background music
AudioReactive BPM and frequency analysis

Text Widgets

Animated typography:

Widget Purpose
FadeText Text with opacity support
AnimatedText Pre-built text animations
TypewriterText Character-by-character reveal
CounterText Animated number counting

Media Widgets

Embed images and videos:

Widget Purpose
EmbeddedVideo Video-in-video with frame sync
VideoSequence External video files
Collage Multi-element layouts

Features

Animations

Powerful animation system with presets and customization: - PropAnimation - Transform, scale, rotate, fade - Entry Animations - Dramatic entrance effects - Stagger Config - Sequenced child animations - Interpolate - Keyframe-based values - Easing Curves - Smooth motion curves

Effects

Visual enhancements and atmosphere: - Particle Effects - Sparkles, confetti, rain - Effect Overlays - Vignette, grain, scanlines - Backgrounds - Gradients and solid colors - Transitions - Scene-to-scene effects

Helper Widgets

Ready-made components for common patterns: - PolaroidFrame - Photo frame styling - PhotoCard - Card-style photos - StatCard - Animated statistics - FloatingElement - Ambient motion - KenBurnsImage - Zoom and pan effect

Templates

30 production-ready templates across 6 categories: - Intro Templates - Opening sequences - Ranking Templates - Top lists - Data Viz Templates - Statistics displays - Collage Templates - Image layouts - Thematic Templates - Mood pieces - Conclusion Templates - Closing scenes

Embedding Media

Include external assets in your videos: - Images - Photos and graphics - Videos - Video clips and loops - Audio - Music and sound effects - Fonts - Custom typography

Advanced Topics

Topic Description
Encoding Settings Quality, format, and codec options
Sync Anchors Precise audio-visual synchronization
Custom Render Pipeline Advanced rendering control
Frame Extraction Extract frames from videos
Performance Tips Optimization techniques

Special Modes

Extending Fluvie

Build your own animations, effects, and templates:

Guide Description
Custom Animations Create PropAnimation subclasses
Custom Effects Build visual effects
Custom Templates Design reusable templates
Custom FFmpeg Provider Platform-specific encoding

Examples

Explore working examples in the /example directory:

Example Description
Simple Animation Basic shapes and motion
Text Overlay Text on images
Image Slideshow Photo transitions
Layered Composition Complex layering
Animated Gradient Color animations
Year in Review Complete Spotify Wrapped-style video
FlutterVienna Review Advanced production example

Run the example app: 

cd example
flutter run

Contributing

We welcome contributions! See our guides:

Guide Description
Contributing Overview How to help
Development Setup Local environment
Testing Guide Writing tests
Code Style Formatting standards
Getting Support Issues and help

License

Fluvie is released under the MIT License. See LICENSE for details.

AI & IDE Integration

Use AI assistants effectively with Fluvie:

Resource Description
AI Reference File Complete documentation in one AI-optimized file
MCP Server Model Context Protocol server for AI tools
IDE Helpers Cursor rules, Claude Code, and editor integration

Quick Links: - MCP Setup - Self-host the MCP server - IDE Integration - Configure Claude Desktop, VS Code, etc. - Cursor Rules - Rules file for Cursor IDE