Skip to content

Instantly share code, notes, and snippets.

@tzmartin
Created June 20, 2017 06:18
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save tzmartin/38826c2ecba400ac1c733b7f0e29d8f2 to your computer and use it in GitHub Desktop.
Save tzmartin/38826c2ecba400ac1c733b7f0e29d8f2 to your computer and use it in GitHub Desktop.
PopcornJS Demo

PopcornJS Demos

Mozilla no longer maintains PopcornJS and the demos are no longer on the site. Here are the previously listed demos for posterity:

A slideshare deck synchronized with a Youtube video

[demo]

French broadcaster France Culture used popcorn to tell the story of HellFest

[demo]

Uses Popcorn to synchronize code walkthroughs with rendered results

[demo]

NPR used Popcorn to explore William Carlos Willian's "Summer Song"

[demo]

Uses Popcorn to mix visualizations of outer space, interview footage and Google Sky

[demo]

A short documentary about peer learning at Ryerson University

[demo]

A Crowdsourced Music/Visual Composition.

[demo]

A tool for rapid prototyping slide presentations in HTML5

[demo]

A french documentary about freedom of press in France. The footage has been captured by students of the photojournalism class of the emi-cfd school in Paris.

[demo]

Explore the public spaces of Zaragoza, the capital of Aragón, in northeastern Spain.

[demo]

"The demo shows how you can play a video in an enriched context, by linking open data sources to terms that are found in speech transcripts rendered from videos. For the Code Camping event, organized by Open Cultuur Data (Open Cultural Data) I extended the demo with newly linked data sets."

[demo]

A demonstration of various technologies developed by the TexMex team (INRIA - France), using Popcorn to display automatic chaptering information and named entities detection of news bulletins

[demo]

This multimedia feature about political jokes in former Eastern Germany / GDR uses Popcorn.js to show further links, context and subtitles in the video. (German)

[demo]

Uses the Popcorn code plugin to execute an ascii art generator at key moments in a video.

[demo]

Uses the January 28th speech by Hosni Mubarak as a launch pad for events surrounding the Egyptian revolution.

[demo]

A custom popcorn plugin provides contemporary translation of Macbeth

[demo]

Popcorn-enhanced skateboarding video

[demo]

A hypervideo music documentary exploring the friendship and musical/ spiritual bond between Bruce Springsteen and Clarence Clemons

[demo]

A great showcase of having popcorn content play simultaneously on 2 screens – imagine a television show with related content on your tablet. Find the code on Github: https://github.com/dseif/peerbind/tree/piratebay

[demo]

An augmented experimented with the upcoming documentary “The Pirate Bay – Away From Keyboard”

[demo]

This demo uses canvas to detect and track the position of specific blocks of color on the video using Popcornjs to sync content

[demo]

An exploration of genealogy and the descendants of WWI veterans

[demo]

Learn more about those who have died via gun violence in Chicago

[demo]

Grockit Answers uses Popcorn.js to provide answers for learners.

[demo]

A map based documentary

[demo]

Youth filmmakers at the Bay Area Video Coalition's Factory program created this web native audio exploration of the Black Panther Party.

[demo]

A Popcorn-powered examination of the role California veterans played in WWII.

[demo]

Catalan Open Education Resources for learning open web technologies. Uses Popcorn.js to illustrate examples from across the web.

[demo]

Uses popcorn for a clickable transcript and timed resources

[demo]

Web documentary using popcorn for bonus material

[demo]

Collage video remix uses popcorn to pop up video samples and provide links.

[demo]

An audio demo that uses popcorn to fuse soundcloud, flickr and audio content

[demo]

An online programming course that uses popcorn.js to synchronize examples to narration

[demo]

An interactive webfiction using popcorn to show descriptions, locations and social comments.

[demo]

Full screen video uses popcorn.js for dynamic overlays

[demo]

A popcorn mashup of youtube, Khan Academy, and HTML5

[demo]

Satirical remix uses popcorn to cite video and audio samples.

[demo]

A student uses popcorn to site examples and synchronize video content with web resources

[demo]

Popcorn + WebGL demo

[demo]

Explanation of the Graffiti Markup Language that uses popcorn to surface + sync GML tags

[demo]

Radio program uses popcorn to add contextual links

[demo]

Annotated video with footnotes and map

[demo]

A Popcorn powered Karaoke player

[demo]

TV/Web Simulcast uses popcorn to add annotations.

[demo]

The original popcorn demo demonstrates several plugins at once.

[demo]

Obama's State Of The Union speech with popcorn annotation

[demo]

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment