Responsive design is a must-have feature for today’s transmedia projects. There’s nothing worse that using your smartphone to access a web page that is a key element of a transmedia story that has captured your attention and have poor design make it impossible to read the page.
The proliferation of mobile devices with different screen sizes and resolutions has made the job of designing web pages immensely more complex. Responsive design is an approach that automatically adjusts web pages and their content (i.e. text, still images, and video) to fit any size screen.
If you are viewing this post on a computer, resize the window and watch how the video below adjusts automatically. If you are reading this on a mobile device, turn it from vertical (portrait) to horizontal (landscape) view and watch the video resize.
If you are a transmedia designer, creating responsive layouts is something you or a member of your team will need to master.
Code for the responsive video container is at http://www.jonsuh.com/blog/tutorials/responsive-youtube-vimeo-embed-and-html5-video-with-css/
By the way, the video is Tim McMorris’ Overwhelmed. I first heard part of it on a Samuel Adams beer ad and couldn’t get it out of my head. Don’t you hate when that happens. Fortunately McMorris does some great stuff, so Overwhelmed rattling around in my head for hours wasn’t so bad. You can check out his YouTube channel for this video and samples of his other songs or find them on iTunes.
Transmedia storytellers can include some of McMorris’ music in their own projects. He has royalty-free tracks available for as little as $14 and will take on custom projects. Check out his website for details.