Over at Two Are Better, the videography business Mindy and I started, we’ve finally ordered some custom flash drives. While these are more expensive at the moment, they will soon become cheaper and the future of how we deliver our finished video projects. In my mind physical delivery of video will soon die out, but for many of our couples and clients having a Blu-Ray or even a DVD *gasp* is still the most convenient way for them to consume media. It still baffles me, to some degree, that we have beautiful HD and 4K to capture video in only for it to ultimately be delivered and consumed at far less than HD quality! I do understand that it makes a little more sense when it’s a couple’s Grandparents who don’t see the need to buy a new HD TV and Blu-Ray player. Still this is our art we’re talking about. It’s meant to be seen in it’s full glorius quality! 😛
Nonetheless, I’m sure we will be delivering discs (Blu-Ray & DVD) alongside flash drives for a few years to come. In my perfect world, there would be a really awesome digital delivery service made for this. Something like iTunes where people can watch their videos on any device and anywhere they want.
The whole point of this post then is how do we deliver a similar experience across discs and flash drives, and is this something clients will even appreciate or use? Well, we’re going to find out! I came across this Reddit thread where someone was asking a similar question. The idea then sparked in my head that this would be pretty easy to build with simple HTML & CSS. Essentially using simple markup to create a header, content area, and footer. Embed their videos using the new HTML5 standard <video></video>. Then make it all look pretty with CSS and a few SVG icons we use on our site and disc menus anyway.
Here then is the finished product, an experience using flash drives that matches our disc menus pretty closely. You can navigate to the appropriate videos, scrub through them, full screen them, etc… So with the basic structure up and working I thought it’s time to put this out in the wild. To use this you obviously need a little bit of knowledge editing HTML or CSS files. But think of this as a skeleton for your own flash drives. Things like our font files and SVG icons you probably don’t want to copy, but take the skeleton and make it better. I’ve put this up on BitBucket to start with, so if you are savvy fork the repo and submit pull requests with your improvements.
Some initial items I’m brainstorming for future updates are how to ensure this would work with TVs. If a couple plugged their flash drive into their TV would they be able to play their videos? Also, it’s not obvious to open the index.html file to access the menu. If there is an obvious way that works across platforms (Mac & Windows) and also then plays the videos on all TVs let me know!
The links are below, if you think this is worthwhile and cool let me know. Otherwise, it’s easy to just stick the videos on the flash drives with no menu system.
[button link=”https://bitbucket.org/twoarebetter/wedding-flash-drives/get/1.0.0.zip”]Download[/button][button link=”https://bitbucket.org/twoarebetter/wedding-flash-drives”]View on BitBucket[/button]