No description, website, or topics provided.
JavaScript
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
img
js
.gitignore
cues.js
index.html
jquery.jscrollpane.css
player_small.html
readme.md
small.html
style.css
style_small.css

readme.md

Popcorn visual radio demo (radiobimbo) The popcorn visual radio demo is a prototype showcasing complementary content alongside linear audio content with the goal of having a more entertaining non-linear listening experience. It's bimbofied radio content.

////// TO-DO //////////

0.1

  • Layouts for different types of content
  • Triggered popcorn events that can also be experience through click actions (google maps, images,etc.)
  • Triggered SVG animations
  • Color code related to type of content (ex: blue palette for music, green palette for transitions)
  • Better easing script for scroll transitions
  • Make sure all the licenses are respected
  • Mockup media box

  • Player that works across all browsers @done (mediaelement player)

  • First rough version of the visual timeline @done

0.2

  • Flip instead of scroll for ipad
  • Ipad / iphone compatibility for the fixed div
  • Player that works on mobile webkit (maybe jplayer instead of mediaelementplayer)
  • Automated visual timeline creation
  • Simplified cue points and structure
  • Browsable media box
  • Browse additionnal content in the DIV, popcorn interactions in div changes (main text)

  • Load media box previews in the mainbox, in sync with the narrator's story, to illustrate what he's saying. Media box can also be browsed through click interactions.

0.3

  • «Flipboard» style browsing of additionnal content. Where a block of content can overlap all others.

Feature list

  • Some sort of snapping feature so that when you reach the top edge of a block of content, you feel it could be snapped it the right position.
  • Trigger scroll events in div when the narration is playing.