Awesome

Create an awesome video to showcase your amazing responsive design working in various resolutions.

Usage

play http://www.google.com 320 480 8

Parameters:

• URL
• Initial viewport width (optional, default value 320)
• Final viewport width (optional, default value 768)
• Video length in seconds (optional, default value 10)

Requirements

• PhantomJS
• ffmpeg

responsive-play browser edition

It's nice to create a responsive video but maybe you just want to on play on your browser. Try it:

http://sergiolopes.github.com/responsive-play/

Articles

There's a nice Smashing Magazine article by Thierry Koblentz about true responsive designs and inifite resolutions support. You shouldn't target specific device sizes but make your design work at all possible sizes:

http://coding.smashingmagazine.com/2012/03/22/device-agnostic-approach-to-responsive-web-design/

responsive-play can help you nicely visualize your page at hundreds of different viewport sizes.

License

Public domain, do whatever you want with the code. If you want to credit me, I'm Sérgio Lopes.