Skip to main content
Zoom:

Basic Elements

Text
Button
Image
Form

Interactive

Link
HTML
Welcome to Video Flow
Get Started

Drop element here

01:23 / 03:45

Inspector

Text Element Selected

Transform

Styling

Interactions

Timeline

Main Video
Text Element
Button Element
0:00
0:30
1:00
1:30
2:00
main-video.mp4
Welcome Text
CTA Button

Elements Panel

Drag elements to canvas

Basic Elements

Text
Button
Image
Video

Form Elements

Input
Form
Checkbox
Dropdown

Interactive

Link
Modal
Timer
HTML

Layout

Container
Divider
Spacer
Grid
Quick Preview
Hover over elements to preview

Elements Panel

The Elements Panel is your creative toolkit. Drag and drop elements from the left panel to build interactive video overlays.

Drag & Drop

Intuitive drag and drop interface for quick element placement

Rich Elements

Comprehensive library of interactive and layout elements

Real-time Preview

See element previews before adding them to your canvas

How to Use

1

Browse the element categories in the left panel

2

Hover over elements to see a quick preview

3

Drag elements to the video canvas to add them

4

Use the Inspector Panel to customize properties

Inspector Panel

Text Element Selected

Welcome Text
Text Element

Inspector Panel

The Inspector Panel provides context-aware controls for selected elements. Modify properties in real-time and see changes instantly on the canvas.

Live Property Synchronization

Current Values

X Position: 32px
Y Position: 32px
Width: 200px
Height: 40px

Visual Preview

Welcome Text

Real-time Updates

Properties sync instantly between canvas and inspector

Advanced Styling

Complete control over typography, colors, and effects

Interactive Actions

Add click events, links, and custom interactions

Timeline

Zoom:
Tracks
Main Video
main-video.mp4
Welcome Text
Text Element
CTA Button
Button Element
Logo Image
Image Element
Contact Form
Form Element
0:00
0:30
1:00
1:30
2:00
2:30
3:00
3:30
main-video.mp4
Welcome Text
CTA Button
Logo Image
Contact Form
01:24 / 03:45
Speed:

Properties Editor

Advanced element configuration

Properties Editor

Advanced property configuration for precise element control. Customize every aspect of your video elements.

Live Property Preview

Welcome to Video Flow
Position: 32, 32
Size: 200x40
Opacity: 100%
Z-Index: 10

Advanced Controls

Fine-tune every property with professional-grade controls

Responsive Design

Configure properties for different screen sizes

Custom CSS

Add custom styles for unlimited creativity

Keyframe Editor

Animate element properties over time

Animation Timeline
0s
4s
250px
0px

Selected Keyframe

Animation Controls
Duration: s
Loop:

Keyframe Editor

Create smooth animations with precise keyframe control. Design complex motion graphics and transitions.

Animation Preview

Welcome Text
Current Time: 1.68s
Position: 150px, 120px

Visual Keyframes

Intuitive graph-based keyframe editing with visual curves

Precise Timing

Frame-accurate timing control for professional animations

Easing Functions

Built-in easing presets and custom bezier curves

Current Keyframes

Time Property Value Easing Actions
0.0s Position X 32px Linear
1.0s Position X 200px Ease In Out
2.0s Position X 150px Ease In Out
3.5s Position X 250px Bounce

Asset Library

Manage your media assets

hero-image.jpg
1920x1080 • 2.4MB
logo.png
512x512 • 89KB
3:45
intro-video.mp4
1080p • 45.2MB
1:23
background.mp4
720p • 12.8MB
background-music.mp3
2:15 • 3.2MB
click-sound.wav
0:01 • 156KB
script.pdf
PDF • 1.2MB
custom-font.ttf
Font • 245KB

Asset Library

Organize and manage all your media assets in one place. Upload, preview, and drag assets directly to your canvas.

Upload New Assets

Drag and drop files here or click to browse

24
Images
8
Videos
12
Audio Files
256MB
Total Size

Drag & Drop Upload

Simply drag files from your computer directly into the library

Smart Search

Find assets quickly with intelligent search and filtering

Auto Organization

Assets are automatically categorized by type and metadata

Project Settings

Configure project properties and export options

Project Settings

Configure your project properties, export settings, and collaboration options for optimal results.

Current Configuration

Video Format

1920x1080 @ 30fps

16:9 aspect ratio

Export Quality

High Quality MP4

5000 kbps bitrate

Collaboration

Private Project

2 team members

Flexible Configuration

Customize every aspect of your video project settings

Export Options

Multiple format support with quality optimization

Team Collaboration

Share projects and collaborate with team members

Quick Actions