So thanks Dan! If anyone is having trouble with getting the coverflow library to work make sure to check out Dan’s screenshots and his tips.

Here are a few links to the Flex documentation that explain SWC files and how to use them in your projects:

• Using SWC files in your projects
• About SWC files

Note that this isn’t a decision about legality (not for the legality of MuxMaster anyway) and I wasn’t coerced or threatened or anything like that. Justin just sent me an email saying he liked the app (and is cool with people making apps like this) but that the download feature endangers Muxtape. I agree, although I still don’t know whether I should feel obligated to remove the download feature.

MuxMaster icon
On a lighter note, Juan Sanchez whipped up a little icon for MuxMaster, which is now included in the latest version of the application. Pretty sweet huh? Thanks Juan!

You can still download MuxMaster (Lite) without the download functionality:

If the above install link doesn’t work, do this:

1. Make sure you have the AIR runtime, if you need to download it from Adobe
2. Download and run the MuxMaster installer

If the above install link doesn’t work, do this:

1. Make sure you have the AIR runtime, if you need to download it from Adobe
2. Download and run the MuxMaster installer

Here are a few screenshots:

Why did I make this?
I like Muxtape. Like a lot of software/web guys, I saw the clean interface and the barren source code and was immediately impressed. I mean, the dude did a fantastic job. It was just so damn clean.

Then a few days ago people went ga-ga over this video of some dude showing muxtape mixes using the Coverflow visualization to browse through them. OK, so that’s cool, except it uses a Mac-only application called Fluid to basically add normal Mac desktop functionality to web apps. That shit got dugg like 750 times. Now I’m not saying it’s not cool, cause it is. But I figured I could probably whip up a Flex application pretty quickly using the Coverflow component I released before and get a real desktop application that anyone could download and use. Oh, and I thought it would be neat to add downloading functionality too.

So I threw MuxMaster together over the past 3 nights. I like to think of it as a testament to the badassness of Flex and the open-source Flex/Flash community. The fact that I can grab some open source stuff and throw this together in almost no time is pretty cool.

What kind of an application is this?
MuxMaster is an Adobe AIR application, built with Flex. That means it’s a desktop application that can run on Windows, Mac, Linux, whatever. Click the “Install Now” link above to install the app. You might need to go and download the AIR runtime first. Hopefully it’ll tell you that and do everything automagically.

The Muxtape API
Muxtape has no API. But the HTML code is so sleek and beautifully clean. Go look at the source code for the HTML pages on muxtape.com. It’s ridiculous how sparse it is. And of course it validates as valid XML. So what? Well, nice XHTML like that is just as good as the best XML API you can ask for. You want to get a listing of some random Muxtapes? Just load up the XHTML on the Muxtape home page and parse out the list of users. Using E4X you can get a list of users with this single expression: body.div.div.ul.li.a. It’s almost too easy. So then when you get a username you just load that user’s HTML page and you can easily parse the list of songs (body.div.ul.li) or related users (body.div.div.div.ul.li.a). There’s a little trickery involved to figure out exactly how to construct the URLs for the MP3s, but it’s pretty easy to figure out. After a little parsing you can get a list of MP3 URLs and the data about each song, like artist, track title, duration, etc.

Downloading songs

The thing about Muxtape is that all the songs are just MP3s stored on Amazon S3. If you know the URL you can download the file. The main Muxtape player doesn’t expose this functionality, but if you take a look at the files that the web-based player is loading you can just copy/paste the URL and load it into a web browser to save the file. So I just made that a bit easier. MuxMaster has a Download link for each song underneath the song name. One click and the song will download in the background (you can specify where you want songs to download to). Additionally, each playlist also has a Download All link, so with a single click you can download all the songs in the playlist.

Is this bad?
There’s a whole ethical dilemma that we can spend forever discussing. Is this application against everything that Muxtape stands for (clean, simple, bare-bones UI)? Is adding download functionality quickening the shutdown of the service? Is this effectively taking a step toward destroying the service that I actually really enjoy using? Yeah, the answer to all those might be yes.

Yes, the excessive use of 3D and especially the over-used Coverflow visualization are exactly opposite to the perfectly clean design concept of Muxtape. The truth is, I hate Coverflow. But people gravitate toward it and seem to love it, so I figured it’d be fun to whip something up and see the response. And it was just so damn easy.

And yes, being able to download an entire mix with a single click may very well be a horrible thing for Muxtape as a whole. I assume the service is already on the radar of the lawyer-crazy music execs, and if it’s not now I assume it will be if it gets big enough. But the technology underneath the service was just so simple (I mean, really? just let people throw a bunch of MP3s up on Amazon S3?) that someone would have shown how to download all those songs soon enough. So I’ll definitely feel bad if this app has a negative effect on Muxtape, but come on, it’s something I whipped up in a few days, someone was bound to do it.

Source code
I’m releasing all the source code for the application. When you install the AIR application you can right click and select “View source” to see all the code. Or you can view the source here. It’s small (16 files, 898 total lines of code). And the code was influenced by the minimalist design of the Muxtap app itself, so I tried to keep things extremely tidy and clean.

I used a few open-source flex libraries. The most obvious one is the Coverflow Flex component that I created and released on my blog. That’s licensed under the MIT license, so you can take that component and add this type of Coverflow visualization to your Flex apps. The Coverflow visualization uses the Papervision 3D library, which is a 3D engine for Flash. It’s badass and free (MIT license). The other Flex library I used is FlexLib, which was used for the FlowBox container. That component can be seen when you download songs. It’s the container that lays out the little download rectangles. FlexLib is also licensed under the MIT license (is there a pattern forming?).

The source code for MuxMaster, like all code released on my blog, is also licensed under the MIT license, which you can read here. Basically you can do whatever you want with the code.

What’s next?
I don’t know if I’m going to do anything more with this application. The app does rely on the format of the HTML pages on Muxtape, so if the creator of Muxtape decides to try to break MuxMaster he probably can, and I’d have to update it to get it to work again. I might do updates like that to keep it working. If people have feature request I’d love to hear them, but I’d encourage other developers to take my source code and add the stuff that they want. If you have feedback shoot me a message using my contact form or leave comments here. I don’t have any big plans, this was fun to make.

Legal nonsense
This application doesn’t contain any music files whatsoever. I am not storing any music files on my server or any server that I am associated with. I am not providing a list of any music files stored anywhere on the Internet. I don’t have any information about how to find music files stored in any database or anywhere in the entire galaxy. If you’re a lawyer looking to scratch that soul-destroying litigious itch that you have, I’m the wrong guy to talk to.

Here at Gmail, we work very hard to fight spam. This includes not only spam coming into Gmail but spam being sent out from Gmail as well. Believe it or not, spammers sign up for Gmail addresses in large numbers just to send out spam! To help do our part to keep this junk off of the internet, we bounce mail that we are confident is spam. Unfortunately, we aren’t perfect and will occasionally bounce legitimate mail. We apologize for the inconvenience.

Umm, ok, I guess. That’s pretty lame that I’ve been a fairly regular emailer to what is very clearly a Yahoo mailing list for the past few years, and now Google decides I’m acting like a spam bot when I try to send this message. But then I laughed out loud in the kind of “fuck you” way that I do sometimes when I read this:

Depending on your needs, there are a number of different ways to reliably send bulk mail that avoid the pitfalls of doing it manually with Gmail. You may be interested to try Google Groups for newsletters/mailing lists or Calendar for sending invitations to events.

So Google blocks my valid email to the flexcoders mailing list (a Yahoo group list) and then recommends I try using Google groups mailing list. You’re telling me that if I had been sending to a @googlegroups.com email address instead of a @yahoogroups.com email address then it would have gone through?

The example below uses the motion detector and ties it to a webcam. You’ll have to allow the app to access your webcam to see it in action. If the motion in the webcam exceeds a certain amount (20%), then it takes a snapshot and sends it to the CIA (ok, ok, it doesn’t really do that, it doesn’t send the snapshot anywhere).

View source

Someone emailed me recently asking about this code, since it was shown in a previous video I created when I was working on TileUI a while back. This is the first in a series of chunks of code that I’m thinking about taking from that project and releasing open source. No, I don’t think I’ll be releasing all of TileUI, but just some of the components within it (like the radial menu component maybe).

UPDATE: As various people have pointed out, there is built in motion detection in the Camera class, so if you want to detect motion in a webcam feed all you have to do is monitor the activityLevel property of the Camera. I guess I should’ve known that before posting oh well. This motion detector example is still useful if you’re trying to detect motion in anything other than a webcam feed though, such as another video playing in your app, or any other UI component that has visible changes.

P.S. I’ve been very quiet on the blogging front. This is because I’ve been super crazy mega busy between my job and writing Flex for Dummies, which is available for pre-order on Amazon. I expect to get back to blogging much more sometime after May 13 (after I sleep for a week).

I’ve got 20 SlideRocket invites to give out. Yup, a whopping 20. Hell, after getting featured on TechCrunch today I figure these 20 are a hot commodity. To get an invite check out the presentation below (which uses SlideRocket of course).

The 20 invites are on a first come first served basis, so once they get used up they get used up. I don’t have any more so don’t email Again, to get the invite URL you have to interact with the embedded presentation above.

I figure TechCrunch got 500 to give out, Ryan Stewart got 100, so that makes me about 4% as cool as Arrington and 20% as cool as Ryan. Hell, that’s good enough for me.

If you haven’t heard about SlideRocket, it’s the most badass online presentation tool in existence. Congrats to Mitch and the SlideRocket team on getting funded and the great press.

Here are the full survey results from my session.
If you weren’t at 360Flex, check out the stuff I presented.

The good stuff
Overall the comments were very positive. There were 45 responses, with an overall average rating of 4.5 (which I’m hoping is out of 5, not 10 ). 80% of people said that the session was what they expected, 80% said the slides were useful and 80% said the session was informative. So here are some of the positive responses (aww, shucks…).

The speaker had a good outline and followed it well, while also allowing community/group input.

Doug was AWESOME and funny. Loved it!

In typical fashion, Doug had a great presentation with a lot of good information. Doug is an inspiration to the whole community.

Doug brought to light components that we all can make use of in our apps - and some that are just fun. Very helpful.

The bad(ish) stuff
These are the only negative comments I received. The first one is about the discussion near the end feeling unorganized. I understand that sentiment, I felt rushed near the end when I was running out of time a bit. I love having good discussions with the audience, but I probably should have left more time devoted to that, and maybe even planned for that in my outline to make sure I had plenty of time to wrap up in a more organized way. The other three comments here are about my language. The last one’s not really that negative a comment, but the middle two sound like the writers were fairly offended.

The presentation could have been a bit more structured, as it felt like the discussion veered away from original intentions near the end of the presentation.

It caught me off guard how much the speaker cursed.

I don’t know what to say. It’s probably not a good idea to try to see how the sign language interpreters do cursed signs. That would make the deaf person uncomfortable.

This session was great for information and mentality about developing in the flex world. Doug is a little unprofessional as a developer it doesn’t bother me that much and I would definitely hear him present again because I respect his knowledge and talents but the language is a little distracting.

The funny comments
And then a lot of the comments were pretty funny. I’ve cherry picked a few choice ones here for your amusement.

I appreciate his frank, unexcessively vulgar language

jiggly moving fun

Always a great time. Never seen so many curse words done in sign, damn funny.

Fucking-A

Okay, I am just chiming in that I really wanted to go to Doug McCune’s seminar but knowing that I lack experience with OOP and want to develop that further I went to that one instead. Can’t we put Doug McCune against sucky, uninteresting topics instead. *lol*

It’s “fucking” Doug McCune

The language issue
So let’s get this out in the open: I say fuck and shit a lot. Sometimes this comes through on my blog, but even more so when I actually speak. Given the session feedback I think a lot of people find my use of language refreshing and funny (what am I? a clown?). I like to think my presentations are informal, we all just get to hang out and talk about cool stuff, so since it’s just like chilling with friends I don’t censor my language. A lot of the comments in the feedback referenced my use of language in a positive way and said how “fun” and “hilarious” the session was. I like to think we had a good time and it wasn’t dry or boring.

That said, there were obviously a few people at least who were offended and uncomfortable. So in the future I may tone it down a bit, I certainly don’t want people walking out of my presentations upset. I’m sincere when I say I apologize if you were offended.

Maybe next time I’ll start by showing a clip of Goodfellas or Casino at the beginning, then whatever I say will be tame in comparison. Or maybe I should wear one of these on my chest:

At my next session I’ll be checking IDs at the door. If you’re under 17 you have to be accompanied by a parent or guardian.

So thanks to everyone who came to my session! And super double thanks to the 45 of you who gave feedback, it makes me feel all warm and fuzzy inside (well, most of it anyway).

P.S. To Andrew: yeah, your comment got to me Sorry I posted the survey results with your name still in there, if you got a problem with that send me an email (or better yet send Tom and John and email).

I figured the first place I’d look for the kick ass Silverlight demos would be the silverlight.net showcase page by Microsoft. I mean, there HAS to be sweet stuff shown there right? Um, not so much. I checked out each of the demos on the main silverlight.net page and here’s what I found:

• Infragistics Silverlight demos
  This site has a few screenshots of some charting stuff in Silverlight. The charts look pretty good in fact (heh, at this point anything that doesn’t look like the default Flex charts feels “fresh”). But the Infragistics demo site itself (which is a Silverlight app) is slow as balls and doesn’t impress me at all. It feels clunky, the animations are rough, and is just kinda boring.
• Silverlight book flip effect
  On the Microsoft Action Pack (wtf is that?) product page they use Silverlight for that amazing book flip effect. I won’t rail on this too hard, but suffice it so say I think the book flipping thing is an awful idea 99.99% of the time (that .01% of the time it was actually useful was the anatomy example Ely Greenfield did, that was the only time I’ve ever thought book flipping was useful). The Silverlight flip effect was super slow (like in the unusable way).
• Microsoft Dynamics
  I think the only use of Silverlight on this page is for a non-interactive animation. Consider me unimpressed. But maybe I’m missing something since the site’s in Italian. Does this Silverlight demo do more than simply play a short video?
  
• Sanremo Anche Noi
  This app’s actually pretty sweet, it’s a well designed video showcase. It’s simple, basically just lets you browse various videos, but does a good job at showing good quality video is designed well. There’s nothing jaw dropping here, but it’s a solid, well designed experience.
• Zebrakho
  This is a store that sells animal skins and heads and stuff. And as much as I want a big animal head mounted on my wall… But seriously, the site uses Silverlight for a few small animated effects, but it comes off feeling like an old, poorly made Flash site, complete with that scrolling news-ticker thingy to show product specials.
• Vodafone Interactive TV
  Another video site, complete with a skip intro movie! Ahh, back to the good old days. Seriously guys, if you want to do the whole “better than Flash” thing then don’t take us back to the skip intro era. The site itself is pretty simple, again just showing off a bunch of videos.

Yes, I am aware of the Silverlight showcase, and I’ve been browsing through a little bit, but it’s hard for me to wade through so many apps in order to find that one amazing example that blows me away (yet to be found). I did find this example though, which was cooler than the ones on the front Silverlight showcase page.

• Microsoft TechDays
  This is a pretty cool design that lets you drag around polaroid looking photos that play video. Cool concept, except it runs pretty slow on my machine, which destroys the smooth dragging and resizing effects. I can almost guarantee I could make the same concept that would feel smoother and slicker as a Flex app.

I also tried the Microsoft download center, since I had seen some people blogging about that Silverlight app. My overall impression? It feels like an Ajax app. The animations are limited to the simplest of dropdowns and even those feel slow and choppy (click on the “Browse Downloads” button). I don’t see anything I haven’t seen with JavaScript stuff, and the overall site just feels like DHTML, even if it’s not.

This all feels like old, bad Flash
I feel like I’m in a time warp. These example apps all feel like old Flash sites to me. They feel clunky and slow (is that because I’m on a Mac?). They even have design elements that people used to use but have since been demonized and cast aside (skip intro, news ticker).

Show me something I can’t do
I have yet to see a single thing that I can’t do with Flash/Flex. Now I’m not saying that Silverlight is worthless unless it has sweet features above and beyond what Flex (or Flash Player) can do. Having a competitor is a good thing, it’ll keep Adobe on its toes (H.264 anyone?) and drive innovation. But for all the hub-bub about how Silverlight is going to be awesome, I have yet to see anything awesome being created. It all feels slow, clunky, and poorly designed (that last part isn’t Microsoft’s fault obviously). I just want one thing that makes me sit back and say “Holy shit! THAT’S what you can do with Silverlight?” Just give me that, throw me a bone.

I had that moment when I saw Pavan Podila’s WPF example of doing 3D layouts with WPF. That blew me away (he made it back in June) and I realized that WPF ain’t nothing to fuck with. If you get 3D out of the box and can create such fluid layouts, I may just have to start learning WPF. Granted, you can do very similar things with Flash, but Pavan’s videos are just so damn smooth and responsive. BTW, Pavan’s a really cool guy, I met him at 360Flex just recently, and he’s one of the few guys I know who rocks both WPF and Flex. We’re lucky to have him on the Flex side (Pavan’s on the Degrafa team) because not only is he a smart ass dude, but he has a whole different perspective because he knows how they do things in WPF. For those that haven’t seen, here’s a video that Pavan made to show off 3D layouts in WPF:

So I know most of the people who read this blog are Flex devs, and that the crossover is pretty slim, but in case anyone knows of the dopest, most jaw dropping Silverlight demo they’ve ever seen that would make me mess my pants, send me an email. I don’t necessarily mean an actual application, I just want to see something cool. Maybe there’s some sweet stuff hidden away on blogs (I know there are tons of cool Flex demos on people’s blogs). Bonus points if you have something that does cool data visualizations stuff. And yeah, I’ve seen the tafiti demo, don’t send me that one. And super double bonus points if the app wasn’t made or funded by Microsoft.

The speakers are getting damn good
The Flex speaker roster has matured a bit, this conference marked the third 360 event that some of the speakers have done (this was only my second conference as a speaker). I think you can see very visible improvement in both the content and presentation skills of the speakers. There were two sessions I’m kicking myself for missing: Jun Heider’s presentation about memory management, and Michael Labriola’s presentation on what happens during the first few milliseconds of your application startup. Both speakers have posted their slides and material. Hearing the buzz around the conference, it sounded like those two presentations were two of the absolute highlights.

Here’s my theory on why those presentations were so good:

1. The speakers are maturing in terms of Flex expertise and speaking skills. Both Michael and Jun spoke at previous events (previous 360|Flex and also MAX). It takes a while for speakers to find their groove, and I think with a lot of the Flex speaker roster we’re seeing that people are now at the point where they are confident, badass speakers.
2. The content is crazy technical and the audience is ready. Previous Flex conferences have been dumbed down in terms of the advanced sessions. 360|Flex Seattle was more technical than the first one in San Jose, but it still didn’t meet the needs of the advanced Flex users out there. This was a tough line to walk, though, because if you did an uber-technical preso you probably would have had about 10 people in the room and only 5 would have understood what you were saying. Jun and Michael’s sessions were way more technical than anything presented at previous 360 conferences. And the audience was able to get it. That says a lot in terms of how much better everyone is getting. I think both of those sessions would have probably bombed at the first 360|Flex back a year ago (god, was that really only a year ago?).

Reflection on my sessions

(Photo by John Mason)

I had a really good time presenting at this conference. I apologize if I offended any of the sign language translators (if you weren’t there let’s just say I had fun getting them to translate certain phrases). My main presentation was on using open source community projects and I’ve posted all the slides and sample code. I thought this session was fun, although I think I crammed a lot of stuff into the 80 minutes and didn’t have as much time as I would have liked for the kind of organic discussion that I find so fun. When I originally told Tom and John the idea for my session they suggested doing an all-day hand-on session on the topic. If I wasn’t so lazy I actually think this would be a really good all-day type of thing. Maybe in the future we can get enough speakers to tag team it, so nobody has to spend the whole day presenting.

The second session that I did, which was unplanned, was a session on building your personal brand. Juan Sanchez and I teamed up for this session and talked about our different approaches on branding and marketing yourself. This session was in place of Jesse Warden’s originally planned session that was on a similar topic (although Jesse planned on covering a lot more content about the business side of things). BTW, if you attended 360, Jesse’s original presentation PDF is on the USB stick, check it out in all of its 215-slide glory. As for me, I had about 8 slides I whipped up 20 minutes before the presentation. This session was a pretty awesome discussion, most of the people in the room contributed and talked about their experiences. Jeff Houser was there and talked about brand building from the perspective of a business-owner (ie not a crazy egocentric nutjob developer like myself). I think the topic of branding is hugely important, and I’d like to see this kind of content presented much more at these kinds of conferences.

I want videos again
This year the presentations at 360 weren’t recorded, and I’m really wishing they were so I could watch Jun’s, Michael’s, and a bunch of other sessions. Last year I didn’t watch the videos of anyone else’s sessions, primarily because the technical level of the content wasn’t quite there. Now I’m pissed because I know there’s some seriously good information in these presentations that I missed (and reading through the slides isn’t nearly the same). I vote for recording this stuff again, even if next time that means we each do it ghetto style and and just stick a crappy camera in the corner of the room.

I love you guys
This is the best developer community. I heard over and over again during the conference about how nice everyone is. There are no asshole prima donna speakers, everyone is approachable and friendly. That goes for the speakers, everyone from Adobe, and all the attendees. Everyone’s just authentically nice. The Flex community is going to grow dramatically over the next few years. Let’s try to keep this awesome small-community vibe that we got going on. This community vibe is why I love presenting at 360|Flex (and the main reason I don’t present at other larger conferences).

Thanks Tom and John! You guys rock.

(photo by Terry May)

Physics Form
I mashed together the most generic, boring, crappy Flex form example app with a physics engine. The end result is an example that shows how you can add in physics simulations into “normal” applications (as opposed to only games or whatever). In the example below, click on the Login button to watch what happens (hint: after you click login try dragging around the controls). Oh, and I threw in the PromptingTextInput component from FlexLib to meet my requirement of using at least two open source projects in each example.

Open source stuff used:

• FOAM
• FlexLib

View the example | View Source

VistaFlow
This example uses the FlexMDI library (now part of FlexLib!) to manage multiple open windows and switch focus between them. I combined that with a slightly modified version of my CoverFlow component that I posted before, and I made an effect similar to Vista’s Flip 3D. When you launch the example try adding a few windows with the “Add Window” button and then press Shift-Enter to cycle through the windows (ie hold Shift and then keep pressing Enter to move through the list of windows).

Open source stuff used:

• FlexMDI (now in FlexLib)
• Extended Flex CoverFlow component

View the example | View Source

WindowShade + Degrafa example
In this example I used the newly added WindowShade component in FlexLib, combined with the CanvasButton control (also from FlexLib), combined with Degrafa for some custom graphics drawing and CSS skinning. It’s a simple example of creating a “drawer” type of component that docks to the top of the screen and drops down when the user clicks the handle.

Open source stuff used:

• FlexLib
• Degrafa

View the example | View Source

MP3Flow AIR app
This demo is an AIR application that lets you drag and drop MP3 files onto it and it will extract the thumbnail image from the MP3 file and use that image in a CoverFlow UI. To extract the thumbnail I’m using Metaphile, which is a project created by Ben Stucki for reading and writing metdata from files. This app also uses another of Ben Stucki’s components, which does the audio visualization stuff.

Open source stuff used:

• Metaphile
• CoverFlow Flex component
• Ben Stucki’s audio visualizer

NOTE: I used the last AIR/Flex 3 Beta for this example. I have not updated it to AIR 1.0. If you have the new AIR 1.0 runtime I assume this app will not install. I’ll try to update this example within a few days, but for now it will probably only work if you have not upgraded the AIR runtime on your machine.

Download the AIR installer | View Source

FlexSpy with Event Listeners
I decided to show this example even though I had already released the code on my blog. I realized that this example was perfect for showing the benefit of keeping a running list of open source projects in your head. I remember seeing FlexSpy when it first came out, I read about it on a few blogs and briefly checked it out by playing with the example. But I didn’t ever download the code or use it in my app. And then last week when I was monkey patching FlexSprite to add extra event listener functionality and I realized that this was a perfect place to use FlexSpy. I couldn’t remember the exact name (I thought it was something like Flexray), but I googled around, determined to find the project that I knew existed. Pretty quickly I found it, pulled it down, started reading the source and hacked in the functionality I wanted.

After doing that I realized that this is exactly what I was going to be talking about in my 360 session. Since I had been reading Flex blogs when FlexSpy was released I at least knew it existed. Since I love open source projects I had initially checked it out and understood what it did. Then later, in a completely unrelated project, something clicked in my mind and from some far corner I pulled up that memory of the FlexSpy project.

Open source stuff used:

• FlexSpy
• Monkey patched FlexSprite example

View the example | View Source