Flash CS3: The Missing Manual is designer-centric

by Josh Tynjala

It’s been a while since I last looked at any books that offer the most basic of introductions to Flash. I’m talking about the kind of book any normal computer user with no development or design experience might pick up. As expected, this is a different world than the developer space in which I usually take an interest. Honestly, I was just curious how Flash, and especially ActionScript, are presented to the layman today. With a hardening of my defenses to the possible shock of an ActionScript-free world, I picked up Flash CS3: The Missing Manual.

As expected, the majority of the book focuses on the design-time tools that appear in Flash CS3. Just about every item in the menus and toolbars gets its own respective section, and I’m happy to say that I learned a bit about a couple things that I’ve never needed to use (and probably won’t in the future, but that’s a different story). Of note, a well-written introduction to the timeline and MovieClips gives the new user a strong advantage over some poor soul who dares to open the Flash authoring environment without reading anything beforehand. If the designer tools are all you need, then I can’t recommend a better source.

As the book neared the end of its chapters, I became worried that ActionScript wouldn’t make an appearance at all. Unfortunately, that’s nearly the truth. The majority of the ActionScript presented to the reader is created with Behaviors, and it’s almost all made with ugly on( event ) syntax. I discovered a world where my beloved ActionScript 3 gets mentioned in passing, and it certainly never gets time on stage (Pun intended. I’m a sucker for bad jokes). With such a quick intro, best practices go right out the window. I got the impression that the author only included the current coding chapters as a way to check off a box on a list of available features.

Overall, I’m disappointed in the slim introduction to the development side of Flash. While I understand the intended audience is someone who might have never touched a programming language, I believe that a brief chapter on basic syntax would have gone a long way to improving this section. Right now, I believe that Flash CS3: The Missing Manual is a take it or leave it choice for the beginning Flasher who expects to do a little coding. The descriptions of design-time features certainly give someone the skills they need to get started creating their graphical elements, but the development sections were slim enough that they might as well be useless. If you need to learn about all aspects of Flash, pick up this one for the design features but add another book to your cart to learn ActionScript.

Why doesn't the "parent" property work the same in ActionScript 3?

by Josh Tynjala

No, I’m not asking that question. Instead, I am going to answer it and explain the reasons why it’s not as easy to traverse the display list like you could in ActionScript 2. In addition, I’ll give you a couple options for how to get around any errors you may encounter when you need to “hack” up and down the hierarchy. Under most circumstances, I don’t recommend them, but I believe that there’s nothing wrong with knowing what you’re not supposed to do.

Let me begin with a recommendation. If you’re just starting with AS3, and you’re a little frustrated with the extra work these language changes make you do, please consider taking a short time to learn a little object-oriented programming principles and how to do things properly. Why? Well, some important benefits come from coding through best practices. First, it’s easier to catch bugs because the compiler is much smarter than it used to be. Silly mistakes that might go unnoticed in AS2 will be caught immediately in AS3. Second, your code will run many times faster because the compiler makes special optimizations with well-written code. No one can argue that fast and bug-free code is silly. The new language is trying to help you to achieve those results, so don’t fight it.

Now, let’s put my preaching about best practices behind us. One of the first things a lot of developers familiar with AS2 may discover is that code similar to the following doesn’t work anymore.

this.parent.parent.some.deeply.nested.movie.clip.x = 50;

If you try to compile code like that in AS3, the compiler will throw an error:

1119: Access of possibly undefined property some through a reference with static type flash.display:DisplayObjectContainer.

The new compiler is a little bit stricter than it used to be in the AS2 days of Flash 8 and below. Today, the compiler knows that a MovieClip’s parent property is of type DisplayObjectContainer. It might actually be a subclass, like Sprite or MovieClip, but the compiler can only guarantee that it’s a DisplayObjectContainer. This class is not dynamic. To add new properties, like a child MovieClip that can be accessed publicly, you need to subclass it. In other words, if you instantiate a DisplayObjectContainer directly, you can’t do something like this:

var displayObjCtr:DisplayObjectContainer = new DisplayObjectContainer();
displayObjCtr.myDynamicProperty = 12; //error

On the other hand, the MovieClip type that we all know and love is dynamic. You can add properties and methods and anything you want to it without restriction.

var clip:MovieClip= new MovieClip();
clip.mySpecialVariable = "hello!"; //okay!

“…but,” you say to yourself, “I know the parent of my symbol is a MovieClip!” Good for you. The compiler doesn’t know that for sure. It’s possible to remove any DisplayObject from its parent and add it to another. How’s the compiler (which isn’t running all the code. It’s just making it into a SWF) to know that the parent hasn’t changed to a Sprite, CheckBox, or something else when you run your code?

Since you know the answer, that a certain parent is always going to be a MovieClip, then you can explicitly tell the compiler, “It’s okay. Please assume this is a MovieClip rather than a DisplayObjectContainer. Trust me.” This is called casting.

MovieClip(this.parent.parent).some.deeply.nested.movie.clip.x = 50;

Personally, I prefer the “as” keyword for most casting, but you may use either. Take the time to learn more about each because they behave differently in subtle ways. Here’s an example of casting using the “as” keyword:

(this.parent.parent as MovieClip).some.deeply.nested.movie.clip.x = 50;

Notice that you don’t need to cast the other MovieClips. That’s because the compiler assumes dynamic properties are of type Object, which is another dynamic class. Everything is an Object in AS3, so this is fine for our purposes. If you’re looking to optimize your code, you should consider casting them too. AS3 runs a little bit slower when it only knows something is an Object.

Let’s Get Crazy. Turn Off Strict Mode!

Now, some folks think the extra work of casting is a pain. If you must traverse the display list, I recommend using casting as much as possible to keep the compiler aware about variable types. Let’s consider, though, the possibility of coding like we could in AS2, with no casting needed and all the flexibility of the good old days. Sounds interesting, you say? Read on.

When you create a FLA file for ActionScript 3.0 in Flash CS3, you get all the strict typing checking by default, as we’ve all seen. However, at it’s core, AS3 is still a dynamic language, and you can tell the compiler to shut up if you want. Here’s how you do it:

Screenshot of the strict mode checkbox
  1. Create a new ActionScript 3 FLA file.

  2. Then go into the Publish Settings, either from the File menu or the Properties panel.

  3. Under the Flash tab, click the Settings… button next to ActionScript version.

  4. Uncheck the Strict mode checkbox

Remember that AS2-like code that gave us an error before? If you try to use it with strict mode turned off, the compiler won’t complain at all!

this.parent.parent.some.deeply.nested.movie.clip.x = 50;

It’s very simple to set up a FLA file to work with strict mode off, as you can see, and I’m surprised that I haven’t seen it mentioned before. I created a sample Flash CS3 FLA file with strict mode disabled if you’d like a hands-on look at how I set it up. You’ll discover that it compiles and runs without error, but if you go back into the Publish Settings to re-enable strict mode, you’ll get compiler errors. Have fun, and don’t come complaining to me when someone yells at you for turning strict mode off. I warned you to leave it on!

Getting Advanced with E4X

by Josh Tynjala

Sometimes, when working with XML from webservices or public APIs, you will encounter certain elements or attributes in namespaces. For instance, the Yahoo! Weather RSS Feed has a yweather namespace that adds certain new elements to the feed that aren’t part of the regular RSS standard. To use E4X with complex XML like this, you’ll need to know a couple of things to make this namespaced data accessible.

For the following examples, I will be using the Yahoo! Weather feed for Sunnyvale, CA. It is available at the following URL:

http://weather.yahooapis.com/forecastrss?p=94089.

There are two ways to use namespaces in your E4X statements. You can reference the namespace directly in your query, or you can declare the namespace available for use globally. Regardless of which method you use, you’ll need to declare the namespace first. Notice that it is defined by a URL. I’ve taken this value directly from its declaration in the RSS feed itself.

namespace yweather = "http://xml.weather.yahoo.com/ns/rss/1.0";

First, let’s access the current temperature using the namespace inline:

var temp:int = rss.channel.item.yweather::condition.@temp;

It’s simple, but as you can probably imagine, a complex query will require too many references to the namespace. Alternatively, if you don’t want to litter your queries references to yweather::, you can tell the compiler to use this namespace globally.

use namespace yweather;

Now, we can write a simpler E4X query without the need to worry about our namespace:

var temp:int = rss.channel.item.condition.@temp;

Now, let’s look at the condition element in the feed a little bit differently. For debug purposes, let’s trace a few values to the console. Notice that we can get the string representation of the attribute’s name very easily through, you guessed it, the name() function.

var attributes:XMLList = rss.channel.item.condition.attributes();
var count:int = attributes.length();
for( var i:int = 0; i < count; i++ )
{
	var attribute:XML = attributes[ i ];
	trace( attribute.name(), attribute );
}

You can see that when you access an attribute from an element, you're actually getting a new XML object. When most people think of objects of this type, they expect to see an element, but it can hold many different forms of XML data. If you'd like to learn more, check out the documentation for the XML class, and its nodeKind() function in particular. You'll discover that an XML object can hold simple text, comments (<!-- comment -->), attributes, elements, and processing instructions.

Let's finish up with the sample XHTML document that I referenced in my second post about E4X.

var html:XML = <html>
<body>
	<ul class="links">
		<li><a href="http://www.yahoo.com/" class="josh">Yahoo!</a></li>
		<li><a href="http://www.adobe.com/">Adobe</a></li>
		<li><a href="http://joshblog.net/" class="josh">Josh's Blog</a></li>
	</ul>
	<div id="intro">
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
	</div>
	<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</body>
</html>;

I recently discovered that if you try to reference an attribute that doesn't exist, you'll get a runtime error. For example, try to get the all the anchors (links) in the above document with a class named "josh". It doesn't work (without some extra massaging, as you'll see below) because the link to Adobe doesn't have a class attribute at all.

var anchors:XMLList = html.body..a.(@["class"] == "josh");
//error

What you can do to get around this problem is to use the hasOwnProperty() function available to all Objects. This will allow us to first check to see if the class attribute exists, and if it doesn't, it will skip that particular anchor thanks to the short-circuiting of the && operator.

var anchors:XMLList = html.body..a.(hasOwnProperty("@class") && @["class"] == "josh");

I expected that my first two posts about E4X (1, 2) would cover most of the important details. However, only a couple days after I finished the second one, I had already started remembering more features to explore and share. Will there be more? I don't have anything planned, but I won't be surprised if I discover a couple cool new techniques eventually. :)

Flex Maniacs 2007 Session Slides

by Josh Tynjala

As promised, I’m sharing the slides for my session Under the Hood of an Advanced Flex Component that I gave at Flex Maniacs 2007 in Washington, DC. The conference was fun, and it was nice to meet a few people that I’ve known online for a while, but hadn’t seen face-to-face. Thankfully, Flex sessions at conferences are starting to go beyond the basics, and I hope that my session helped out some folks that are building more advanced components.

Preview of Flex Maniacs Slides

Session Abstract

Though the Flex 2 SDK ships with an impressive array of useful components, opportunities abound for the creation of more advanced visualizations that add new depth and interactivity to Rich Internet Applications. Treemaps, originally developed by Ben Shneiderman of the University of Maryland, offer an interesting way to display hierarchal data that goes beyond standard Tree components. The Flex development community is growing quickly, and many developers want a look at the process and design considerations required for the creation of a complex component. Josh Tynjala shares his open source Flex TreeMap component with an in-depth study of its data handling methods, optimization considerations, and points for extensibility.

Download Slides (PDF file)

Quick updates to WordWeb for Digg

by Josh Tynjala

Nothing Earth-shattering or anything, but I made a couple nice updates to my WordWeb Flex application for Digg. They’re a big help in regards to user experience and making the app a little more fun to play with.

Screen capture of WordWeb real-time search

First, the floating keyword list now includes real-time filtering. I had a couple people mention that they found themselves thinking of words that they wanted to view in the graph, but there was no easy way to find them without scrolling through the whole list. Now you can start typing the word you want in the search box and the list will update immediately. It’s pretty slick.

Screen capture of WordWeb Customize dialog

Second, I updated the settings dialog to make picking topics easier. Digg’s API contains a series of containers (top-level categories) and topics (sub-categories). The previous interface I had was a little confusing to use because I didn’t make any connections between containers and topics. Now, when you select a container from a ComboBox, you will be presented with a new ComboBox (and a nice transition effect) that contains the sub-topics from the container. A cancel button appears next to each ComboBox to let you easily clear the chosen values. Like the keyword filtering, this enhancement makes user choices a little more manageable by limiting the amount of information the user needs to see at one time.

If you’d like to learn more about this app, please see the original post about WordWeb. I made the source code available for viewing as well, so take a peek if you’re interested.

Developers will swear by Programming Flex 2

by Josh Tynjala

After being disappointed by other Flex books out there, I finally found a book that delivered, and I’m more than happy to begin recommending it. Where many Flash developers swear by the Essential ActionScript books by Colin Moock, I expect that Programming Flex 2 by Chafic Kazoun and Joey Lott to gain the same reputation. It’s very straightforward, the authors are obviously knowledgeable, and it should be able to get anyone started developing with Flex.

One of my favorite parts is the forward written by Mark Anders, Senior Principle Scientist at Adobe. Mark gives a detailed history of his move from Microsoft, as the leader behind the team that created ASP.NET, to Adobe where he helped shape Flex 2 and ActionScript 3.0, the language behind the framework. He finishes with a look at the future, including Flex’s support for the upcoming Apollo runtime.

Early chapters focus on the basic parts of Flex. As expected, the authors give a look at ActionScript 3.0, MXML, the tools behind Flex, like Flex Builder, FDS, and even SWFObject, one of the best embedding solutions for placing SWF files into webpages. I’m impressed that Chafic and Joey took the time to mention SWFObject because it’s my personal favorite, and because the Flex SDK includes Adobe’s own solution, so mentioning others written by third-parties isn’t strictly necessary. Consider that an extra point for attention to detail.

The Framework Fundamentals chapter goes well beyond fundamentals, in my opinion, but that’s not a bad thing. In fact, I think readers will file away a lot of useful information, such as how the Flex SystemManager and preloaders are handled, and move forward with some great knowledge that they might normally discover much later. The authors introduce ApplicationDomains right away too. Personally, I rarely find myself using these, but again, always good to know about them.

In the next few chapters we read about layout, standard components, and containers. These chapters give the reader their core knowledge of the visual side of Flex. The layout chapter extensively covers layout components like Canvas, HBox, and VBox, constaint-based layout, and even some less-obvious containers like Forms, FormItems, and FormHeadings. The UIComponent and Container chapters, as you would expect, go into detail about each of the available component. I found myself a little bored by these chapters, but I’ve worked with most of these components for well over a year, so you can imagine that I’m familiar with the available features.

The rest of the book’s chapters cover other specific features that the framework provides. We have a chapter on managers for drag-and-drop, modal pop-up items, and mouse cursors, some information on media such as sound and video, effects and transitions, application states, and styles and skinning. Of particular note are chapters on working with data, including validation and formatting, connecting to remote data sources like web services, socket servers, and initiating file uploads and downloads. I was impressed to see a chapter that focused on Flash Player’s LocalConnection and SharedObjects.

The final two chapters of the book focus on components. First, we take a look at building components with MXML. For good reason, the authors recommend breaking up an application into multiple modular pieces. It’s all straightforward, with a focus on encapsulation and other important considerations for object-oriented programming. The last chapter shows the reader how to build a new component with pure ActionScript 3. The content is focused and to-the-point. Seeing as I have a strong interest in building custom components, I found myself a bit disappointed by such a short, well, introduction. Certainly, the authors wrote a strong chapter that includes all the essential details, but I simply hoped for a bit more. As they say at the conclusion, though, an entire book could be written about Flex component development. I can definitely agree, so I guess I shouldn’t complain too much. ;)

Personally, I learn the most when I dive right into the Flex documentation. However, I know a lot of folks like to grab a physical book and read it a little further away from their computer monitor. Programming Flex 2 is the best hard-copy source for Flex information that I’ve found so far. It’s a little less dry than the documentation, and Chafic and Joey present you with the essential knowledge to get you started developing with Flex very quickly. You’ll find this book on my personal list of recommendations, and I hope you enjoy as I have.

Vote for WordWeb in the Digg API contest!

by Josh Tynjala

A little over a week ago, I built WordWeb, a Flex application that utilizes Digg’s public API to analyze keywords and explore relationships between stories. Today, Daniel Burka announced the finalists for the Digg API contest, and WordWeb made it into the top ten! Now it’s up to the Digg users to vote for the best of the best.

Screen capture of WordWeb application for Digg's API

Please head on over to the official contest page and place your vote! There are some pretty cool visualizations. A few web-based apps, a couple built with Apollo. I’m glad that Apollo was included in the contest since it will get some nice exposure. Anyway, vote WordWeb! Thanks.

More XML filtering with E4X in ActionScript 3

by Josh Tynjala

If you haven’t read my first post about filtering data with E4X, go check it out now. Today, I’ll expand on it to add a few more options that you have at your disposal when working with XML in ActionScript 3.

The following is a simple XHTML document that I will reference in the examples below:

var html:XML = <html>
<body>
	<ul class="links">
		<li><a href="http://www.yahoo.com/" class="josh">Yahoo!</a></li>
		<li><a href="http://www.adobe.com/">Adobe</a></li>
		<li><a href="http://joshblog.net/" class="josh">Josh's Blog</a></li>
	</ul>
	<div id="intro">
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
	</div>
	<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</body>
</html>;

Consider a situation where you want to retrieve all the paragraphs from an XHTML document. Each paragraph could be nested in DIVs, lists, tables, or anything. If we want to retrieve an XMLList of every paragraph in that document, we need to use E4X’s .. operator. A single dot only allows you to access direct children of a node, but this operator allows you to drill-down into the hierarchy of every descendant in an XML object to access grandchildren and more.

var paragraphs:XMLList = html..p;

You can combine this new operator with the filtering methods I introduced last time to build some pretty complex queries. The following example retrieves the URLs from all the anchors (links) in unordered lists with the class “links”. Notice that I must use the attribute() function because class is an ActionScript keyword.

var urls:XMLList = html..ul.(attribute("class") == "links")..a.@href;

Of course, we don’t need to access attributes through the complete hierarchy of their containing elements. Consider a situation where you want want a list of all the values of “class” attributes in an XHTML document. This attribute could appear on almost every element in the document. In most cases, you can directly reference the attribute with the @ symbol.

var classes:XMLList = html..@class; //error for "class"

However, like the previous example, we can’t access the “class” attribute as easily because it’s an ActionScript keyword. Instead, let’s use the decendants() function, which returns every element (not limited to direct children) that is below an XML node, along with the attribute() function to get the “class” attributes. The query will be a little more complex, but I don’t think it’s unwieldy.

var classes:XMLList = html.descendants().attribute("class");

You’ll notice that the query returns every single class attribute in the document, including duplicates. For instance, there are two anchors in document that I have given the class “josh” because they happen to point to sites that have content created by me (this blog, and my employer, Yahoo!). What if I want a list containing only unique items? In other words, how can I get results where the “josh” class only appears once?

Unfortunately, E4X doesn’t provide a native way to retrieve a list with only unique values. That’s unfortunate because I’ve found that it’s a common requirement. Based on my previous knowledge of combining E4X with ActionScript (remember the trace() call from my last post?), I built the following query that should do the job:

var filteredClasses:XMLList = new XMLList();
html.descendants().(filteredClasses = addUniqueValue(attribute("class"), filteredClasses));

That snippet calls a simple function addUniqueValue() which I’ve included below.

private function addUniqueValue(value:Object, list:XMLList):XMLList
{
	if(!list.contains(value))
	{
		list += value;
	}
	return list;
}

As I demonstrated last time, code within parentheses in an E4X query basically runs in a loop for every item in an XMLList. I’ve used this to my advantage to call a function for each item in the list that checks to see if has been included in the filtered list. Once the full query finishes, an XMLList with unique items has been placed into the filteredClasses variable.

By the way, did you notice that XMLLists support the += operator to append additional items? I didn’t know that until I just tried it. Nice.

That should cover everything you need to know to go crazy with E4X. Keep in mind that E4X can be a bit slow if written poorly, and it’s important to optimize your queries for large datasets. If you need to filter your data, like I did to get unique values, remember that you can call ActionScript functions and assign values within the parentheses. Finally, don’t forget about the attribute() and child() functions. They’re very useful for using dynamic strings in your queries. E4X rocks.

Update: I’ve written a followup article:

And be sure to check out the original:

Six reasons why I think Joost is lame

by Josh Tynjala

Lately, I’ve been hearing a lot of buzz about Joost, a new Internet video platform. People seem genuinely excited about it, and the invites are flying left and right. After picking up an invite of my own, I downloaded the application, tried it for a few minutes, and I came to a simple conclusion almost instantly: Joost is pretty lame.

Don’t get me wrong, I enjoy that I have hundreds of channels to watch on my PC. However, the application’s interface sucks. A lot. Seriously, it’s a usability nightmare. I made a decent list of some of the more obvious problems with the interface while exploring the catalog to see the available content:

  1. When in full-screen mode, it doesn’t immediately recognize my mouse movements. I have to wiggle my mouse for a couple seconds. Show me the interface already! I mean, come on. This is one of the most basic functions of a video player. Don’t make me wait. I moved my mouse for a reason.

  2. I can never seem to find the back button. It’s in the top-left, which should be pretty obvious based on my experience with a web browser, but it’s not obvious enough. Since I can’t find it, I start my search for new shows from the beginning by clicking the “Channel Catalog” button (which is the easiest UI element to understand). I think if the arrow button were in the middle of the left side, and maybe a little bit bigger, I’d have an easier time simply going back one screen.

  3. If I leave a video playing while clicking through the menus, it’s not obvious how to get back to the video. After specifically clicking on various buttons just to figure out what they do, I discovered a strange circular button on the top-right of the screen that does the job. You can also click anywhere outside the menu (on the video itself), but that’s not obvious to an inexperienced computer user, or to someone who has never encountered a similar interaction in a video player. Why isn’t there a button on the bottom next to the button labeled “My Channels” or “Channel Guide” that lets me switch between menu modes. If I saw a “Back to Video” button down there, I would instantly know what I needed to do. Plus, with only a single button on the bottom, it feels pretty empty anyway.

  4. The buttons to scroll up or down in the list of my favorite channels appear on the right side. I kept finding myself trying to find these buttons on the top and the bottom of the list. If you can’t tell, I’m finding the interface difficult to navigate. In fact, based on the fact that I’ve gotten lost several times makes me wonder if Joost doesn’t follow common interface guidelines. I’m also starting to think that the UI elements simply don’t stick out enough, as if the constrast were way too low.

  5. Browsing through the channel catalog is slow and requires too many mouse clicks to get more information that should all be put in one place. For example, I start by clicking on the channel catalog button to view the global channel listing. Next, I pick a category, such as Cartoons and Animation. Now, it shows me a listing of all the channels in the category. Things start going wrong here. I only see the logo for the channel, its title, and a few very small screenshots. I can’t play the channel with one click. There’s no description, so I’m left guessing if I should try to learn more about the channel. Even if I already knew I wanted to save the channel, I can’t add it to my favorites in one click. All of these actions require at least two more mouse clicks. Give me a description on mouse-over, or even right on the list, and some quick buttons to get things done without another page to load (which doesn’t always load quickly either!).

  6. The list of my favorite channels shows even less information. There’s an icon that doesn’t seem to tell me anything useful and the channel title. That’s it. There’s no screenshot. The other menu had four of them; why doesn’t this menu have at least one? Thankfully, each item has a few extra buttons like I wanted for the channel catalog. I can click a play button, click an information button to view the channel’s description, or I can choose to view the full channel page. Not bad, but I believe the channel’s description should either appear on a mouse-over, or it should be included in the list by default. I want to scroll through the list quickly much like I do with search results on Google or elsewhere on the web. Navigation should be fast!

Again, I just want to say that Joost has potential, and I love the idea of viewing a lot of video content, like full TV shows, for free, right on my PC. However, I get the impression that this application wasn’t planned, but put together quickly, with many new features added over time without refactoring. I’ve been reading about Joost in sites like Digg for a while now, so I know they’ve had multiple releases, and there was a more restricted beta with fewer invites before, so I’m a pretty disappointed by the lack of polish.

I recommend Democracy Player if you want a clear and easy interface. It’s a little more focused on video RSS feeds (which, by the way, didn’t appear to be an option in Joost), but I definitely found it easier to add and find content with Democracy. What’s interesting is that the options in Democracy aren’t necessarily as rich as Joost, but Democracy’s design is more like a traditional desktop application, and I think that left me with fewer expectations when it comes to the richness of the UI.

For Joost to win me back, I think they definitely need to focus on the user experience–especially in the areas I described above. Once I got my first look at the Joost interface, I think I expected to see a nice mix between Apple’s super-crisp FrontRow interface and Democracy Player. Instead, I discovered a clutter of indecipherable icons, too many mouse clicks to get anything done, and a general sense of “alphaness”. Ultimately, I think I got caught by the hype. The invites make Joost seem exclusive in some way. It worked for GMail, but when I started using GMail, it was already pretty polished.

Explore Digg's Keywords with WordWeb

by Josh Tynjala

The deadline for Digg’s API contest is less than a week away. Always ready for a coding challenge, I immediately knew I’d be building something when I first heard about the contest at the Digg Millionth User Party last month. My entry analyzes the keywords from the top stories on Digg, and builds a graph that shows the relationships between those words and the stories in which they appear. For example, the keyword “apple” is often related to “mac” and “ubuntu” is often related to “linux”. Keywords that appear most often will be larger and more prominent than words that appear only once or twice. Clicking on a keyword will re-focus the graph and the user can explore deeper relationships. Try it out!

Screen capture of WordWeb application for Digg's API

If you can’t tell, the application was built with Flex. Under the hood, I’ve used a modified version of Mark Shepard’s SpringGraph component. Modifications of note include some customization options for the SpringGraph’s appearance, such as line thickness, and I built in some events for mouse interactions with nodes. I’ll have to contact Mark to see if he’d like to use my changes. They certainly make the component more useful.

The keyword analysis engine is based on the one I built to chart top keywords in my MXNA Dashboard application. Basically, it accepts a list of strings, breaks them apart into individual words, and tracks the number of appearances for each word. You can also pass in a list of words to exclude. In this case, I chose to exclude many common words like “the”, “his”, “were” and others like that. I wish I remember where exactly I found it, but I discovered a great list of nearly 1000 that someone had compiled and offered for free use within this sort of program. With a few changes to stop excluding important words like “president” and “congress” (obviously, people talk about politics a lot), the list became an excellent filter.

Of course, source code is available! You’ll notice that it uses Cairngorm. I’m not necessarily following 100% best practices for this framework (no delegate classes, for instance), but I still like to use it for MVC purposes. This application is mostly quick-and-dirty, so commenting is pretty much non-existent. I don’t expect to touch the code again, so it didn’t seem too important. I figure someone will probably find it useful regardless. Enjoy!

Pages: Prev 1 2 3 ...7 8 9 10 11 12 13 ...18 19 20 Next