For this aspect of my project, I envisioned writing my story in the form of a scrolling multimedia piece. The inspiration behind this vision was the iconic “Snow Fall” article done by the New York Times. It took the New York Times over a month to create the piece, using a staff of over 60 people.
Ideally I pictured a website where, on one side of the screen, a time-lapse video of a full wedding played as the user scrolled down. As the user reached different parts of the wedding via this scroll, the left hand side of the screen would describe that part of the wedding, incorporating videos, images, and interviews with professionals.
I had this ideal result in my head, and it all sounded grand and dandy until I remembered that I lacked both the resources and the multimedia knowledge to actually create it. Then came a tweet from the wonderful Suzi Steffens, encouraging us to try a startup program entitled “Scroll Kit,” a new content editor that claimed to replicate “Snow Fall” in an hour.
The problem with a startup such as Scroll Kit lies in the lack of troubleshooting. You must figure it out on your own and fix it on your own. So, without much further ado, here is my attempt at creating a scrolling multimedia masterpiece. Step by painful step.
There are layers, which are nothing like Photoshop layers. They are essentially sections, and do not layer on top of each other (like I had so desperately hoped).
After getting a handle on text and background, my page was looking decent. It was clean and elegant like I wanted, but had yet to integrate any multimedia aspects. I played around with making the background a video (“Snow Fall” inspired), but it required an H.264 format source, which I couldn’t figure out.
Instead, I embedded my videos, which proved to be surprisingly easy. They provide a box in the “Add on” section where you can copy and paste an embed code. I added my interactive Google map in this manner as well. Easy!
If you click on the iPhone icon, you can see how your Scroll would look (hypothetically) when viewed on a mobile device. Cool!
Until you realize that something went horribly wrong.
I could not figure out why the top strip was not showing correctly. It looks like a coding error, but does not show up like this on any of the views within the program. Even when I entirely redid the top portion, it looked the same.
The text also did not scroll separately from the background image like I had hoped. The programmers then added a “skrollr” button, which appeared at first to do exactly what I wanted. I played with this for about an hour, adding multiple layers of what I thought would create a lovely scroll. I have yet to see it work, but have hopes that I’ll be able to troubleshoot it eventually.
Until then, you can see my Scroll attempt here.
In related news, here is an article about the New York Times and Scroll Kit’s disagreements.
Remember to follow me on Twitter!