Video Editor
A
admin@zorgsocial.comThe Video Editor is a full browser-based, timeline-driven editor for composing, trimming, and exporting videos — supporting video, audio, image, text, and motion-graphic clips across multiple layers.
Getting to the Video Editor
- Open Media Studio from the sidebar.
- Click Video Editor.
This opens the Projects page (/media-studio/video-editor/projects) where your saved projects are listed with thumbnails and aspect-ratio icons. From here you can:
- Click a project card to reopen it.
- Click New Project to open a blank editor.
- Delete a project (with confirmation dialog).
The Video Editor Layout
The editor is divided into four zones:
| Zone | Location | Purpose |
|---|---|---|
| Toolbar | Top bar | Playback, undo/redo, FPS, aspect ratio, zoom, duration, save, export |
| Media Library | Narrow left sidebar | Upload files, add text, browse Media Jobs output |
| Preview / Canvas | Center | Live Remotion player with overlay canvas |
| Clip Properties | Collapsible right panel | Edit the selected clip's properties |
| Timeline | Bottom | Layers, clips, and playhead |
Toolbar Controls
| Control | Description |
|---|---|
| Project name | Editable; an * appears when there are unsaved changes |
| Undo / Redo | Ctrl+Z / Ctrl+Shift+Z or Ctrl+Y |
| Skip Back / Play / Skip Forward | Space to play/pause; arrow buttons skip 1 second |
| FPS selector | 24, 25, or 30 fps — applies to the whole composition |
| Canvas aspect ratio | 16:9 · 9:16 · 1:1 Ctrl+A cycles through them) |
| Zoom | + / − buttons or Ctrl+Scroll; click the percentage to reset to 100% |
| Duration | Sets the total project length in seconds (5–600 s) |
| Save | Saves the project (creates a new one if not yet saved); redirects URL to the project ID |
| Export | Opens the Export modal |
| AI Assistant (wand icon) | Opens the EasyZorg AI chat panel for generating and dragging-in media |
Adding Media to the Timeline
Upload from your device
- In the Media Library sidebar, select the type: Video, Audio, or Image.
- Click the upload area or drag a file onto it.
- The file is uploaded and the clip is added to the selected layer on the Timeline.
Add a text clip
- Click the Text button in the Media Library sidebar.
- A text clip is inserted into the Timeline at the current playhead position.
- Edit content, font size, and color in the Clip Properties panel.
Add from Media Jobs
- In the Media Library sidebar, open the Media Jobs picker.
- Find a completed generation job (video, image, or audio).
- Click or drag the item to add it to the Timeline.
Drag-and-drop from the AI Assistant
- Open the AI Assistant panel (wand icon in the toolbar).
- Generate media via chat.
- Drag any result directly from the panel onto the canvas or Timeline.
Working with the Timeline
The Timeline has 4 layers (Layer 1–4). Each layer can independently be:
- Locked — prevents accidental edits.
- Hidden — excludes the layer from the preview.
- Muted — silences audio on that layer.
Selecting a clip
Click any clip on the Timeline to select it. Its properties appear in the right panel.
Moving a clip
Drag a clip left or right on the Timeline to change when it starts.
Splitting a clip
- Select the clip.
- Move the playhead to the cut point.
- Press
Ctrl+Sor click Split in the Clip Properties panel. - Delete the unwanted segment with
DeleteorBackspace.
Deleting a clip
Select it and press Delete or Backspace, or click Delete in the Clip Properties panel.
Clip Properties Panel
With a clip selected, the right panel exposes:
Common properties (all clip types)
| Property | Description |
|---|---|
| Duration | Length in frames |
| Layer | Which layer index the clip sits on |
| Opacity | 0–100% |
| Scale | 10%–300% |
| Rotation | −180° to 180° |
| Position X / Y | Pixel offset from centre; 9-point quick-position grid available |
| Transition In | None · Fade · Slide Left/Right/Up/Down · Zoom · Dissolve, with duration control |
Video & audio only
| Property | Description |
|---|---|
| Volume | 0–100% |
| Trim | In/out point in frames |
| Frame rate | View native FPS; convert to 24/25/30 fps with optional motion interpolation |
Text clips only
| Property | Description |
|---|---|
| Text content | Multi-line text area |
| Font size | 12–200 px |
| Color | Color picker + hex input |
Motion-graphic clips (HTML type)
| Property | Description |
|---|---|
| HTML / CSS / SVG code | Full code editor — CSS animations are applied; <script> tags are ignored |
Keyboard Shortcuts
| Shortcut | Action |
|---|---|
Space | Play / Pause |
← / → | Seek ±1 frame |
Ctrl+Z | Undo |
Ctrl+Shift+Z or Ctrl+Y | Redo |
Ctrl+S | Split selected clip at playhead |
Ctrl+A | Cycle canvas aspect ratio |
Delete / Backspace | Delete selected clip |
Shift+←/→/↑/↓ | Nudge selected clip position ±10 px |
Alt+←/→/↑/↓ | Nudge selected clip position ±1 px |
Ctrl+Scroll | Zoom canvas in/out |
Exporting Your Video
- Click Export in the toolbar.
- Choose an Export Preset or set custom dimensions:
| Preset | Resolution | Aspect Ratio |
|---|---|---|
| YouTube | 1920 × 1080 | 16:9 |
| YouTube Shorts | 1080 × 1920 | 9:16 |
| Instagram Post | 1080 × 1080 | 1:1 |
| Instagram Reel | 1080 × 1920 | 9:16 |
| Instagram Story | 1080 × 1920 | 9:16 |
| TikTok | 1080 × 1920 | 9:16 |
| Facebook Post | 1280 × 720 | 16:9 |
| Twitter/X | 1280 × 720 | 16:9 |
| Custom | User-defined | User-defined |
- Set FPS and Quality.
- Toggle Export Audio on or off.
- Click Export. The render server processes the job and streams progress back via SSE. Download the file when it is complete.
