An audio drama booklet using Bootstrap 3 Carousel, html5 audio, and an automated sound mixer sequence script.
This app is a DOM based Stations of the Cross.
version: v0.1.2 (this project was revisited after over a year of being stale)
- Minor cosmetic tweaks. Flushed old repo and reuploaded
- Updates to .mp3 stems
- Updated to the newest Bootstrap 3
- New file paths
- Subltle color change upon station progress
- Modified the mixer automations within json script
- This is an interactive audio drama & e-booklet html page.
- Audio dynamically changes between carousel pages via a predefined json event sequence.
- Javascript was used to take a single big image and slice it into segments to form a booklet sequence.
The Stations of the Cross or the Way of the Cross, refers to a series of images depicting Jesus Christ on the day of his crucifixion.
Guide:
-
This App is intended to be read at a story telling pace. The sound score gradually evolves with the story. The pictures and the words are supposed to compliment each other.
-
If your scroll though this too fast... you will miss the contexual details I composed into this app.
-
I wanted to keep this small, so the sound variety is a bit limited. Less than 7 MB, about the size of 1 full length song. (You can write your own piece if you are musically inclined.)
Graphic Artwork Used:
This page is dynamically generated with javascript.
No sound. this is just to show the primary UI mechanics from the original prototype version.
- Demo Video: The recording was made in an earlier stage of code development.
| Version | Codeply API | Note: |
|---|---|---|
| v0.1 | Run Demo | streaming audio path no longer works, currently need a different sound file server |