Recording

Add Loom-style native recordings to your product.

Voice, video, and screen captures pinned to the exact spot in the work.

Stop pushing your users to another tool every time they need to show, not tell.

Free tier. No credit card. First comment in 5 minutes.

PCPodcast-ep.03
live

The real shift this quarter is that agents ship alongside the team, not after them.

Right, and that’s exactly where recording comes in for async review.

Tone Agent2m

This sounds a bit flat — try a warmer take here.

0:30 / 1:52
Build this

Native recordings running inside products at

Migrating from a screen recorder or an in-house build?Compare·Migration guide

What it is

Show, don’t tell. Both actors.

Voice, video, and screen recordings pinned to the exact spot in the work. Recordings are Velt objects: commentable, notifiable, audit-trailed. The Velt Recorder is a set of components: Recorder Notes pin recordings to specific locations on the screen, the Recorder Tool starts one, the Control Panel manages it, the Player plays it back by ID, and the Video Editor edits it in place. Recordings transcribe automatically, so what was said becomes text that humans and agents can read.

Forecast · pinned to Q3 column
0:40

“The variance comes from the vendor rate change, see row 18.”

Variance Agentagentsame thread

Confirmed: the rate change in row 18 explains 92% of the variance. Suggested correction attached.

one recording, both actors, the approval visible on the work

How it works

Three steps to the first recording.

Wrap your app, mount the recorder components, and voice, video, and screen recording work out of the box. Recordings pin to the work, transcribe automatically, and play back anywhere through the Player.

01Install
terminal
npm install @veltdev/react
02Wrap
_app.tsx
<VeltProvider
  apiKey={VELT_API_KEY}>
  <YourApp />
</VeltProvider>
03Mount
ReviewDoc.tsx
<VeltRecorderNotes />
<VeltRecorderTool type="all" />
<VeltRecorderControlPanel />
<VeltRecorderPlayer />
With Velt

The mechanics

Mount the Recorder Tool where users work and set its type to audio, video, screen, or all. Recordings pin to on-screen locations through Recorder Notes and play back anywhere through the Player. Transcription runs automatically and can be turned off. The SDK fires an event at every step of the recording lifecycle, and recordings are queryable through the SDK and the Get Recordings REST API. The video editor opens on a finished take without leaving the page.

// type='audio' | 'video' | 'screen' | 'all' · transcription on by default

Build it yourself

What an in-house version requires

  • getUserMedia and getDisplayMedia handling across browsers
  • encoding and MIME-type fallbacks
  • chunked uploads for long takes and bad networks
  • storage and CDN plumbing
  • a playback player with waveforms
  • pinning recordings to DOM positions that survive layout changes
  • a transcription pipeline with subtitles
  • a trim-and-split editor with re-encoding
  • permission flows and GDPR deletion paths

Teams that build it budget a quarter for the recorder alone; the editor and transcription are each their own projects. The 3 steps above replace all three.

MCP: the faster path.

Skip the steps. Have your agent set it up.

npx -y @velt-js/mcp-installer

Launch recordings this week.

No credit card. Works with React, Next.js, Vue, Angular, and HTML.

Get Free API Key

Capabilities

Feedback you can watch.

Each card is the live SDK. Toggle to Code for the exact snippet that renders it.

01voice
PCPodcast-ep.03 / voice note
live

This number is faster said than typed: the variance is the vendor rate change, see row 18.

Ethanjust now

Pin this to C18 so finance sees it on the cell.

0:18
// voice
<VeltRecorderTool type="audio" />

Voice notes

One tap starts an audio note; the clip pins to the cell or clause it is about. When the explanation is faster spoken than typed, it stays where the number is.

02video
PCpricing-slide
live
Video message poster
Fenne2m

Quick walkthrough of the pricing slide.

0:27
// video
<VeltRecorderTool type="video" />

Video messages

Camera recordings captured and saved inside your product, played back in the thread. The reviewer’s face and tone travel with the deck instead of a pasted link.

03screen
WOwork-order.md / WO-2271
live
REC 1:04
Ethan2m

Jump-cut here — the file dialog stalls.

0:46 / 1:04
// screen
<VeltRecorderTool type="screen" />

Screen capture

Tab or full-screen recording with mic narration, started from one button in your UI. A reviewer walks through the filing the way they would in person.

04pinned
FCforecast.xlsx / Q3
live
recorder note · pinned to C18
0:42

“The variance comes from the vendor rate change, see row 18.”

// pinned
<VeltRecorderNotes />

Pinned recordings

Recorder Notes anchor every recording to a position on the screen: the cell, the field, the frame. Show-not-tell feedback lands on the work, not in a separate library.

05transcription
PCPodcast-ep.03 / transcript
live
Transcription poster“…see row 18 for the vendor rate change.”
0:00Walking through the Q3 forecast changes.
0:14The variance comes from the vendor rate change.
0:31See row 18: I’ve flagged the cell.
Transcript Agent0:14AI summary

Key point: the variance is driven by the vendor rate change (row 18).

// transcription
// transcription on by default
<VeltRecorderPlayer />

AI transcription and subtitles

Recordings transcribe automatically, with subtitles and an AI summary on the player; one prop opts out of the LLM. A three-minute walkthrough becomes skimmable text.

06editor
PCPodcast-ep.03 / editor
live
Editor frame
Editor Agent2m

Dead air on this frame — trim 0:12–0:15?

Selected frame
// editor
// the editor opens on the finished take
<VeltRecorderTool videoEditor />

Built-in video editor

No more re-recording a take to fix the first ten seconds: trim, split, zoom, and delete segments right where the recording was made, no export, no third-party tool.

07threads
WOwork-order.md / thread
live
Hope2m

Recorded the walkthrough: see the filing steps here.

work-order-walkthrough.webmscreen + mic · 1:12
2 repliesresolvedeep-link
// threads
// a recording attaches like any Velt object
<VeltComments />

Recordings in comment threads

A recording attaches to a comment thread like any other Velt object: reply, resolve, deep-link. The walkthrough and the decision it triggered live in one place.

08events
PCPodcast-ep.03 / events
live
recordingStartedcapturefired
recordingPausedcapturepaused
recordingDonemediasaved
transcriptionDoneaiready
recordingEditDoneeditorsaved
Drive your own UI, analytics, or audit from velt.on()
// events
velt.on("recordingDone", handler);

Recording lifecycle events

The SDK fires an event at every step: started, paused, done, transcription ready, edit complete. Drive your own UI, analytics, or audit pipeline from a recording’s whole life.

09self-host
RDrecorder data / provider
live
Your storagestays with you
recorded filesidentitytranscriptionattachment URLs
Velt storesminimal

Only minimal identifiers (recordingId, userId, timestamps), so the media never leaves your storage.

// self-host
// recorder data provider routes media to your storage

Self-hosted recording data

The recorder data provider keeps recorded files, identity, transcription, and attachment URLs on your storage; Velt stores minimal identifiers. The compliance answer when users record regulated work.

Our reviewers record a 40-second walkthrough instead of typing a paragraph nobody reads. The feedback lands on the exact cell, and the transcription makes it searchable later.

Head of product · FP&A platform

Little big details

The long tail, already built.

Shipped functionality only. Every item traces to the recorder docs; draft items render after engineering sign-off. This is the part of an in-house build that never ends.

Recording types: audio, video, screen, or all from one Recorder Tool (default audio)Floating or in-thread control panel modesCountdown before recording starts (default on, disableable)Picture-in-Picture with camera for screen recordings, Chrome (off by default)Mic enable and disableMax recording length (setMaxLength)Recording quality constraints: resolution and frame rate per browserEncoding options (bitrates) with automatic best-format MIME selectionFull-screen playback and click-to-play on previewsCustom Recorder Tool button labelEmbedded settings panel and media source settings componentRecording preview steps dialogAI transcription default on; one prop off, then never sent to an LLMSubtitles component and AI summary transcript on the playerLifecycle events: recordingStarted, recordingPaused, recordingResumed, recordingStopped, recordingDone, transcriptionDone, recordingEditDone, and moreData APIs: fetchRecordings, getRecordings subscription, deleteRecordings, downloadLatestVideoGet Recordings REST APIVideo editor: trim, split, zoom, segment delete, retake, download, frame-preview timelineAuto-open editor after recordingRecorder data provider: endpoint or function based, retries, timeouts, chunked uploads, scoped storageisRecorderResolverUsed and isUrlAvailable loading-state flagsVelt DevTools extension debuggingPrebuilt collaborative video player with comments on the timelineRecordings as comment attachments: voice, video, screenCrop and annotate in the video editorComing soon

Make it yours

Your recorder, your storage.

Prebuilt recorder components for the fast path, wireframes for fully custom UIs, and configuration, events, data APIs, and a recorder data provider underneath.

Look

Every recorder surface is wireframe-customizable: Recorder Tool, Control Panel, Media Source Settings, Player, Player Expanded, Recording Preview Steps Dialog, Subtitles, Transcription, and Video Editor. Template variables and dark mode apply.

0:42

“the variance is the vendor rate change”

playerdark

Behavior

Recording type per tool instance, floating vs thread mode, max length, quality and encoding controls, transcription and summary toggles, editor auto-open and retake, the full event stream, data APIs, the Get Recordings REST API, and the recorder data provider for storage routing.

typevoice · video · screenfloatingthread
transcriptionAI subtitles · quality · max lengthon
recorderDataProviderroute media to your bucketyour storage
velt.on()started · done · editDoneevents
We routed recorded files to our own S3 with the recorder data provider and kept the prebuilt player. Customizing the editor and subtitles to match our brand was a config change, not a project.

Staff engineer · healthcare SaaS

In production

Recordings, in products like yours.

Tabbed by vertical, with verified customer screenshots.

SummaryNext StepsDemoCustomer Stories

Hey Conductor!

This Digital Sales Room gives you everything you need to move forward — from proposal to plan.

Our Mutual Action Plan
Training2 / 5
Creating a new Room1
Build a working demo room
Contract sign-off
Maya2m

@Fin We need to make a working demo for Rene and his team

A strategist records a 60-second walkthrough pinned to slide 4; the client watches and replies in the thread. The approval happens on the deck, with no call scheduled.For sales enablement

See it running in products like yours.

30 minutes, with an engineer, not a sales deck.

Book Demo
SOC 2 Type IIHIPAAEU data residencySelf-host media

Recorded files, user identity, transcription, and attachment URLs can live on your infrastructure via the recorder data provider, with only minimal identifiers on Velt servers. Recording runs on the same isolation guarantees as the rest of the SDK. See self-hosting and governance.

Book Demo

Proof

Users stopped leaving the product to record.

Show-not-tell feedback, captured where the work is.

0 tools

Our users used to leave for a screen recorder and paste a link back. Now they record in place, pinned to the cell, and never leave the product to show what they mean.
Head of product, FP&A platform

1 afternoon

We mounted the recorder components and had voice, video, and screen recording working that afternoon. The transcription and editor were already there.
Founding engineer, content platform

40s

A 40-second walkthrough replaced a thread of typed back-and-forth. The transcription makes it searchable months later when the auditor asks.
Compliance lead, fintech SaaS

FAQ

Questions about recording.

Install @veltdev/react, wrap your app in VeltProvider with your API key, and add the recorder components: VeltRecorderNotes for pinned recordings, VeltRecorderTool to start one, VeltRecorderControlPanel and VeltRecorderPlayer for control and playback. Voice, video, and screen recording work out of the box; the quickstart walks through it.

Yes, all three from one Recorder Tool: set type to audio, video, screen, or all. Screen recordings support mic narration, and Picture-in-Picture in Chrome when the camera is on.

Yes. AI transcription is on by default, with subtitles and an AI-generated summary on the player. One prop turns it off, and disabled means disabled: the recording is never sent to an LLM.

Yes. The built-in video editor opens on the finished take: trim, split, zoom, and delete segments on a timeline with frame previews, for video and screen recordings. It can open automatically when recording stops, and users can retake from inside it.

By default, Velt stores them. With the recorder data provider, recorded files, user identity, transcription, and attachment URLs stay on your storage (any provider: S3, Google Cloud Storage, Azure Blob, or your own servers) while Velt keeps only minimal identifiers. See /self-hosting.

Yes. Voice, video, and screen recordings attach to comment threads, and a recording links to a comment annotation under the hood, so feedback about a recording stays with the recording. See /comments.

Yes. Velt is optimized for mobile web, works inside WebViews in native apps, and pure native apps can integrate through the REST APIs with your own native UI.

Velt is priced on usage, not seats: you pay for documents with review activity in a month, and there is a free tier for development and early production. Recording is part of the SDK, not a separately priced add-on.

Add Loom-style native recordings to your product.

Free tier. No credit card. First comment in 5 minutes.

30 minutes, with an engineer, not a sales deck.