Archive for category Flash

Project: Adult Swim Video 2.0

Last month we relaunched Adult Swim’s video gallery application and brought it up to the to cool for school 2.0 status. For those not in the know, the first release was just a reskin of the Cartoon release and the point release after that was an update from Windows Media to Flash video. This new release is a reskin, relayout, and interaction change.

Layout Choice
So why the new layout? Well if you look at the app, it’s very apparent that it resembles a YouTube layout. This was done because the layout provided advantages over the existing layout. For starters it uses a common interaction model that users are familiar with, so it automatically yields ease of use based on that notion alone. YouTube also does a good job of separating out functions of browse, search, and view. Typically most of the Flash video apps tie these functions together. For example, the Cartoon player has video as the main focus but always maintains a consistent navigation. In this model you have limited room for the current video’s details and browsing. By separating and opening it up in the way that YouTube does, the browse and search sections are a lot larger and the amount of content is more apparent. In addition, subsections and filters can be listed out beneath sections in context which allow for quick jumping. For example, the navigation options Comedy, Robot Chicken, and Most Viewed are available all at the same time. In the previous model, this required navigating between screens. Keeping search as a consistent function also provides for quicker jump points, since it is always present. Just like the browse perspective, the video perspective has more space to focus on everything that defines a video. It seems a little bare now, but you can imagine that there are a lot of elements you can attach to a video. By design this setup allows for that. All in all the new layout provides a more focused experience.

Flash vs HTML
Ok great layout, but why is it all in Flash and not HTML like YouTube? Good question and there are a few reasons. One of the main reasons is the nature of Adult Swim’s servers and deployment. For the most part, everything is statically deployed pages vs dynamically deployed pages. Most of their service based offerings are just that, services. In the case of video, the system was already deployed as a service based system. Although we did updates to the system, it is the exact same system and can be used for multiple frontend clients. In this case, the main task was simply modifying the client. Since I handled the entire client and it took me a relatively short time to update, time to market was minimal. Thus time and existing systems were a factor. On the other side of the foot, you have interaction models. Having the application in Flash allowed us to create a unified experience. Unlike YouTube, viewing and browsing aren’t completely broken. When switching in between tasks, you are able to continue viewing while browsing. This type of unification is also seen in browsing, where page to page navigation doesn’t require a page refresh. With all that said, the application does suffer from the fact that it doesn’t offer browser history navigation using the previous and back buttons, defined urls in the browser for deeplinking, and indexable content. It suffers now, but I have solutions that don’t require many changes which may be integrated in the near future ;) .

New Features
You are thinking lovely this is a great new layout, but does it do anything new other than look fabulously cool? How about the new sorting features Chuck? Now you can actually sort your video results by most viewed, most popular, most hated, and most recent. Even better, you can apply these sorts to the entire video collection. Yes, you can browse or search the entire collection. This is unlike the previous version which only allowed you to browse per section. More control over choosing what you want to view is always a good thing and control over the content itself can be even better. Well we updated it to be like YouTube and added one of YouTube’s most successful features. Oh buddy that’s right, we got viral. Now you can find a clip that you want and post it to your blog. Free AS content for the taking! That said, there is a constraint. Currently full episodes aren’t shareable. This is primarily due to the fact that networks posting content online are only allowed to maintain specific amounts of content at a any given time. There are many restrictions placed on them by their cable and content creator relationships, and this is one of them. It is unfortunate, but I think I have a few solutions up my sleeve that can address these constraints.

Future changes
Love the new features, but are you wanting more or feel like something was taken away? My biggest gripe with the player is that we can’t go true fullscreen right now. This happened with the point release from Windows Media to Flash. The reason is that the companion image ad for videos is in HTML (even though it appears to be part of the Flash movie). Having the ad this way requires changing the WMode of Flash to render correctly and ties the renderer to the browser. This restriction makes going fullscreen technically impossible. We are taking steps to change this and provide a true fullscreen experience. If you are viewing a show you want to be able VIEW the show! The other changes would be related to things I hinted to before. I’d like to provide a means of sharing episodes, allowing browser history browsing and deeplinking, indexing the content, and opening up the things that you can “view and do” in relation a video. Regardless of what I want to do, comment in on what you think and what you might want to do. In the meantime, check out some great LEGAL Family Guy clips!

4 Comments

Project: CNN Image Gallery

A few weeks ago, CNN launched their spiffy new site which I was fortunate enough to have my hands dirtied from. I’ll save my comments for the redesign for another post, but wanted to point out the image gallery I worked on.

Details about the gallery

  • generic and allows setting any gallery feed on embed
  • allows deeplinking to specific images on embed
  • allows navigating to specific images from javascript
  • allows changing gallery feed via javascript
  • tracks image clicks
  • tracks gallery loads
  • allows emailing of gallery
  • Overall the experience with the gallery is pretty smooth. However, because it is competing with a bunch of other processes on the page, you can visually see the lag it is experiencing (via captions hide/reveal animation).

    For those with a bit of Flash community knowledge the new image gallery has a pretty familiar look. One might even venture to think that the module is indeed what it appears to be, SlideShow Pro. However, you would be wrong. Despite it’s drastically similar resemblance, it is a ground up custom write. Should it have been? Thats a good question. My first response when I saw the design firm’s mocks were, go get SlideShow Pro. I even pointed them to Todd and told him about it (since he was still at Turner). It was obvious they had used it as a model, so why not just customize it, right?

    Well in the case of CNN, they wanted control. Control over the UI, control over the effects, control over the data, control over the internals, control over events, and basically the control to modify everything and anything to do with the module. I granted their wish and did a ground up write, which took little time. It was a clean implementation that did only what they asked and was fine tuned to their needs. It was the details that you don’t see that made the custom write the correct decision, and in the end I agree with their choice.

    With all that said, I think it is a compliment to Todd that they followed his design. Though it made me feel odd with the project being so close his work, it points out the validity of his component. If CNN mirrors SlideShowPro, then that should tell you the component rocks. I wasn’t able to use it here, but I highly recommend it.

    2 Comments

    MovieClipLoader and Loader quirks with cached images

    On a recent project I ran into a quirk/unexpected behavior when using MovieClipLoader in AS2 or Loader in AS3 to load an image. When using the classes, you have the ability to listen for a progress event, which you typically use to show an progress bar. If an image is cached, one would think the progress event would not fire since it should be fired on bytes loaded not bytes read, correct? Wrong. If an image is cached the progress event still fires, even to the tune of 9 times.

    I would have not guessed this to be the case, and had even willingly drank the koolaid into believing all my load worries had been solved by these glorious classes. Instead I had to back peddle and use enterFrame checks for progress events and only use the onLoadInit/complete event from the class. All of this I found because a designer was getting upset because the progress bar kept showing up on loaded images. That’s right folks, the mantra here is “designers are your friends”.

    4 Comments

    Time Shifting Entertainment presentation viewable online

    The “Time Shifting Entertainment” presentation that I gave in Toronto at FITC was recorded and is now online. For those interested in the highlights, the online dvd Adult Swim app demo is at 23:30 and the Playstation 3 Megasode demo is at 29:00.

    My presentation is one of the few that is up right now, and I’m anxious to see some of the others that I missed. It did give me a chance to review myself and overall I’m happy with the talk. However, I definitely need to add visuals and excitement to my presentations. Have a look and let me know what you think.

    2 Comments

    FITC2007 Presentation and the Playstation Megasode

    Last Tuesday, in a half awaken state, I previewed my FITC 2007 Presentation, Time Shifting Entertainment at Atlanta’s local Flash user group. I say half awaken, as I had been feverlishly working to complete three large scale projects up until that point. Luckily, despite my suffering, it gave me a chance to get ready for FITC, and really revise my presentation.

    The flow of the presentation:

    - start with a brief intro of myself

    - define media shifts

    - transition to the media shifts we are seeing with video on the web

    - show some examples of what is being done

    - wrap with overall thoughts and statements towards the future.

    The first part is pretty big picture, but it serves to let you know who I am, how I think, and what all this stuff means. If anything, I think it’s important to get you thinking. The second part is what lights eyes and opens ears, because people love to see things.

    What you will be see:

    - CBS, Adult Swim, and Cartoon (screenshots/details)

    - Super Deluxe (screenshot/details)- Adult Swim Video Commentary (DEMO!/details)

    - Playstation 3 Megasode (DEMO!/details)

    Did you read that right, PS3 Megasode? What the @#$@ is that? To briefly explain, I worked with Playstation pre/post PS3 launch on a concept that combines “playing” a show and playing a game into a single experience. I will be presenting the canned prototype we showed together in Hollywood back in February. I’m not toting the PS3 up there (though we used it in Hollywood), instead I’ll opt to run it from my laptop.All that said, the presentation was well received when I ran through it locally in Atlanta. I was lucky in that the audience was small and intimate, yielding a lot of back and forth questioning (thanks Leif). I admit without questions I have a script to rely on if I don’t feel I can get it out in a delusional state.So am I still delusional? Well, I’m currently in LA working with a client, fly back to the East on a red eye tomorrow, get in at 6am, fly out at 6am Saturday to Toronto. In the middle of that, I’m going to try and run by Adult Swim and get some goodies promised to me, to throw out to the audience. Though I haven’t slept since 2000, I’ll try to work some in before Monday. I’ve lived and breathed this stuff everyday for years, so it’s important to me that I can eloquently provide you a picture into my world.

    6 Comments

    Project: Adult Swim Interactive Video

    The Project

    http://www.adultswim.com/ivc/trinity/index.html

    Ghetto Players

    Last Friday Adult Swim stepped out of what I consider the “ghetto video” player realm and into something a little more interactive and fit for the web. You see, I believe anyone can throw up a single video or collection of videos on the web, hence the meaning of “ghetto”. There are ways to make the experience better, more fluid, profitable, easier with tools, etc, but at the core you are just ripping a video and throwing it on a site. Don’t get me wrong, this is great and I’m happy for the shift to this medium. I love and want content to continue to be put up in this way. I personally push for it and try to make it happen. However, it ignores the strength of the medium beyond just supplying on demand viewing.

    Interactive Video

    Enter the concept of interactive video. What does this mean? Well a lot of people are doing variant things with video now, so it could mean different things. Some use video as a highlight element and not the driver of the experience. In my case, video is the content, it tells the story. From a content creator’s perspective you have to go beyond providing just a video view. You have to provide the ability to dig into that story. That experience then becomes a driver beyond just the video’s view. I’ve heard many discussions about how video interlaced with related content should tell a story and implementations that attempt it, but I’ve always walked away feeling empty. I’ve always wanted to put my own stamp on it.

    The Struggle

    Funny thing is, I’ve had the current AS project idea, design, and implementation in my head for over 3 years (aka Flash6), but never had the approval to do it. This was due to having to convince people that video on the web is a viable thing and that it doesn’t take away from their viewership, but only adds to it.I have had a strategy that I employed this year to overcome this. By slowly introducing video to some companies and helping them understand it, I first used this to get their video out there, then used that to change their technologies, and I’m now using it to open doors for my ideas. I would be lying if I didn’t say that without YouTube scaring the pants off them, they probably would have held tight to their beliefs of protecting and not releasing their content. To that all I can say is, thanks YouTube.

    Project Concept

    Anyways, enough talk right? What is the concept? Simply, this particular project seeks to take DVD style experiences to the web with a twist. Taking a video (show) and the related content (images, audio, video, or written articles) that would be associated with a DVD, I seeked to merge both into a linear narrative. All of the related content is time coded to the video where the video serves as the linear driver/story teller. As you watch the content, you are given subtle alerts for the associated content, which you can then use to jump to and view. In addition, if you wish to browse those content elements, you can do so, and jump directly to them via a menu. The video is then synced to the content. The point is that you are always looking at content in context. On top of that, your context is never lost. You are never driven completely away from the story and have to dive back to it. The story always exists right there in visual sight. As you move through the application you can shift your focus to what you want to pay attention to and the UI will visually shift around to let you know where you are going. The application is completely dynamic so I can apply it to any linear video that I want.

    Thanks and the Future

    For this project, I can’t thank my friend Chris enough for letting me run with the idea and providing me with such great input. He started the game, I showed him the ball, and everyone involved rolled it. It has been well received, with my favorite comment being “You just created the Flux capacitor”, to which AS turned to me and said “If you can build the Flux capacitor, I think I can get it in the budget for next year”. With the Flux capacitor in hand, I’d probably end up just going and betting on things like Biff (which could go sour), so for now I’ll stick to moving my vision forward.With all that said, this is a first pass and isn’t fully indicative of everything I have envisioned. To note that, I did the actual development super quick just to have it out there, have people playing with it, and getting feedback. As I’ve said before, I plan to change entertainment as we know it. Yes a big statement, but I have a big vision. The doors are now opening. This is a small piece to a big puzzle I have. As they always say, you haven’t seen anything yet ;) .For those who find my ramblings interesting, I encourage you to come by and check out my presentation at the April FITC conference in Toronto, Canada this year . This project is just one of many things that I’m planning to incorporate into it.

    4 Comments

    SuperDeluxe VideoPlayer – Update February 15, 2007

    As some of you might have noticed when sizing the SuperDeluxe video player to smaller dimensions, sometimes the information dialogs were overflowing. Today we released an update addressing this. The informationals are now a lot cleaner with unnecessary elements removed and more space for content. In addition, the title/status line will autoscroll when it has more text than can be seen. Of course there are few small under the hood changes, but these visual ones really stand out. To that note, I tend to never be satisified with most projects, so it’s great to be able to polish up the player and remove the rough edges.

    No Comments

    Project: Adult Swim Video Application

    Adult Swim Fix is the proper name for the Adult Swim video application and it is not new. However, as of last week it does have a new video format. It has been switched to the most popular format on the web, Flash.Anyone who is familiar with the application can see that it looks exactly the same. Well, point blank, that is because it is. You see when I wrote it (as well as the Cartoon Video and Toonami players which are still WM), I wrote the player to be format agnostic. When they play video, they have no clue of what the video is, just that it is video. The players are set up where their playback can be changed in a one line reference switch to: Windows Media Streaming, Windows Media Progressive, Quicktime Progressive, Flash Streaming, or Flash Progressive. The rest of the application logic remains the same including the ad serving, tracking, service request, etc.Why did I do this? I did it so that the application could be adapted for variant uses, and more importantly, I did it to make choice a very simple option. I first had to convince the machine that video on the web is a good idea and work within their comfort zone. In the same breathe, I wanted to make it easy enough for them to move from their comfort zone to an area where they can form advances. It was all strategic and done in the best interests of the companies using the player.All said, the Fix Flash conversion was step A. Right now I consider it a “ghetto player” comparable to the likes of those like Brightcove. Not that it, or they are not good, but the focus in the wrong place and not on the users. I intend to do better, a lot better, I just needed to open the doors first ;) .If anyone is interested, I’ll be briefly touching on Adult Swim Fix, SuperDeluxe, and other video projects in my presentation at FITC in April.

    3 Comments

    NetStream Bug in Mac Flash Player 9.0.28

    In the Mac version of Flash Player 9.0.28, the NetStream event NetStream.Play.Stop does not fire on clips that are longer in length. I did not narrow it down to what length it deteriorated at, but generally the test clips were around 3 to 4 minutes in length. The bug tests were consistent, and could not be replicated in previous versions of the Mac player or any PC player. Just to verify it wasn’t the encoder, the first tests were done encoding with AnyStream, and later attempts were made with encoders such as the Adobe Standalone, which failed as well.

    Is this a serious bug, it depends on how you define serious. Most developers use this event to determine completion of a video, even the Adobe FLVPlayback component uses it and fails. In players that display post video messaging, run post rolls, or cycle playlists and rely on this method, these action items simply won’t display or run.

    You can attempt workarounds with NetStream.Buffer.Empty and the duration from MetaData. In this specific case, you attempt to catch the Empty event firing at the end of a clip and use that as your completion event. Even if it doesn’t fire in certain race conditions, I recommend at least putting something like this in as backup measures.

    All in all, it’s not good when there are inconsistencies in the player. My hope is that it gets addressed soon.

    5 Comments

    Project: Turner’s SuperDeluxe Video Player

    As of Wednesday January 17, 2007, Turner Broadcasting’s new comedy broadband site, SuperDeluxe, is alive and well. The project is a YouTube of sorts, but with highlighted content (right now coming from professionals). It’s an interesting approach because it is very niche, focusing on comedy and putting an editorial voice around it. Though it has a community aspect, it is not striving to be a YouTube or MySpace, instead it strives to be what it is, comedy. In a time where increasingly we are overwhelmed with mass amounts of contents, having to sift and search through everything, an organized niche provides a place to find something of particular interest.

    I’m personally interested to see how it does, as I had the privilege of working on it. You see, the flashy little video player, the code running it is courtesy of yours truely. I was the video player code monkey and consulted at a high level on the project. Luckily for me, I was actually able to enlist the creative director Todd Dominey (aka the DOM father), to get his hands dirty and design the player. Needless to say, I’m pretty happy with how it came out. The design, ui feedback, ad model, and tracking all seemed to work out pretty smoothly.Overall, working with the list of players at SD was a great experience, I think their hard work shows in the site. I was privileged and honored to be a part of it.

    For now, have a laugh and enjoy some SD comedy

    Note: most of these videos are rated “mature,” so they may not be safe for workplace viewing.

    Making Friends with Chelsea Peretti

    ArchDuke

    Flying

    The Ted Zone

    5 Comments