Identification of an Open Source Video Annotations Tool for NVLI
Identification of an Open Source Video Annotations Tool for NVLI
Manoj
Wed, 11/21/2018 - 16:07
As mentioned in our earlier blog on Video Annotations: A powerful and innovative tool for education, the most intriguing feature of the pilot version of NVLI is Video Annotation. UniMity Solutions assisted in building Annotation feature for Audio and Video assets. This involved identifying and integrating an open plugin that supported video and audio annotations and a generic annotation store module that was plugin agnostic.
The first step of the project was to identify a suitable plugin, open source tool that support the Annotation needs of the NVLI project.
The tools reviewed included popcorn.js and Open Annotation Plugin. Popcornjs provided by Mozilla Foundation is an HTML5 media framework written in java script for film makers, web developers and anyone who want to create time-based interactive media on the web. Annotations need to be pre created and made available through scripts. This plugin does not provide a user interface to create annotation. The Open Annotation Plugin met most of the requirements and was on top Video.js plugin, which has a lot of adoption in the Education space.
The identification and finalization of the tool was done through a systematic process of evaluating them against specific criteria. As Open Annotation Plugin requires Video.js, wherever required details of Video.js also provided.
Find below the criteria used to evaluate Open Annotation Plugin:
S.No
Criteria for Evaluation
Details
1
Name of Tool used
Open Video Annotation Project used with Video.js
2
Licensing
2.1
Licensing for Open Video Annotation Project
Open Video Annotation by Philip Desenne and Daniel Cebrián Robles is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
2.2
Licensing for Video.js
Licensed under the Apache License, Version 2.0
3
Standards compliance
3.1
Annotations
Compliant with Open Annotation data formats
3.2
Compliance
3.3
HTML5 support
Video.js works with HTML5 only (Default failure msg built in)
Key HTML5 features include, Video, audio tag, buffering and fall back.
3.4
Accessibility
Video.js Is accessible, need to review accessibility of Open Video Annotation Project
3.5
Browser
Google Chrome, Firefox, Safari, Internet Explorer 9
3.6
Device Compatibility
iPhone, iPad, Android
3.7
Video Formats supported
MP4, ogv, webm
4
Customization
4.1
UI using CSS
Possible to override Plugin CSS - By adding weight to the style classes.
4.2
Modular Code
API Methods to take control of the plugin are listed at GitHub
5
Functional Requirements
5.1
Out of box functionality - Standard Play/ Pause/ Stop; Volume Control
Yes
5.2
Annotations
Supports Annotations - Yes
5.3
Timeline based
Yes
5.4
Spatial
No
5.5
Unicode Text Support for Multilingual
Multilingual for annotations -
This can be managed by Drupal as all annotations are saved as entity. More advanced understanding of the plugin's multilingual capability and the overall multilingual architecture will be taken up separately
5.6
Support for Text/ Rich Text/ Images/ Embed Videos/ Audio
Yes
5.7
Annotation Scope
(Public and Private)
This has to be handled in Drupal. The annotation store will be stored as entity. The entity author will help track the author.
6
Community Support
6.1
Founder
Twitter ID of Daniel
6.2
Working Group
https://www.w3.org/community/openannotation/
6.3
IRC Channel
#videojs , no separate channel for open video annotation found
6.4
Newsletter
Not Available
6.5
Product Roadmap
One request for 3D Annotation is been raised - No clear date or plan for implementation
6.6
Usage Stats and Case studies
Top users of video.js - newspaper sites, "the ONION" and "theguardian"
7
Technology
Based on open-source java script libraries
Extending Annotator Open Knowledge Foundation Project
Build on top of the Video.js the open source HTML5 video player
Compliant with Open Annotation data formats
Customizable and mashable with open API's
HTML5 components
8
Architecture
Annotateit - For storing annotation dataRangeslide JS - Simple, small and fast JavaScript/jQuery polyfill for the HTML5ova JS - handles the java script for managing display and annotation creation UI on the HTML5 video.
9
Libraries Used/ Dependencies
Open Video Annotation Library/Videojs
10
Ease of Integration
Open Video Annotation Library - for Annotation
Annotation Module helps to store the annotation data.
11
Security Compliance
Has to be handled by Drupal
– Filtering text to prevent SQL Injection
– For internal store Drupal will handle the security.
IIT Bombay wanted to leverage Open source technologies and share the work back to relevant communities and hence we choose this open tool. Integrating this with Drupal meant having it work with content types, Drupal entities and more.
Watch out our next blog for solution architecture in Drupal….