Prototype 2

Clipper Prototype 2 Ready

This page features information about the  second Clipper online prototype.

Clipper prototype No. 2 is   available from this web link  where you can register and try out the system. The demonstration videos below give you an idea how things are shaping up as well.

The Clipper toolkit is developing rapidly in response to the feedback we have been receiving at our community workshops.

There are still a few places available at our third workshop at the British Library next monday the 26th of October

Below for your interest we have provided summaries of the demonstration videos and links that give an idea of how the toolkit is shaping up. The choice of HTML as the native system file format is starting to bring big benefits and we are still exploring the implications and opportunities connected with this decision. After the video section are basic help notes.

Before you start with Clipper Prototype 2

This is an early prototype so there will certainly be problems, glitches and errors, see the Problems? section below. Anything you create in Clipper Prototype 2 will not be permanent – it is a temporary and will be online until the end of 2015.

Clipper Prototype 2 Demo1 – Dashboard, Project, Collections, Resources, Clips & Cliplists

In this video we show and describe the basic elements of the Clipper toolkit and the workflow.

Workflow: Create a Project > Select an item from a collection > Make the item a Resource in a Project > Edit the Resource to create a Clip > Add the clip to a Cliplist

Basic Elements:

  • Dashboard – the top level, where all of a users projects are stored and accessible
  • Project – the basic unit of information in Clipper, a project acts as a container for the Resources, Clips, Annotations and the Cliplist is the published version of that data. Initially we are planning to have one Cliplist in each project
  • Collections – these are the online collections of files that Clipper uses. In our prototype we have YouTube, some BBC videos and a Wellcome Trust video as well as the ability to work with local files. We are hoping to add some more examples soon. NB none of the collections in the prototype are on our server – they are real online examples. The YouTube example gives a good indication of what an institutional installation of Clipper might be like, with good integration into existing collection catalogue metadata etc.
  • Resources – When a user selects an item from an online collection to include it in a project it becomes a Resource.
  • Clips – A user creates a ‘virtual’ clip from a resource by specifying a start and end point and adding a title and description
  • Cliplist – As the user generates clips in a project these are added to the project cliplist

Clipper Prototype 2 Demo 2 – Sharing, Publishing & Search

This video demonstrates how Clipper enables users to share and publish their clips and cliplists. As a user creates clips, cliplists and annotations etc. they are stored in both a database (to support searching and management functions) and as HTML files (with data encoded using JSON) in a directory structure associated with each user.

This video shows how the choice of HTML as the native file format for Clipper makes it easy to publish clips and cliplists onto the web and share the URLs via email and social media etc.

One of the basic design briefs for Clipper is that user generated data should be owned and controlled by users and be highly portable – and not ‘locked up’ in a database or proprietary format. In a research context this also means that the data is in a format (HTML) that is likely to be accessible into the far future – so is good for long-term archiving, preservation and reuse.

The video shows the user publishing their clips and cliplists to the web and being to control the granularity of what they share down to individual clips – a later video will deal with even finer granularity of sharing in the context of annotations.

The video also shows the current json data structure we are using.

Clipper Prototype 2 Demo 3 – Adding Clips From Different Resources

In this video we show how a user can use Clipper to create a cliplist with clips from different resources from separate online collections.

Clipper Prototype 2 Demo 4 – Annotations

Annotations are a powerful function in Clipper. An annotation is text created by the user and is ‘pinned’ to a point on the timeline of the clip specified by the user. Annotations can be short or long substantial pieces of work and we are planning the ability to add rich text editing tools to them. Annotations also provide a useful way of navigating along the timeline of a clips – clicking on an annotation takes the user to the point on the timeline the annotation is ‘pinned’ to and pauses the player at that point.

Because we are using HTML as our native file format and using URIs to identify distinct items within out Clipper documents then it should be possible to share and publish individual annotations together with the Clipper player lined up and paused at the point in the timeline that the annotation has been pinned to.

Clipper Prototype 2 Demo 5 – Working With Local Files

This video shows how Clipper works with local files on the user’s computer or local network. At the moment, due to the security restrictions of web browsers we are not able to retain the local file path in Clipper documents, apart from that everything else works fine.

We are planning a version of Clipper that would enable users to work offline (for example with field recordings etc.) and then upload their files and Clipper documents have them synchronised.

Creating a Clip: Basic Instructions

  • (Project Dashboard) Go to Project Dashboard
    • Creates new project – give it a name
    • Give the project a description
    • Open the project
  • (Collections Tab) Search Collections for the video you want
  • Identify the video you need – by previewing it in the player (Preview button)
  • Select the video as a resource for the project by clicking on the ‘Add to Project’ button
  • (Project Resources Tab) Open the Project Resources Tab
    • Click on Preview to play the video and reveal the player tools
    • Identify the incident of interest, pause the video
    • Click the Create Clip button – reveals the edit tools
    • Name the Clip
    • Uses the description field to describe the clip / incident
    • Play the clip until you have decided on the end point – pause the clip and set the end point by clicking on the end button
    • Click on Save Clip – the clip and description is added to the Cliplist
  • (Project Cliplist Tab)
    • Your most recently created clip will appear at the top of the list of clips
    • Here you can edit the clip delete it and view the annotations


This is an early prototype so there will certainly be problems, glitches and errors:

  • Make sure you are using a laptop / desktop device
  • Use the Chrome browser
  • If you encounter a problem try refreshing your browser (in Chrome that means clicking on the circular arrow at the top left of the window
  • Try logging in and out again