We've Launched a New Video Player

If you've watched any videos this week you will have noticed that the video player looks very different. We've been working on this update to our entire video delivery system since the beginning of the year, and we hope you're as excited about it as we are. Delivering video content from our servers to your device is one of the core features of this site. As such, we put a lot of time, effort, and thought into making that experience the best that we could. Here's a quick look at the improvements, followed by more in-depth background on the changes and what they mean for you.

• When you land on a series page, the player is right there, with the first video loaded for you.
• You can watch videos at 1.5x or 2x speed.
• Video pages now display HD and CC icons, making them easier to identify.
• True 720p (1280x720) display of the video player when toggled to full-width.
• Improved resume functionality.
• Progressive download delivery and a new video player, with HTML5 support in almost all browsers.

The Old Way

Since the day we launched Drupalize.Me in 2011 we've been using some form or another of video streaming technology coupled with Flash, for desktops, and the native players for devices we support. When we set out to build our initial video delivery system we weighed the pros and cons of many different options, finally settling on Flash player and RTMPe streaming. Some of the deciding factors at the time, in 2011, were:

• At the time many of our videos were DVD length, streaming them meant we didn't have the bandwidth cost of a 2.5Gb file for someone that only watched 5 minutes, and you didn't have to download 2.5Gb to watch just the last 10 minutes of a video.
• The iOS App Store guidelines require that videos over 10 minuntes in length use streaming.
• In order to reach the greatest number of browsers with the same experience Flash was chosen over the still not widely adopted HTML5 video players.

Deciding to Change

Though, as we all know, technology doesn't stand still. And what was considered best practice even just 3 years ago is in some cases quite antiquated today. RTMPe served us well for a long time, but we've changed the way we do things, and HTML5 video has come a long way over the past few years. So we decided it was time to switch things up a bit. Here are some of the many reasons we decided to make the switch to HTML5 and Progressive Download:

• Support for HTML5 video has dramatically improved and it's possible to serve almost everyone with just the h.264 codec, we no longer would need to maintain h.624, OGG, and WebM versions of all our content.
• We don't make single 3 hour long videos anymore, instead we make a 3 hour long series that's broken up into shorter 5-15 minute lessons. Most lessons weigh in at 100Mb or less once they've been encoded so the bandwidth is easier to fathom.
• We can continue to support streaming for our iOS Apps and anything else that works with HTTP Live Streaming since it's really just a glorified form of progressive download.

Progressive Download Benefits

The biggest factor in our decision to make this switch was you, and your feedback and feature requests that we've received over the years that we simply couldn't address because of the limitations of streaming video. So what does this mean for you?

Probably our most requested video player feature was to be able to increase the playback speed. It's a common method that people use to consume video information in half the time. We've added a new playback speed toggle that allows you to watch videos at 1.5x or 2x their normal speed. This is something we simply couldn't do with the old streaming system.

You can watch all our HD content, in it's full High Definition glory, no matter how slow your connection. With streaming video you essentially need to be able to sustain about 2500kbs throughput to watch our videos in 720p, now you can just let the player buffer for as long as it takes and then start watching. This is a great summary of the difference between streaming and progressive download.

No more stuttering, and skipping. Over the years we've gotten reports about occasional stuttering or skipping problems with our streams. And while we've always worked really hard to fix these problems there are some things like network latency, and other devices on the network that are simply out of our control. And while services like YouTube, and Netflix can afford to place their own private servers in-line at the offices of the ISP in your city, that's a bit beyond our reach. Progressive download allows us to provide the same quality video experience to all of our members, regardless of their connection.

Video Player Redesign

As part of the switch to HTML5 + Progressive Download we knew we were already looking at a pretty significant overhaul of how individual video pages worked behind the scenes, so we decided this would be a good time to re-evaluate how well video pages worked on the surface. We gathered member comments and suggestions, and set about rethinking the whole page. Our main focus was to make the video playing experience as awesome as possible.

We were particularly focused on making it clear where you are in a series, and being able to quickly get to the other videos you want. Adding the full series list of videos right beside the player, we could eliminate the extra click of going to a series page, and then get to the first video page. Aside from making things easier to navigate, this also starts to pave the way for features we would like to introduce in the future, like adding more robust playlist functionality. We also needed to incorporate the new features of a playback speed toggle, and the ability to change the video player to full size. Of course, we also needed to keep an eye on the other important information on the page and make sure you can still find what you need, when you need it.

Once we had our initial ideas in design, we built a prototype of the page so that people could interact with it. With that in place, we invited some people to come and test it out. We had several members help out with this, along with a user testing service to provide complete strangers to the site. We also pulled on the great resource of the larger Lullabot team. We got an amazing amount of feedback, and updated a number of features on the page to get the final product you see today.

As you can see, there has been a lot of time and thought put into the new video system. If you have comments or suggestions about this change, or anything else on the site, please do let us know. We love getting feedback, since that's how we can make sure we keep improving.