Workshop on Open Video with HTML 5

 

> Introduction
> Objetives
> Program
> Who is addressed to

 

Introduction

The introduction of HTML5 standards and the new <video> tag (and others like <canvas> or <audio>) opens new possibilities for audiovisuals in Internet and brings a stronger dimension to this field. With this advance appears Open Video.

Open Video brings access to the non-proprietary format networks and allows a prolific union of video elements with simple JavaScript language (implemented in all browsers), capable of modifying video in various ways.

A new scenario for online video seems to be emerging as this format becomes more organically integrated with the browser and connects in diverse ways with other elements. This allows new possibilities for interactivity among these elements as well as with the user by subverting the logic of traditional audiovisual narrative, its presentation and the notion of “gender”.

 

Objetives

Aiming to create an interactive multimedia content functioning similarly to the web, the Open Video workshop presents the possibilities of HTML5 and technologies related with these standards. We aim to learn its tools, utilities and working methods in order to synchronize contents of diverse sources with video and audio, which will make these contents respond to interactions with the users and be applied to the creation of new websites.

 

Program

The program is divided in three sessions from 10:00am-2:00pm.

03.13.2012 /10:00am-2:00pm: Theoretical Introduction

• Introduction to HTML5 through detailed examples on the technologies.
• Introduction to Open Video/Audio, common places, resources and possibilities.
• Frameworks managing HTML5 media elements: popcornjs and $media.
• Upcoming technologies: CSS for video, webytt, etc.
• Basic examples step by step.

03.14.2012/10:00 am-2.00pm: Practical Cases

• Define chapters in a video/audio and jump from one to the other using only Javascript.
• Include subtitles in a video (in various languages) using iquery media.
• Define programmed responses to the user´s interaction using iquery media.
• Manually synchronize content with a video using popcornjs.
• Practice in groups: management of user events + synchronizing content (using iquery media).

03.15.2012/ 10:00 am- 2:00 pm: Collaborative Project
Based in a collaborative development of the project using resources known in previous sessions. The process of creating a collective demo implies:

• Defining contents and interactivity
• Recording video cuts
• Creating/Selecting synchronized content
• Creating subtitles
• Interface layout and design
• Web publishing

 

Who is addressed to

This workshop is addressed to anyone interested in learning and practicing Open Video´s new possibilities in relation to the new HTML5 standards, as well as JavaScript and CSS3 languages. The idea is to generate a shared, self-guided working and learning context in which each participant can bring their own knowledge and lines of experimentation to the table. Basic knowledge of HTML, CSS and Javascript are valued.

More information on Videoframesh on the wiki.