Adobe TV On These Screens? Believe It!

We just launched Adobe TV Mobile, which means you can now watch all your favorite Adobe TV videos on your iPad, iPhone, iPod, Android phone, and Android tablet.  Simply visit from your tablet or phone and you’ll be automatically re-directed to an optimized experience for your device.

Why did we do this? Plain and simple, it is by far the #1 feature request from our audience. And it was no small task.  I am really proud of what my team has accomplished with this, and once I’ve gotten some sleep I’ll be sharing some of the challenges we faced in pulling this off.

But, to be honest, this post has an additional intent, other than the self-promotional aspect. I want to emphasize the following: we added iPad/iPhone support because our customers asked for it. It’s that simple. There’s no subtext related to Flash, which we continue to use to deliver our content onto Flash-supported devices. We believe in delivering our content to all platforms and devices that are meaningful to our audience. We also believe in using our own tools, the best authoring tools on the planet, to create cross-platform, cross-device experiences.

We hope you enjoy Adobe TV mobile. Please let me know your impressions in the comments!

Adobe TV Community Translation and Professional Translators

Hi Folks:

I’d like to offer some more background on the Adobe TV Community Translation program, and respond to some of the concerns recently expressed to me.

We actually do employ paid, professional translators to translate our content into French, German, and Japanese.  This content can be found at,, and, respectively.

We have no plans to discontinue the use of paid, professional translators, whose services we value tremendously.  We dedicate a tremendous amount of resources to professional translation.  In fact, it is one of the single largest line-items in the Adobe TV budget.

Our goal for Community Translation is not to replace professional translation. We are not seeking out professional translators and asking them to work for free.  Our goal is to give Adobe product users a way to help people in their countries who do not speak English.  We want to extend the availability of our content to people who would not otherwise have the opportunity to benefit from it, mainly in those countries where Adobe does not provide localized learning content.

We believe Community Translation is an appropriate supplement to, not replacement for, the professional translations we already do.

All The Bells & Whistles of MLB.TV (Part 1)

(Disclaimer/Guarantee – I’ve been an MLB.TV subscriber ever since it launched as a paid service, and am also an avid baseball fan, so expect this entry to be loaded with heaps of bias.)

Major League Baseball was one of the first (if not the first) Internet TV success stories, outside of the porn business, with their MLB.TV streaming service. They began dabbling in streaming live baseball games back in 2002 (they did 30 that year), and today you can watch all ~2,400 games per season, both live and on-demand, with some of the best HD-quality streaming & playback available anywhere.

For the privilege of access to MLB.TV, which offers up this feast of baseball, you have to pony up $20-25/month (depending on whether you want the basic or “Premium” package) or buy the entire season for $100-120. And the catch is this only gets you “out-of-market” and “non-national-broadcast” games. Which means you cannot watch

  • Your local team
  • Any game broadcast nationally on FOX or ESPN (although the ESPN games are available on Internet TV via ESPN3)
  • All playoff & World Series games

Major League Baseball is one of the few true monopoly enterprises in the United States, and the myriad contracts they have in place with local rights owners (e.g. Comcast & the local NBC affiliate here in the San Francisco Bay Area) means the local cable/satelite operators still trump Internet TV where viewing rights are concerned.

In my case, it’s because Comcast still wants me to buy a cable subscription to watch my local team, the SF Giants. In some markets you can get around this, if your cable operator has struck a special deal with MLB (SD Padres is an example of one of the few teams which have this going), and you pay an additional fee on top of your cable and MLB.TV subscriptions – holy mackerel that’s alot of dough just to watch ballgames.

But I digress, as I’m getting into a very thorny issue that warrants it’s own post. Let’s get back to a look at the Bells & Whistles of MLB.TV, which in the context of an Internet TV experience I define as the following:

Anything that you don’t need to enjoy the simple pleasure of watching the ball game.

There are a few different ways to get to the player, but I generally look at a list of the day’s games on and make my selection there.


If you bought the Basic package, you get the home-team’s broadcast only, whereas if you sprung for the Premium subscription you can choose the home or away broadcasts. As far as I’m concerned, listening to the opposing team’s broadcast is bad ju-ju. Baaaaad ju-ju. So I’m one of the shmos that pays the extra bucks for that feature alone (n.b. the Premium subcription also gets you higher bitrates, DVR functionality, and some additional Bells & Whistles).

So, let’s start with the stuff that has nothing to do with watching the game.

How important these features may or may not be to you boil down to whether you:

  • Follow the entire league, as opposed to just one team
  • Participate in a “fantasy league”
  • Just like to jump around between different games in progress

For the sake of this post, let’s call people who fall into one of these categories the “Lunatic Fringe

If you’re not part of the Lunatic Fringe, 95% of the Bells & Whistles on MLB.TV will likely be useless to you.

Upon entry to MLB.TV (which happens after the player tries to detect your location and verify that you’re not blacked-out of the game you’ve requested) the Player opens in a pop-up window and thankfully it’s default state is relatively uncluttered, with feature buttons lining the player below and above:


The first thing a Lunatic Fringe member might want to do is to jump around between games in progress. Clicking “Today’s Games” initiates a push-transition of the video, which slides to the left and shrinks in size somewhat as the “Today’s Games” menu is revealed.


I’m a big fan of this type of transition, as it holds continuity with the video and you always get a sense that it’s all connected.

The menu itself is straightforward, and gives the option to “hide scores” for those wanting to watch games later on without knowing the outcome for “maximum suspense effect” (I had a Lunatic Fringe roommate back in college who would tape games on his VCR and watch them later — if you told him the score before he had a chance to watch the tape, he would commit an atrocity against your belongings. — so, based on this experience, let’s just call this one a “key feature” for these guys).


Clicking on a game in progress brings you to that game (unless it is blacked out where you’re watching). You also get access to the full on-demand library of all games played in the current season, and the menu contained within the “Archive” button lets you search by Date or Team.


Here, I’ve selected SF Giants vs LA Dodgers, and it gives me a list of all the games played between these 2 teams this season, sorted by “earliest first”. The only thing missing here is the actual Game Date, a pretty conspicuous omission. Even though you can search by date, I would like to see the dates attached to the games when I search by team.

Moving down to the row of buttons that appears on the lower-left of the Player, the Highlights button reveals the highlights of the game currently being watched.


This list gets populated as the game progresses, but the amount of time it takes for a new highlight to appear can vary dramatically (anywhere from 30 seconds to 10 minutes, I’ve seen it take as long as 15 in some instances). I wonder what in the workflow of creating the highlight clips causes this…


You can also view the highlights from all games in progress in the entire league, by clicking “Around the League.”

Viewing highlights from the current game is one of the few Bells & Whistles features that the non-Lunatic Fringe user will actually use — e.g. you join a game-in-progress and want to see the important plays you missed.

Then, if you want to get to the “scorecard-keeper” level of Lunatic Fringe (which is one step removed from the next level, where you are at the game itself, listening to the broadcast on a headset radio, keeping a scorecard, and sitting on a foam-rubber-seat-cushion you brought to the game . . . ) Well, you can see a list of every single play:


And if that ain’t enough, you’ve got the entire boxscore.


OK, that stuff isn’t as uber-baseball-nerdy as I’m making it out to be, but now we start to get to the territory of things that matter only if you participate in a “fantasy league” where you’re more interested in tracking individual players as opposed to teams.


The “Player Tracker” is a very simple UI that lets you add the players you’re interested in following, and it gives you the option of getting an alert when that player comes up to bat.

Adding players to the list is really simple, you just select the team and the roster appears.


I just used this feature for the first time while writing this post, and was really impressed by the simple, effective UI design. So, the next time Buster Posey is at bat, I’ll get an alarm telling me to switch over to the Giants game and watch him. But, wait, I can’t because I live in SF and the Giants are blacked-out here.

Last, but not least, we have the omnipresent Twitter widget which lets you tweet directly from the Player and view tweets with the hashtag related to to the team you’re watching.


If you’ve got a live online event going on these days, and you don’t have Twitter integration, you’re nowhere (I’m being kinda-sorta faceitious) as this has seemingly become a de-reguer part of any “live online broadcast”. I enjoy ballpark trash talk as much as the next guy, and this is the closest you can get to that, I guess, without actually watching the game with someone. But for me, personally, nothing beats the in-person interaction which is why you can often find me at the 24 Willie Mays Plaza Office when there’s a day game on.

Just Get Started, Simply – Like Zappos Did

Online shoe-retailer Zappos has been a poster child of sorts within the “Online Video Nerd Herd” community for the past few months. They’ve got one of the fastest growing Internet TV video libraries in the world, and according to articles on like this one on the blog ReelSEO they’re having great success with it. The article states:

“those videos are said to have a sales impact of 6 to 30% which has prompted Zappos to strive for 50,000 videos next year (they have about 8,000 currently) they’ve got 10 studios working full-time cranking out all this content.

While the stat in that quote doesn’t actually mean anything (e.g. what is the definition of “sales impact” — revenue? Something else? 6-30% is a huge range, is it closer to 6% or 30%?), what I do see as a clear success indicator is the investment they’re making in production, in order to ramp up to that volume of content. 50,000 videos is ALOT.

Well, what is all this video content anyway? Shoe demonstrations. Maybe as boring as it gets.


And they’re presented by average, seemingly random, Zappos employees. Ordinary folks.

Now, for the record, I’ve never bought any article of clothing online, but watching a few of these video demos I definitely get a sense of the shoe in a way that I would never get with any of the other online retail “show me the product “options I’m aware of (if anyone want’s to school me otherwise, let ‘er rip . . . )

While this might be a nice topic for a case study later on, I’m writing this because I want to point out how FREAKING SIMPLE their player implementation is. It’s actually done in the same exact way I described in a post from a few days ago on how to make your own basic Internet TV Video Player and Webpage. Couldn’t be simpler.

Each of these videos takes literally a few minutes to deploy.

Now, I also read in the blog article I linked to at the top of this post, that Zappos is rolling out some more developed, interactive video UI’s as well, so we’ll see how this evolves over time.

The point I want to make, especially for those of you just getting started with this, is JUST GET STARTED AND DO IT, SIMPLY! It really doesn’t take that much to get going. Believe it or not, it’s still the wild west out here in the Internet TV world, and there are still a gazillion ways to skin the proverbial cat. So just go for it, and figure out the finer points as you go along.

UX Case Study: ESPN3 (Part 2)– The Stuff Outside the Video Box

In the previous chapter, I termed ESPN3 “player centric” because the compact design focuses on the Video Player, where it rightly should in this user scenario.

Even with the maximum amount of stuff possible going on, given the options, the focus stays on the player although in the example below where I’ve got 4 different events playing back simultaneoulsly, this does start to fall apart somewhat.


What remains impressive is that this works at all. I’ve got both live and on-demand sporting events of an extremely wide-variety playing back simultaneously (European Soccer, NCAA Lacrosse, International Cricket, and Georgia Bass Fishing — as in the U.S. state Georgia, not the country Georgia, although I’ll bet a Bass Fishing show from the country Georgia would be a frikkin’ gas . . . )


OK, maybe not.

The Mosaic view does make sense in full-screen mode (as shown above). It all looks pretty good as well, as long as you’re sporting internet connectivity of 1mbps sustained, or better.


Less is always more with a design of this nature. Anything outside the Video Player better be damn important to the end-user, and consistent with brand.

Below-the-player content is what caught my eye first in this design. My brain thought it would give me more choices of sporting events that are live now. And that is the case with the thumbnails at the bottom (and where there aren’t at least 4 events currently live, you get “recommended” featured on-demand content).


Above the thumbnails, there is a widget which displays a live feed of sports scores, which at the moment defaults to MLB games (because it’s baseball season, I guess). If you want to get scores from other sports, the UI cascades out nicely to show you the available options, all the way down to that most esoteric of selections, ANY kind of sport from Paraguay.


Over to the right side of the player, we get some stuff that’s useful, and some other stuff that’s redundant (or perhaps could be integrated with the scores & thumbnails at the bottom of the UI to save some real-estate).


The “Featured Events” panel seems to be 100% redundant to the thumbs at the bottom, showing “Featured Events” (even though not labeled as such). No reason for this to be here, other than to flush out the geometry of the design (and that’s a pretty weak reason IMO).

The Stats would/could be useful, if there were any for this particular event. And then, maybe even we could move this to below the player instead, as a tab within the Scores panel (maybe I’m being hasty here — if there were some useful stats in that panel now, I could be able to make a more informed opinion — let me come back to this one at a later time).

The Chat Panel seems really straighforward, although I’d like a glimpse of how many users are in this particular chat room, and how many chat rooms (with how many users, respectively) are online related to this event. I’ve also not yet tested how it behaves if you’re using Mosaic view (i.e., does it flip to the event that has currently has focus, when you’re viewing 4 events simultaneously? As a random thought, it could be a cool design to have 4 chat pods open simultaneous with the 4 events, to be able to keep 4 chats going at once. A sports geek’s geek-out dream come true!).

UX Case Study: ESPN3 (Part 1)– “Just” The Next ESPN TV Channel

ESPN, “The Worldwide Leader in Sports,” is rightly recognized as the most ubiquitous TV sports network in existence (although I do wish they’d reach back in time and bring Howard Cosell back).

In my road warrior days, there was a 90% chance that no matter what hotel room I found myself in, on any given day, on any continent in the world, there would be at least 1 ESPN channel on the TV. So, it’s a watershed event of sorts — the recent rebrand/relaunch of the ESPN “web video portal” to ESPN3. The branding implication, to the global audience, is this is the next ESPN channel, just like the ESPN and ESPN2 channels you know and love on your TV set. You can expect it to be just as good.

At this point in history, it’s still a bold move for a franchise as grand as ESPN to stake the brand on the notion that the “web video” experience is going to give you a user experience that measures up to what you get on your TV set.

Let’s take a look at what happens when you point your browser at


Well, depending on who your ISP is, something may happen, or you might just get a “sorry, charlie” message. I’m writing this from my home office, where I have a DSL connection via AT&T, so I get the landing page, adorned with a “Powered by AT&T” logo in the upper-right hand corner. You need to be connected via one of the “ESPN Participating Internet Service Providers” or else you can’t access the site.

This is a “kinda-sorta” pay-to-view scenario, and it keeps the “value perception of the brand” high. The idea is that you can never watch ESPN for free, and conceptually making it free for everyone could “devalue” the brand in a certain way (i.e. if you expect to get it for free, why would you ever pay for it)?

So, assuming you can get to it, here’s where you wind up:



The UX is really geared towards live broadcasts of live sporting events. Clean and simple, with upcoming events clearly laid out, ordered by date & time, directly below the FMA space. You can also view listings of events currently in progress, or an archive of on-demand versions of past events.

The range of content available mirrors that on ESPN’s traditional channels — a mixed bag of top-tier league events like MLB and NBA games, global tournaments like the French Open tennis, as well as oddball items like Bass Fishing and Australian Rules Football (if you’ve never seen it, you should watch at least once, and see if you can figure out what in the heck is going on because I sure can’t).

Clicking on the listing of an event currently in progress, or the “Watch Now” button, opens the player in a separate window. This is where the actual content viewing happens, and where the rest of the UX ultimately lives (the Landing Page was really just an entry point — once you’ve got the player open you never need to go backwards). So, even though they did a good job of making the “Watch Now” button stand out from a color-palette perspective, without making it obnoxious or pulling it away from nav-bar, I’m wondering if there’s something I’m missing here in that it makes no sense to me why they wouldn’t take you to the player from the get-go. Do we really need the Landing Page at all?



The pop-up page that contains the player is a very “player-centric” design, in that all of the non-player content wraps around the player, and makes the whole thing feel centered and integrated around the video. It also gives me a sense that there’s lots of video content to choose from and, other familiar ESPN features like up-to-the minute scores & stats lend it a familiar, “TV-like, on-brand” feel, although a chat pod in the lower-right corner rolls in a contemporary feature of Internet TV, the “virtual shared viewing experience.” My first impression is they’ve retained the “goodness” of the broadcast version of ESPN, while nudging gently into some internet-specific functionality.

I’ll get more in-depth into the content around the player in a later post. For now, I want to focus on the Video Player itself. One thing that keeps this “feeling like ESPN” is the way they Pillarbox the 4:3 video appearing in this example with the ESPN3 logo (exactly how they Pillarbox on the ESPN broadcast channels).


There is also a complete absence of player Chrome around the top and sides, and a very simple timeline below, which obscures the controls in it’s default state. It also gives us the name of the event being watched, which is useful given the amount of content available at any given time.

When you mouse-over the video, the timeline appears, as well as controls to adjust Video Quality and Volume.


Much like many contemporary Internet TV channels, ESPN3 offers Dynamic Bitrate Switching (termed on this site as “Auto Adjust”) which serves up the best-quality bitrate you can handle at any given time. This is the default setting (which is exactly what it should be for the average Internet TV watcher), but you can set the bitrate manually, should you decide to “live dangerously.”

My only “suggestment for improvement” is how the CTI (current-time-indicator, the little thingy on the timeline that you can drag left-or-right to move forward or backward in time) can only be dragged. You can’t click on the timeline where you want it to go, and have it jump there (a feature which is very common these days, and which many users expect).

The three buttons on the lower-right let you toggle between the viewing states: Standard, Fullscreen, and Mosaic.


The Mosaic view lets you watch up to 4 events at once, but unless you have a really fast connection the viewing experience can still be dicey.

The Mosaic view, IMO, caters solely to sports junkies, sports gamblers, and fantasy-league participants, who really want/need to be able to track multiple sporting events simultaneously. For the casual viewer, it really serves no useful purpose. That being said, a good portion of ESPN’s base are sports junkies, sports gamblers, and fantasy-league participants. So this is a key feature for this Internet TV channel (as well as most Internet TV channels that cater to sports fans) and definitely starts to get you into the zone of “this is something I probably can’t do on my TV set today.”

The way you get content into this Mosaic view is either by drag/drop or going to the interactive calendar which also drives the PIP (picture-in-picture) feature. Since I believe this one is a bit more useful to the average viewer, let’s take a look at how it works (keeping in mind getting content into the Mosaic view pretty much works the same way).

In the mouse-over state of the player, an “Add PIP” button appears in the upper-right corner. Clicking on it brings up a simple dialog.


Clicking “Choose An Event” opens the interactive calendar, which appears as an overlay on top of the video player. It also shows you the video you’re currently watching on the right side.


This appears to me to be a crack at something similar to an interactive programming guide on a Cable or Satelite subscription. The only problem with it’s current implementation is that is just appears onscreen abruptly, and it took me a moment to understand what I was looking at (in particular, the video itself didn’t feel like a continuous experience). What I’d like to see would be for the interactive calendar to appear via a transition, which would push the video off to the right and have the listings fade up on the left. Would really make the whole thing feel connected — right now it feels a little disjointed.

This one complaint aside, at this point it’s easy to locate a “Replay” on-demand clip, or any live event currently underway (at the time of this writing, early on a Monday morning, there were no live events underway, so I loaded in a replay of one of the French Open matches).


The bad news is that the PIP window is simply way too small to see what the heck is happening, and there’s no way to resize it (although you can position it wherever you want). I can’t really see the usefulness, unless you go into fullscreen mode (but the ESPN3 branding on the Pillarbox goes away, which is probably good if you’re the end-user but not-so-good if you’re ESPN).


I’m watching this on my laptop which has a 17-inch screen, and at this point I can actually see the tennis ball in the PIP which is pretty darn good.

Part 2 to come shortly . . .

Internet TV Technical Basics: Video Compression

Have you ever heard that Texas expression that goes something like this:

“That”s like trying to stuff 10 pounds of manure into a 5 pound bag”

Let’s consider that expression as an analogy to what one needs to do in order to get a video file delivered from some server in god-knows-where over the public Internet to whatever device you choose to view it on.

So, how exactly DOES one stuff 10lbs of crap into a 5lb bag?

Well, if there are some gaps of air in it, you can compress it somewhat and get more in the bag, right? No, wait, we’re talking about air here, it doesn’t weigh anything. Scratch that.

Well, you physics majors out there realize there’s no way you can get that 10lbs into the 5lb bag. The only thing you can do is leave some of it behind. So what can you leave behind, and still retain the ESSENCE AND INTEGRITY of the dung (OK, this analogy has gone way too far and ends here).

When you watch Internet TV, the pipe that connects the your computer to the server where the video is stored is in a state of constant fluctuation. How much data can get through that pipe changes from moment to moment.

Think of the video as your “10 pounds of manure” and the pipe can only get 5 pounds through at this instant, but maybe in a few seconds it can only take 3, and then a few seconds later it can handle 7. What needs to happen in order for that video to get through that pipe, is for it to get Compressed, which means getting rid of some of the data that makes up the digital video file, while maintaining its ESSENCE AND INTEGRITY.

In video production, we tend to work with very large video files which are either uncompressed (which maintains 100% integrity, meaning the files contain all of the visual information that the camera captured when the video was recorded), or are compressed to an extent that you can’t see any difference from the uncompressed file (this is defined as Lossless Compression).

You simply can’t deliver these huge files we use in production over the public Internet. Nobody in the universe has a connection fast enough. So we need to Compress the video to a Lossy Compression format, which will degrade the integrity of the video to some extent.

Every single video standard that works for Internet TV involves Lossy Compression.

As time goes on, and technical innovation continues, new and better Compression algorithms become available that let you get better quality at a lower Bitrate.

So what’s a Bitrate?

Basically, your internet connection is like that pipe I was talking about earlier — you can only get so much data through at any given time. So let’s say your “average throughput” is 700kbps (kilobits per second). If the video you are watching was Compressed to a Bitrate of 700kbps, you’d have a very good viewing experience, unless your connection started to drop lower. Then maybe the video would pause or stutter.

Every video you watch on Internet TV was Compressed to a specific Bitrate. On Adobe TV, our videos are generally Compressed to about 600kbps.

Many websites offer a choice of several different Bitrates, so if you have a faster Internet connection, you can view higher quality video. Take this one below as an example:

Once you’ve started playing the video, the button that says “360p” contains selections for 3 different Bitrate versions of the video. Each version is encoded to a different Bitrate, but many sites obscure this by defining the versions by their Frame Sizes rather than their Bitrates (as this tends to be a closely-guarded secret for competitive resaons).

If you go to the highest available bitrate, defined as 720p, the video will look much, much, better and the audio will sound better as well (audio is also Compressed, along with the Video, for delivery for Internet TV). If I had to venture a guess, I’d say 360p is a bitrate of 300kbps, 460p is 600kbps, and 720p is 1mbps (megabit, or 1000 kilobits, per second). But that’s only a guess.

Some Internet TV channels, like MLB.TV and HULU, offer Dynamic Bitrate Switching, which means the Video Player will deliver the highest Bitrate that your Internet connetion can handle, at any given moment, and vary the Bitrate that you get depending on how your connection speed expands and contracts.

To see just how much better Compression algorithms have gotten over the years, let’s look at a video that was uploaded to YouTube 3 years ago (I selected the video randomly, I just wanted it to be a few years old to illustrate my point):

Because of the Compression algorithms available at that time, and also because the video had to be Compressed to a much lower Bitrate back then (as the average user’s Internet connection was much slower then than it is today) this looks pretty rough.

Now here’s a random example from Vimeo, who generally uses a higher Bitrate encoding profile, that was posted and encoded today (go fullscreen to see it in all it’s splendor):

Amsterdam Osdorp from The QBF on Vimeo.

This isn’t even close to the best quality Internet TV has to offer today, but man isn’t that a huge difference?

More on this subject to come soon, this is an incredibly deep topic….

OSMF – The Promise of Prefab Player Dev

SKOL! Here’s to a group of my very expert and accomplished Adobe colleagues who launched the 1.0 of the Open Source Media Framework (OSMF) today.

For an explanation by me of what this thing is, please watch the embedded video below of me yakkin’ from Beet.TV (this is the15-pounds-heavier version of me back in November ’09, during the rainy SF winter when my main form of exercise — biking to work — does not happen).

Basically, OSMF makes it very easy for you to build complex Video Players for your Website. All the hard work is already done for you. There are already projects like OSMF App Studio which offer ways to create your own players with “drag and drop ease.”

If you are a web designer or developer whose customers want/need Online Video, this could be very meaningful to you.

How To Make Your Own Basic Internet TV Video Player & Webpage

As a follow-on to my previous post, here’s how you can create your own integrated Video Player and Webpage in a few easy steps using Dreamweaver. This works with just about any relatively recent version, but the screencaps below were taken in Dreamweaver CS5.

First, you need a video file encoded to a Flash-compatible format (FLV or F4V) which can be output from just about any Adobe authoring tool, including Premiere Pro and After Effects, or by taking an existing video file and encoding it with the Adobe Media Encoder.

Next, launch Dreamweaver and create a new HTML document. Type any old text you want, just to have some content on your page, and then select Insert > Media > FLV… (important note: the actual menu verbage may vary slightly, depending on which version of DW you’re using, but with a little poking around you’ll find it).


And then you get the dialog. The first menu is the only one that needs explanation, and that explanation warrants a separate post which will come shortly. For now, all you need to know is keep it set to it’s default, which is Progressive Download.


The rest of the dialog is pretty self-explanatory. Browse to your FLV video file, select a player Skin (there are a few stock skins but you can also create your own using the Flash Professional authoring tool), set the size of the player, etc. Then, you’ve got a Webpage in DW with a big grey box on it, representing the placement of your Video Player.


And lastly, to view your new creation, select File > Preview in Browser.


So at this point, in order to make this live on the Internet, you would copy the HTML file, the FLV file, and the 2 SWF files that were created in the same folder as your HTML file when you inserted the FLV file onto the Webpage in the steps above. The first file will be called FLVPlayer_Progressive.swf, and (name of the skin you selected).swf. These 2 SWF files are the actual player component and the skinning of the player, respectively. Dreamweaver created this files for you when you inserted the video. The key is to remember to upload them when you publish the video, the Video Player, and the Webpage to your website.

Video Player vs Webpage

Keeping with the tradition of this blog (to keep the info as digestible for as wide a range of skill levels as possible), I want to explain some basic Internet TV concepts, so if you’re new to this the posts you’ll be reading in the future make more sense.

When you’re watching video in a web browser, there are 2 main components of that experience. The “Video Player” and the “Webpage”. They are generally developed as separate components that get integrated once they are developed. Let’s look at YouTube as an example:


I dimmed out everything that isn’t the player.

The player is the component that actually plays back the video, and contains the controls that let you navigate and manipulate the video (i.e. move forward and backwards in time, enter Fullscreen mode, Closed Captioning on, etc) . In the case of most of the websites you watch video on, it is a player built on the Adobe Flash Platform, and is playing video encoded to one of the Flash video specifications.

Everything else is contained within the Webpage. The Webpage is generally build using a mix of different technologies including HTML and Javascripit.

Ultimately, the video player is “embedded” within the webpage, which is what integrates the 2 together. This is also what happens when you take the “embed” code from a video player and put it on your own webpage (as I have done with one of the films I’ve produced for Adobe TV, directly below this paragraph) or when you “Share” a video on a social networking site like Facebook.

Other things integrated within the Player, behind the scenes, are snippets of code which report usage back to a metrics & reporting system (in the case of Adobe TV, every time you watch a video, including if you just played that video above this sentence, it sends information that the video was watched, and also reports how much of it you watched, to our reporting system Omniture Site Catalyst). If there is ad-insertion, there is also code that calls out to the ad server to show you advertisements at specified times (generally “pre-roll”, i.e. before the video you actually came to watch plays). These are just a few examples.