Antti Kupila

Personal Blog, Portfolio and Online playground

View over the green room at Sid Lee, Montreal

Stack Overflow goes live

The name Joel Spolsky may or may not ring a bell in your head. If not, maybe Jeff Atwood or the site codinghorror.com? Well, these guys have got together and built a resource for programmers. The goal of the project is simply to “”. The site launched for the general public today.

I’ve been following the project with the weekly podcasts since they started them . It’s been interesting to listen to the progress of a site like this which essentially is doing the same thing as many other sites out there, but trying to do it better. If they succeeded or not is for you to decide but judging from the beta I’ve been testing recently, i think it’s definitely looking good.

I think an interesting approach has been the balance between technology and psychology in the project. A social site of course has it’s technical challanges with databases and such but even more it’s the human side to it. Sure you can optimize your code, squeeze out every millisecond, add a bunch of features and all that but if it’s not usable to a human being or even more precisely the target group, it’s not going to work. If you ask me it’s the non-technological features that make stackoverflow rise above the rest; the site encourages users to make it better.

Take it for a spin: http://www.stackoverflow.com

Also read Joel’s post: Stack Overflow Launches
Jeff doesn’t have one up yet, but I’m guessing he’s going to write something so keep your eyes peeled.

I’m sure the site will change & improve a lot in the coming year so make sure you come with your ideas to the team.

FeedLanguage: translate rss on the fly

Yesterday Google released an addition I’ve been waiting for to their already impressive set of API’s, now including the Google Translate AJAX API.

Hello. My name is Antti and I am an RSS addict.
Seriously though, I get most of my industry news via feeds. The technology while being so simple really is extremely powerful, easy, quick and effortless; it’s hard to say no. Still, there are a couple foreign feeds i want to follow but i don’t want to translate the texts all the time, so i was looking for a service that translates RSS feeds on the fly. I didn’t find anything useful. FeedBurner does a lot so i could easily see them doing this too (especially now that they are a part of Google…) but nada. So, I built my own little prototype.

FeedLanguage beta | Feeds in your own language!

This was mostly built for myself but i thought i might as well release it for the public. Feel free to try it out and let me know if you run into issues. If you’re interested I don’t mind releasing the source.

http://www.feedlanguage.com

How about my feed in .. Italian? ;)

The best use of 3d so far

I’ve got to say that I got this warm fuzzy feeling when I checked my RSS feeds today and saw the Red Bull Flightlab site mentioned on a couple sites. After checking out the piece myself I’ve got to say that it is hands down the best use of 3d I’ve seen online so far.

Red Bull Flugtag

redbull.com/flightlab

The biggest thing here is that it doesn’t feel like 3d is used just because it’s 3d, but for a reason. The rest of the site holds up to the high standard it sets too. As frosting on the cake the site supports deeplinking too and has a fully functional browser history. A big hand to Lessrain.

Read their blogpost about the creation too. Good stuff :)

Flash, SWFAddress and Google analytics

It’s been quiet here for a while, sorry about that, “been busy”.

Anyway, i was browsing through my news today and noticed that SWFAddress automatically gives google analytics hits. This means that if you build your site with the back button (etc) enabled using SWFAddress, Google Analytics will also track the visitors internal navigation, automatically! Nice! To some of you this maybe isn’t any news (1.1 has been available since February), I just hadn’t noticed it before.

To use this you don’t really need to do anything, as long as you have the _uacct="UA-xxxx-x"; part from the google analytics script, it’ll work fine. Also you don’t need to call it the first time, SWFAddress does it automatically.

<preach>
Now come on people. I know most of the people reading this are more or less experienced flash developers. Today it’s so friggin easy to have a fully functional, accessible and search engine friendly flash site that there’s not really a reason not to do it. Sure, it requires a little extra time to implement if you haven’t done it before, but when you’ve built a framework of some sort for it, it doesn’t really require any extra effort to implement.

Overall I think experienced flash developers should take responsibility for doing things right and show a good example to those who are learning. The people who say flash sucks have their reasons, but there’s a way to fix it (or at least parts of the problem).
Have it as a requirement, not a bonus, in your next project, ok? Thanks :)
</preach>

via: danielyuen.hk

Dreamhost’s security problems

Sigh. I wake up today, check my mail and notice a mail from Dreamhost (where, as some of you know, I am hosting this site) titled “URGENT: FTP Account Security Concerns…”. Ok, this can’t be good. I continue reading and find out that somebody found an exploit in Dreamhost’s security, got a shitload (~3500) of ftp passwords and had some automated script login to the ftp and modify the index page.

Ok, “only” 20% of the affected accounts had been accessed and out those not all had files modified (the bot just downloaded the directory listings). Now what are the odds that my files had been modified? Very high, of course. Sigh again.

Well, it’s no biggie really, the automated script added 360 spam links to my index.php. The links had display:none so you probably even wouldn’t know about them if i wasn’t writing this. Still not very nice, especially if a search robot crawled my site during the time it was affected. Spamlinks are the obviously a big no-no if you check your SEO A-B-C…
Check out index.php after the modification. The first 5 lines are from WordPress, the rest…well, yeah.

According to Dreamhost’s e-mail only index.php (and other index files) were affected. I definitely don’t have the time to go through every single file i have on my server, so i won’t. If you find anything weird, please let me know :)

Last week Dreamhost had severe problems with the DNS, now this. Frustrating is the first word that pops to my head. I mean, in general I’m happy with Dreamhost–what you get for the money is great–but i don’t want to receive more emails like this one.

If you got the same mail and found similar (or some other?) activity, drop a comment :)

Open source put to good use

Heh. Noticed today that a new “web 2.0” app iden.tify.us is using my Revolt visualizer in their player. Cool :)

Getting JPG dimensions with AS3 without loading the entire file

Does this sound familiar: You’re loading a JPG file, and want to know what size it is before it has loaded? This can be useful if you’re for example drawing a border/background, which will contain the image. If you don’t know what size the image is, you don’t know what size the box should be. I’m sure there are better & more common uses to this, but i know for sure it can be really useful.

Anyway, I decided to solve this problem. If you don’t care about how it works, fine, i’ll give you the short version first. After all the class i’ve created does all the heavy lifting for you, so if you just want to have it work, you can just use it without worrying about what’s under the hood.

Here’s the class: JPGSizeExtractor.as. Download it and put it in a folder com/anttikupila/utils in your classpath. Then you can just use it like this:

[as]
var je : JPGSizeExtractor = new JPGSizeExtractor( );
je.addEventListener( JPGSizeExtractor.PARSE_COMPLETE, sizeHandler );
je.extractSize( your_jpg_file.jpg );

function sizeHandler( e : Event ) : void {
trace( “Dimensions: ” + je.width + ” x ” + je.height );
}
[/as]

To trace out debug information, you can say je.debug = true;

What it actually does is that it starts loading the JPG file and analyzes every byte that has loaded. When it find the jpg’s JFIF headers (according to the JPEG specs), it will be able to determine the dimension of the file and close the stream. The dimensions in a jpg are before the actual image info, meaning that you can load a 10mb file and get it’s dimensions in a fraction of a second, instead of waiting for the entire file to load.

Note: This doesn’t work for all files. Some files i tried with were not according to the JPEG specs (or then i misunderstood something, which is more likely since other software showed the correct dimensions). Don’t use this in mission critical projects, unless you have control over the JPG files. I don’t take any responsibility of it working correctly.

Download the class, with an example

If you’re not so much interested in “the what”, but more “the how”? Read on. Let’s see what we can do about that .. ;)

Continue reading

Web conference: connection.07

Me, Erik Johansson, Joel Larsson, Sara Silfverberg and Line Everlund Matulac from Crew 12 attended the connection.07 conference in Gothenburg, Sweden today. The title was “a conference about the new web”, which was exactly what it was about. All 5 speakers were actually really good, and had a lot of interesting thoughts to share with the audience. The “new” in the title was about the web as a platform, mobile web, usability & accessibility, web standards, user generated content and in general the wisdom of the crowd. The information in itself maybe wasn’t totally new to me as i’ve done this web thing for some time now, but it’s always nice to listen to lectures about the area. Also the mobile platform is pretty new to me, and it would be exciting to experiment with it’s possibilities. The photos here were taken by Jens Wedin.

People at connection.07

In addition to the other four excellent lectures it was really nice listening to Roger Johansson, a person who’s blog i’ve been reading for quite a while. Just to see his stubborness (one might call it passion) with the usability & accessibility + the standards issue (all of these of course are more or less related) was something. I can say that I totally agree with him here; i mean, what would happen if the people who are building a bridge didn’t either know how, or simply didn’t care, to add adequate support structures. Exactly. Or, to be more on the subject, maybe a library should only allow people in who are not wearing glasses, or more specifically just not allow them to wear their glasses, the aid they have to help with their disability. Yep.
Alright, the examples may be a bit but as Roger put it “why do it wrong when you can do it right”.

Roger Johansson's lecture

Unfortunately the major part of the web is still in the bad old days, with bad design (talking about application/code and structure, not so much graphical), and pretty much total ignorance for the disabled, not to even mention the cross-browser problem. Roger’s on a mission to improve that, which i think is really great. I’m sure you’ve read an article or two at his blog but if you haven’t i encourage you to do so: www.456bereastreet.com.

A flickr group for connection.07 has been set up and a couple images have appeared there already. Go check out the photos.

All in all the inspiration is just flowing and i can’t wait to get back to work, to get my hands dirty. Thanks to everybody who was there.

Level Vodka – Beyond Smooth

Perfect Fools has worked together with Great Works, building the new Level Vodka site for V&S Absolut Spirits. I have done the flash development for the site. Check it out.

Now the question is: How Beyond Smooth are you?
See the movie, take the test and find out.

www.levelvodka.com
www.absolut.com
www.perfectfools.com
www.greatworks.com

Flame – 3D music in Actionscript 3

A couple days ago i happened to stumble upon a really cool 3d engine called papervision3d. It’s been out quite some time already, and i’ve heard of it before, but i’ve never really gotten to it to actually play around with it. Well, no i have – and boy, i love it. It’s amazing! Huuuge props to Carlos Ulloa + everybody else who have contributed to this magnificent open source project.

This also gave me a reason to get back and play with as3 a bit again. Due to loadsa other stuff it’s been a while and i had already forgotten how great it is compared to as2 ;) Actually it’s not so nice working with projects in as2 anymore, but you’ve gotta do what you’ve gotta do ;)

Anyway, flame. Or well, yeah, that’s what i wanted to call this experiment. Codename: flame maybe? Either way the first time i iTunes‘ CoverFlow i really liked it. In general i love pretty much everything Apple does visually, and CoverFlow was no exception. So i got my dose of inspiration pretty easily. Also papervision3d is so amazingly easy to work with (compared with the results) that i just had to sit up way too late a night or two, doing some nifty demos. At the same time we also had this technology specialization module at school, where we were supposed to do some technological individual project, so this fit in pretty nicely. I heard of the deadline pretty close to 24h before :)

Well, you probably wanna see what i did? Sure.
As it’s written in actionscript 3 the Flash 9 player required. A fast computer is recommended.

Click to see flame live!

So, what is it? When you start it, it asks for an artist. Type in something you like and flame will find similar artists, that you probably also will like. You can then browse the artists in a cool 3d interface using the arrow keys. The amount of artists is limited due to performance issues. Also the images look like crap because of the original low resolution (about 160px), sorry for that.
All the data comes from last.fm, thanks! :)

When you find a cover image that seems interesting, why not listen to a song or two? Alrighty, just press the up arrow (or enter) and you’ll enter listening mode, where flame will play short samples from a couple songs. If it’s all quiet, a sample for the artist you’ve chosen doesn’t exist (yeah i know, could maybe have some indication .. but hey, the version number is 0.1.1, can’t expect miracles). There are also a couple known bugs and probably several more that i don’t know of, but i’m guessing you understand this is just an experiment.

As probably everybody who has worked with flash and external data knows crossdomain.xml is a bitch. I created a simple php script that acts as a proxy for the data, allowing flash to load the files (this means that every single image goes through my server, even if it comes from last.fm). Another pretty cool thing was the music. Last.fm doesn’t provide links to the mp3 files, so what i do is send the link to the artist’s page on last.fm to another script, which will screen scrape the page, find some stuff i need and out of it figure out what the url to the mp3 is. Works like a charm, as long as the artist has streamable music :) Big thanks to Joel Larsson for helping out with this one!

That’s about it for an introduction, go play with flame and feel free to leave a comment or two.

Oh, before you ask:
Yes, the sourcecode will be released as soon as i’ve cleaned it up a bit and tweaked a couple small things ;)

Update: the source is available here

I hope you get inspired enough to do your own cool demos with papervision3d