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 //////////
- 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
- 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.
- «Flipboard» style browsing of additionnal content. Where a block of content can overlap all others.
- 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.