Skip to content

Tutorials

Step-by-step guides to build complete video projects

These tutorials walk you through building real video compositions, from simple animations to production-ready content.

Table of Contents


Tutorials

Simple Animation

Difficulty: Beginner Duration: 30 minutes What you'll learn: - Setting up a Video composition - Creating scenes with backgrounds - Adding images with animations - Adding animated text (title, subtitle) - Including background music - Exporting the final video

What you'll build:

A 30-second animated video with: - Gradient background - An image that fades in with Ken Burns effect - Animated title and subtitle - Background music with fade in/out


Advanced Composition

Difficulty: Intermediate Duration: 60 minutes What you'll learn: - Multi-scene compositions - Scene transitions (crossfade, slide) - Embedding video clips - Particle effects (sparkles, confetti) - Sound effects at specific frames - Stagger animations for lists - Audio-visual sync points - Quality settings for export

What you'll build:

A 1-minute video with: - 3 distinct scenes with transitions - Embedded video clip with audio - Particle effects for atmosphere - Staggered text animations - Sound effects synced to visuals


Prerequisites

Before starting these tutorials, make sure you have:

  1. Fluvie installed - See Installation
  2. FFmpeg set up - See FFmpeg Setup
  3. Completed the First Video guide - See First Video

You should be comfortable with: - Basic Flutter widget composition - Running Flutter apps - Frame-based timing concepts (see Frame-Based Animation)


Tutorial Structure

Each tutorial follows this structure:

  1. Overview - What we're building and why
  2. Setup - Assets and project structure
  3. Step-by-step implementation - Incremental code building
  4. Preview and testing - Checking our work
  5. Export - Producing the final video
  6. Variations - Ideas for customization

Example Code

Working examples referenced in these tutorials can be found in:

example/lib/gallery/examples/
Tutorial Related Example
Simple Animation example_1_simple_animation.dart
Advanced Composition example_year_review.dart

After the Tutorials

Once you've completed these tutorials, explore: