Skip to content

Using the Studio

The iLoveVideoEditor Studio is a browser-based visual video editor. You can drag, drop, and arrange layers on a timeline, apply animations and effects, and export an MP4 — without writing code.

Opening the Studio

  • New draft — open https://ilovevideoeditor.com/studio. A fresh local draft is created automatically.
  • Cloud project — open an existing project from the dashboard, or navigate to /edit/{projectId} when signed in.
  • Tool mode — start a quick one-video edit from the marketing tool pages, or open /studio?tool={toolId}. Tool mode hides the timeline and shows a focused set of controls for the selected tool.

Local drafts are stored in your browser. Sign in and click Save to Cloud to sync a draft to your workspace so it is available on other devices.

Interface overview

AreaWhat it does
Canvas / previewThe main viewport. Drag layers to move them, use the transform handles to resize or rotate, and scrub the playhead to preview the current frame.
TimelineShows every layer as a block. Drag blocks to change start time or duration, stack layers to control z-order, and click a block to select it.
Inspector (sidebar)Edit the selected layer's properties, timing, transitions, and effects. When nothing is selected, the inspector shows project composition settings.
ToolbarAdd layers, open the asset library, undo/redo, and access project actions.
Tool paletteIn tool mode, a searchable command palette (⌘K / Ctrl+K) lets you switch between tools.
Export buttonRender the video locally in the browser or queue a cloud render.

Adding layers

Click the Add Layer button or press T to add a text layer. You can also add:

  • Text — titles, captions, and lower thirds.
  • Image — PNG, JPG, or WEBP files from your asset library or computer.
  • Video — MP4 or other supported video files.
  • Audio — background music, voice-overs, or sound effects.
  • Shape — rectangles, circles, polygons, and stars.
  • Captions — subtitle tracks that can be edited inline.

Drag files directly from your computer onto the canvas or timeline to create layers automatically. While signed in, the Asset Library lists files you have uploaded to your workspace.

Editing layers

Select a layer to open the inspector. The inspector has three tabs:

Properties

Adjust position, scale, rotation, opacity, color, typography, and other layer-specific fields. Transform values can be scrubbed by dragging the number labels. Hold Shift to scrub faster or Alt to scrub slower.

Timing

  • Start Time — when the layer appears on the timeline.
  • Duration — how long the layer stays visible.
  • Speed — playback speed for video and audio layers.
  • Stack Order — manual z-index control plus Bring to Front / Send to Back shortcuts.

Effects

Apply entrance and exit transitions, visual effects, and 3D transforms. Available options depend on the layer type. Text layers also show one-click animation presets.

Groups

Select multiple layers and press Ctrl+G to group them. Groups behave like a single layer: you can move, scale, and apply effects to the whole group. Double-click a group block on the timeline to edit its contents. Use the breadcrumbs in the inspector to navigate back out.

Animations

Animations in the Studio use the same keyframe model as the rest of the platform. For a full reference of the animation system — keyframe time bases, easing functions, and property paths — see the Animations guide.

In the Studio you can:

  • Apply one-click animation presets to text layers.
  • Animate effect parameters through the layer inspector.
  • Preview any animation by scrubbing the timeline or pressing Space to play.

Tool mode

Tool mode is a simplified UI for common one-video edits such as trimming, cropping, resizing, adding text, or applying a filter. Pick a tool from the command palette or start from a tool marketing page. The sidebar adapts to show only the controls relevant to the active tool, and the timeline is hidden so you can focus on the preview.

Tool mode edits stay local until you export. You can still save them to the cloud if you are signed in.

Exporting

Click Export in the top-right to open the export drawer:

  • Cloud render — queue the project on iLoveVideoEditor servers. You will receive a download link when rendering completes. Cloud export requires signing in.
  • Browser render — render the MP4 locally on your device using your browser. No account is required, but large or long videos may be slower.

If you have configured workspace integrations (S3, R2, Google Drive, etc.), you can choose them as destinations for cloud renders. See Destinations & Integrations for setup details.

Keyboard shortcuts

ShortcutAction
SpacePlay / Pause
DeleteRemove selected layers
← / →Previous / next frame
Shift + ← / →Back / forward 1 second
↑ / ↓Jump to previous / next layer edge
Ctrl + ZUndo
Ctrl + Shift + ZRedo
Ctrl + GGroup selected layers
ZFit preview
Home / EndGo to start / end
TAdd text layer
⌘K / Ctrl + KOpen tool palette (tool mode)

Tips

  • Scrub number fields in the inspector to fine-tune values without typing.
  • Use the playhead and Home/End keys to quickly jump to the start or end of the composition.
  • Disable a layer with the eye icon in the inspector to temporarily hide it without deleting it.
  • Save local drafts to the cloud before clearing browser storage, or they will be lost.

Released under the MIT License.