Guide on Video Annotation

Supercharge Your Web Apps with Powerful Annotation. Video annotations are comments, shapes, or drawings placed on top of a video frame or a video frame range. Unfortunately, there is currently no specification for how a video should be annotated or even for what types of video annotations to allow.

As a result, video annotation types vary from one tool to the next, and the annotations created in one annotator typically do not display in other software.

Apryse is the first to implement the same annotations as outlined by the PDF specification for video. This means you can implement the same rich annotations for PDFs, images, MS Office documents, CAD, 3D, and videos — all in a single, web-based UI.

Apryse’s Software Development Kit (SDK) also supports PDF video annotations, today called RichMedia annotations. Not to be confused with actual video annotation, RichMedia instead lets you embed sound and video clips in a PDF file.

You will find video annotators embedded in collaboration or review software to enable professional illustration, discussion, and iteration on video content.

A few places where you find video annotators today:

Many online tools let you annotate a video. Apryse provides a video annotation example in our free WebViewer Video showcase, where you can upload a video and intuitively mark it up, then save your annotations in the video file or into a separate file.

An easy way to enable video annotation in a web app — or on a platform like Salesforce or Teams — is to embed WebViewer Video.

WebViewer Video is a JavaScript SDK with video playback and annotation capabilities all out of the box. It includes other applicable features too, like watermarking video, viewing audio waveform, and so on.

Creating annotations using WebViewer Video is easy, using just three steps:

That’s it!

The best way to add your video annotation is to draw on top of the video element on a separate canvas. That way, you can later save annotations separately into a database.

Saving annotations separately, as enabled with WebViewer Video, greatly reduces the storage cost; entire videos are not duplicated to capture feedback for each user. You can thus also more easily share your annotations — or synchronize conversations on video if you’re a developer adding collaboration features.

We put together a sample that showcases how WebViewer Video is used together with pre-built collaboration modules to speed up development.

Another option for saving annotations is to simply flatten or draw them into each frame (i.e., merge annotations into the video file). Merging annotations potentially leads to loss of context or comment history. On the other hand, merging annotations will be useful if you intend to send comments to someone else without access to your web application.

With WebViewer Video, the merging functionality is available out of the box.

Start coding with the get-started guide to see how to add WebViewer Video to a web application, and then use video annotation guide to work on a single video in your browser. Or take us for a trial run - try out Apryse features using your own media on the interactive demo.