by Meagan Palatino on 2010-06-25 09:21
You may have noticed that we recently enhanced our skins library by adding a handful of new v5 skins for the JW Player for Flash.
The first batch consisted of 22 JW Player for Flash v5 January 2010 Skin Contest submissions. While we had previously announced just the winners, we received a number of impressive and creative submissions, and wanted to make them all available on the site. You can now find them in our AddOns Library. From Selena (the cheese skin) to Trekkie, they're all there now. Check out the rest of the contest skins here!
Next came the introduction of our second Skin-License Bundle, All Skins by FlashSkins. Created by the design shop FlashSkins for the JW Player v5, these are clear, neutral style skins that work well across all websites. The 12 skins are currently available in our AddOns Library, and you can grab a commercial license from our order page.
One of our recently released and newly featured skins is Glow - a JW Player 5.2 specific skin created by Jeroen Wijering. It is a simple but slick B&W skin resembling the Quicktime X interface. Glow shows off the new features of the 5.2 player skinning model (custom controlbar layout, detailed font control and buffer icon rotation). For those of you who missed it, read more about the new JW Player 5.2 features here.
Stayed tuned for another new all-skins bundle, and a few extra third party skin submissions that we'll be releasing soon. If you are interested in creating and submitting your own skin to our AddOns Library, we encourage you to do so here! For help with building your own skin for the JW Player v5, visit our detailed v5 Skinning Support Guide.
Have fun customizing your player!
by Daniel Taylor on 2010-06-22 12:08
This post will try to peel away some of the layers of confusion surrounding media conversion by describing how media are stored, why you might want to convert from one format to another, and tools you can use to do it.
Transcoding is usually something that happens behind the scenes. For example, when you take a video with a Flip or other handheld video camera and upload it to YouTube, the file is transcoded by YouTube into various formats for distributing and displaying to viewers. You don't see this happening, but it is why videos are not immediately viewable on the site after uploading them. Once the transcoding has finished, you are able to show the video to your users or friends.
To understand what transcoding is, you need to first understand how digital media are stored. A digital media file generally consists of a container with metadata information like the dimensions and duration of the file, along with any number of tracks. Commonly a media file contains an audio track, a video track, and sometimes a subtitle track. Each of these tracks has been encoded (using a codec) into a format that tries to maximize quality while minimizing file size. These encoded tracks are interleaved (or multiplexed) into the container, meaning that they are stored as something like this: a chunk of audio, a chunk of video, the next chunk of audio, the next chunk of video, and so on.
Transcoding is the process of taking digital media, extracting the tracks from the container, decoding those tracks, filtering (e.g. remove noise, scale dimensions, sharpen, etc), encoding the tracks, and multiplexing the new tracks into a new container. Transcoding is most commonly done to convert from one format to another, e.g. converting a DivX AVI file to H.264/AAC in MP4 for delivery to mobile devices, set-top devices, and computers. The basic pipeline looks like the following:
/ decode audio -> filter -> encode \ demultiplex -> decode video -> filter -> encode -> multiplex \ decode subtitles -> filter -> encode /
There are a number of reasons for transcoding your media. You may want to convert a high-quality original edit to a digital distribution format easily sent to customers over the Internet, like H.264/AAC in an MP4 container. Or you may want to convert your high-quality music library, stored in AAC or Vorbis, for your music player that only supports MP3 files. Often, you may want to target a specific platform or device, like Adobe Flash, that supports a limited set of formats and thus need to convert your media library to a suitable format for proper delivery. You may even have old MPEG2 HDV tapes that you want to transcode to H.264 High Profile to save 40% of the storage space while losing no noticeable quality.
Some things to keep in mind about transcoding:
* Quality is not lost with lossless formats, but the vast majority of formats are not lossless!
You will undoubtedly run into many new and confusing terms as you explore the digital media landscape. It's probably best to try and familiarize yourself with some of the more popular containers and codecs.
There are literally dozens of commonly used formats and many, many software packages that can handle converting between different formats for you, though the speed, quality, and supported input and output formats differ between much of the software. There are even online services setup specifically to transcode media for a fee. If you are willing to get your hands dirty it is quite easy to get free and open source tools that will handle most any format you throw at them.
There exist many third party services online that will transcode files (many for a small fee), such as Movavi Online Converter, Media Convert, Zamzar, and more. These services require that you upload the media file to them, then later download the transcoded result back to your system.
It is also possible to convert media files on your own computer, using both free / open source and proprietary software. Free tools such as Media Coder, Handbrake, and VirtualDub will let you convert and even do some basic editing. Quicktime, Any Video Converter, and many other software packages that can be bought offer these features as well. If you are more interested in getting your hands dirty, you can go right to the source of the tools most of these products use to do the actual transcoding: FFmpeg, FAAC, x264, and WebM.
If you're comfortable with the advanced tools, then using Free and Open Source software like FFmpeg and libx264 is highly recommended. You get a community of video experts helping you, and they can be very friendly when you try to help back. You save money by not licensing large proprietary tools and you get some of the best quality output in the industry.
Hopefully you found this brief overview helpful. Watch this space for more in-depth discussion on this subject including: transcoding your first video, selecting the optimal formats & codecs, choosing the right tools, and more. Learn more about Transcoding Best Practices here.
by Jeroen Wijering on 2010-06-07 09:19
To call HTML5 Video a hype would be an understatement. Every week, major tech companies announce improved support or new breakthroughs. Literally hundreds of new blogposts a day pop up on Google's blog search. In this debate, no company is as vocal as Apple.
<video id="videoShowcase" width="848" height="352" src=".../demos/apple-html5-demo-tron_legacy-us-20100601_r848-2cie.mov" poster="... /images/tron_legacy.jpg" loop="loop" autoplay="autoplay" autobuffer="autobuffer"> <img src="... /images/tron_legacy.jpg"> </video>
The loaded video is actually not an MP4 but a MOV. MOV, 99% similar to MP4, is the container format of Apple's Quicktime technology. This video only works on Safari, and in order to play this video in Safari on Windows, a user must have the Quicktime plugin installed. No other browser is able to play the video.
A more standards-based approach would be to use an MP4 video instead of a MOV one, while simultaneously also offering an OGG video. That will work on all HTML5 browsers.
-webkit-mask-image: url(... /images/tron_mask.png); -webkit-mask-repeat: no-repeat; -webkit-mask-size: 100% 100%; -webkit-transform: matrix3d(0.64,0,0.64,0,0,0.83,0,0,-0.53,0,0.76,0,0,0,0,1); -webkit-transform-style: preserve-3d; -webkit-transition-duration: 0.5s; -webkit-transition-timing-function: cubic-bezier(0, 0, 0.58, 1);
This chunk of CSS3 will only render on Webkit-based browsers: Safari and Chrome. Firefox and Opera will not recognize these proprietary style rules.
A more standards-based approach would be to use mask, transform and transition CSS rules using both -webkit-, -moz- and -o- prefixes. Apple could be frank about the draft status of these functionalities and the current differences in browser implementations.
The description below the video mostly talks about Safari's proprietary HTTP streaming technology:
The HTML5 video tag allows you to integrate video within your website’s code. And Safari offers HTTP streaming, so playback quality dynamically adjusts to the available speed of wired or wireless networks — perfect for viewing on mobile devices such as iPad, iPhone, and iPod Touch.
Unfortunately, HTTP Live Streaming only works on the iPad, iPhone, iPod Touch and Mac OSX 10.6 (with Quicktime X). Additionally, the technology requires one to encode videos into an obscure format: hundreds of small MPEG-TS fragments, glued together using M3U8 playlists. These video files are completely useless for any other browser or media player.
A more standards-based approach would be to explain that seeking to non-downloaded parts of the video (like YouTube) is possible. This functionality, using HTTP Range-Requests, is supported by all HTML5 browsers. HTML5 video at large has no capabilities in the area of bandwidth detection and on-the-fly bitrate switching.
Undoubtedly, no one has done as much for HTML5 Video as Apple has to date. However, we must be sure to not overlook the progress Flash made when they started supporting video a couple of years ago. Suddenly it was possible to easily display videos on a page, regardless of browser or operating system. Only one chunk of code and only one video file were needed; plugin daisychains and forced installations were a thing of the past. Due to its ubiquity, Flash effectively enabled the online video surge of the last few years.
Similarly, the big promise of HTML5 Video is of it being a widely adopted and highly standardized technology. While Apple may see it as a means to reach feature parity with Flash, most web developers see it as a simple solution for including video in a webpage without worrying about plugin support. Web standards are about removing incompatibility barriers altogether. They are not about replacing plugins with proprietary browser addons, which is exactly what Apple has done here.
It would be awesome for Apple to start advocating the use of cross-browser HTML5 Video, being honest about what the technology can and cannot do today. Alternatively, it would be great for Apple to tell developers what its demo actually is: an excellent showcase of the video capabilities of its Safari / Quicktime product stack. Regardless, Apple should stop labelling vendor-specific implementations as web standards. It confuses web developers and it will lead to a new era of browser incompatibility that will slow down the overall adoption of HTML5 - and the conveniences it brings to web developers around the world.
Jeroen Wijering and Zachary Ozer
by Pablo Schklowsky on 2010-06-04 17:19
We're pleased to announce the release of the JW Player for Flash Version 5.2. One of the JW Player's strongest features is its flexible skinning model. Our focus for JW5.2 has been on improving on its XML/PNG skinning abilities.
We've also fixed over 30 discrete bugs, and added a number of performance and feature enhancements.
Created by JW himself, the new Glow skin takes advantage of the new 5.2 skinning features. Check it out for yourself:
Not a skin designer? No problem! Just sit back and wait as some sweet new skin submissions begin appearing in our Skins Library. We've also got a few updates for you:
JW Player for Flash Version 5.2 fixes over 30 bugs. Here are a few of the major ones:
To see everything we've done in this release, check out the complete list of changes in JW Player 5.2 on our developer wiki.