Kenny Bunch

The boys and girls at SuperDeluxe celebrated their 6 month birthday yesterday by revamping their site. My presents to them were their shiny new playlist video player and the super dooper featured videos end slate. I can’t honestly say they were presents though, since the inhouse team basically wrapped them. To that point, I’m pretty happy with the overall simplicity of the design the design team was able to come up with. We started out with a lot extra information on both the featured videos slate and the playlist player, then basically stripped it all away.

Criticisms
Though I do like the simplicity of the design, there are a few things I’m unsure of. For one, the interaction metaphor present in the playlist player is the static browse/view stance. As I pointed out with Adult Swim, these are separate tasks. I can’t decide if the nature of how the module is used justifies this coupled view or whether it should be more like Adult Swim’s. I will say that unlike Adult Swim, browsing is rather limited and there is a focus on the “playlist”. The decision could go either way, so what do you think? I also don’t know how I feel about the featured videos end slate showing up in the context of the playlist player itself. You typically won’t see this slate because continuous play is enabled. However, when it does appear in this context it is an odd experience. In my eyes, the videos in the side list are the related videos. Why would there be two lists at the same time representing the same thing? It makes sense to just have a video’s details or a replay slate instead. Anyways, those are my basic criticisms.

Potential Interaction Models
Now if we were to decouple the browse and view tasks, I can think of a couple of ways to do this. One example is the new YouTube viral player. Their player blends featured videos and the playlist into a single entity, essentially making it a playlist player. The main oddity in this situation for us is that the “playlist” is not noticeable up front. It only appears when paused, completed, or when the menu is clicked. Thus, video choice is pushed upon you from the start. The decision in this case is not to show choice, but assumes you know choice and want to offer alternatives as a side. Hence it leans more towards featured than pure playlist choice. Regardless, I do like where they went with the player, even if it does use the to cool for school OSX style navigation on the thumbs. All that said, are there any other existing players that follow this model that might be a better fit? I’m interested to hear what you all think or view examples, since I’m always searching for the best model myself.Thanks, and let me know your thoughts!

The new Flash CS3 components took a giant leap forward in usability and functionality by simplifying their internals. However, in the process of doing a rewrite, they didn’t do a good job on unit testing. If you add an item to the List component or it’s dataProvider, you will see a nice little glitch. Adding an item causes the selection to be incorrect, because the selection isn’t being shifted correctly.

The culprit to the issue is in the function handleDataChange in fl.controls.SelectableList.as. The update to the index for the DataChangeType.ADD conditional in this function is incorrect.
Instead of
_selectedIndices[i] += startIndex-endIndex;
it should be
_selectedIndices[i] += startIndex-endIndex + 1;

As you can see it’s a simple change, but a nasty bug if it hits your application. Grant and his team were brilliant with their execution, however QA should have hit it a little harder.

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!

For those who aren’t aware, mx.video.NCManager is a class that is used by Flash’s FLVPlayback component. It’s a “chunky monkey” class in that it does everything under the sun including things that have nothing to do with it’s title, but at it’s core it manages connections to videos. With this management, it abstracts the love/hate relationship of connecting to an FMS server for streaming videos, which requires trying various protocols and ports.

You see, connecting to FMS is different than making a simple HTTP request. Since it is typically not a port 80 request and it is persistent, various factors can cause it to fail. The most often reason being a firewall. NCManager automagically handles this by cycling through all the port (443, 1935, 80) and protocol (rtmp, rtmpt, rtmps) combos attempting to create a successful and efficient connection.

The quirk that I speak of exists in the NCManager’s nextConnect method. The class cycles through the list of possible protocl/port connections in a defined sequence. However, it doesn’t take into account that if for some reason your default url used a protocol/port combo that is further in the sequence say rtmp over port 443 and it failed. In this case, it would try the 443 connection twice and never try 1935 (1935 preceds 443 in the sequence). This is because it doesn’t acknowledge that the first attempt was out of order and then reshuffle the potential connections before iterating through them. One might make the assumption that if you are passing it a url consisting of a port/protocol url further in the sequence that you are specifically saying the combos above it are not possible. However, that is an assumption. Even with that assumption, if you have a failure you are making a second call that wastes resources.

As I mentioned, I labeled this as a quirk since the method works, but it works incorrectly in rare instances.

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

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.

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”.

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.

The Playstation Megasode that I worked on with Playstation and presented at FITC 2007 and the Atlanta Adobe Users Group, was mentioned in the NY Times.

“The Ben 10 prototype, the first game to use the PlayStation 3’s built-in browser, was such a hit that the network expects to commercialize the technology, which it calls a “megaseries,” for some yet-unnamed assets by year-end. “We look at this as an amazing new content window for distribution,” said Ross Cox, senior director for entertainment products at Cartoon Network New Media.”

Though the article calls it a game, it’s better to think of it as an experience. You can play a pure game, watch a show, or “play” a show. There is a reinforcement loop that exists between your actions in the game and the show.Thanks Leif for point the article out.

I’m a little late posting my thoughts on FITC2007, but it’s probably better to post late than to never post at all. That said, the conference was only my second Flash related conference, the first being MAX 2003. I tend to be more drawn to scholastic style, theory based lectures, so FITC seemed to bridge a gap there. It let me pursue my usual interests as well as attend a conference devoted to the community that my work revolves around. I give it a thumbs up.The kicker for me was that I was presenting, after coming off a brutal schedule, that left no time to prepare how I wanted to. I ended up crashing for a little bit the first day when I got in, attending a few presentations the next day, then practicing the night before and the day of my presentation. You see, to be brutally honest, in the past public speaking was a major fear of mine. Everyone is bewildered by this given my personality, but it’s true. Practicing can sometimes be a way of becoming comfortable and confident, and in this case it helped. When I presented, I felt extremely comfortable and was able to get everything across how I wanted. The presentation was really well received, even to the point that someone mentioned it changed their perspective on media. That was my aim, and even if it’s not solving homelessness, I do think the message is important. I want to change entertainment so that it’s more accommodating, engaging, and less intrusive to our lives. To that note, the reason I’ve made myself present over the years is based on constantly trying to push beyond my bounds and the bounds around me. You have to do that if you want to be more than you are or change the things around you. It comes a lot easier now, but I’m always honored and humbled when given the chance to let others hear what I have to say. Without that I can only effect myself. Thanks Shawn, Naomi, and their crew for giving me that privilege.Given that I was pretty wrapped up in preparing, I didn’t get to attend everything I wanted. However I did manage to catch John Grden’s, North Kingdom’s, and Maeda’s presentations. All of them were quite brilliant in their own way. Though with my scholastic affinities, Maeda’s stuck with me the most. He did a wonderful job of stepping back and looking at how digital elements effect our lives and how those same elements can reflect life. His commentaries were quite poetic and profound.Overall, I had a good time at the conference. My highlights were giving my friend’s Stacey and Mathew a hard time, chilling with my friend Lawrence, getting reactions from my presentation, and just reflecting on things with my boy Eric. Conferences really provide a medium for those types of interactions, and it’s what I value from them the most. Needless to say, I’m happy I decided to go.

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.