I was tasked to create a single-page-interface website for documentarian filmmaker, playwright and environmental activist Josh Fox. The site serves primarily as a VOD locus for all of his feature-length films. It also provides a secondary purpose as a social fundraising platform and a gateway to his other project websites. The opening animation sequence, done entirely with HTML5 keyframes, highlights the duality of his personal mission: art (film and theatre) and activism (rallies and live events).
Introduction Sequence
Animation Artwork
Staged 'Sticky' Headers
The scroll-driven interface sequences through a series of headers that scroll to the top of the window and then fix in place, indexing the various sections of the page. This was achieved with a custom Jquery script to accomodate all devices and orientation changes.
Donation Modal Overlay
Visitors are prompted to make donations via a modal overlay that scrolls along with the VOD section and then fixes in the center of the window. Donations are optional however; this is a ‘soft’ gated site. Visitors can click to donate later or to just remove the modal.
Single-page interface
Opening Animation
About
VOD
Donate Modal
Modal
VOD Streaming Section
Donation Pane
Call to Action
Footer
Ftr