Rabidgremlin's
Soapbox

Over the weekend I published my first flash game, it’s called Jumbler. There is not too much to the game, to be honest. It was really more the result of me tinkering with the Flixel game framework to see what it could do; rather then my idea of a “blow your mind, addictive game”.

I’m must say that I’m pretty impressed with Flixel. Jumbler took less then 10 hours to put together and the bulk of the time was spent on the theme and graphics (such as they are). The initial game code (with box only graphics) took only about 3 hours.

The other cool thing was that this was built with entirely free tools and assets:

• Flixel – is a really great AS3 game framework. It does a fantastic job of turning flash into a game engine and letting you focus on writing a game, not on fighting with Flash.
• Flex SDK – The flash compiler and tools given away by Adobe.
• Flashdevelop – An open source Flash IDE. Syntax completion is a dream.
• Inkscape – An open source vector editor kinda of like Illustrator. It uses SVG as its native format and has excellent .png export support. All the graphics in Jumbler are drawn with Inkscape which made it really easy to resize, edit and evolve them on the fly.
• Flash Kit – Excellent resource for free sound effects.
• dafont.com – Excellent resource for free fonts. This is where I found the Boingo font that I used to drive the look of jumbler.

If you are interested in getting started with Flixel, then check out these links. The first is a basic “Hello World” tutorial, which shows you how to get your environment set-up and write a simple Flixel app. The second shows you all the key concepts you need to understand to build a game in Flixel, by creating a simple Defender style game.

I’m thinking of porting my half-finished “nac” game over to Flixel and integrating Box2D for the physics. It should be interesting.

Last week, interested by the noise on the interwebs about Facebook and privacy, I put together a small app using Facebook’s API that shows exactly what information you are giving away to Facebook enabled sites.

Thinking that others might be interested, I tweeted a link  and shared the app with my friends in Facebook. Now I don’t have a large social network about 220 followers on Twitter and 125 friends on Facebook, but the “like” counter for the app quickly started to grow first 10, then 20 and after a day close to 100!

A couple of days later, somewhat ashamed by how ugly the app looked, I did some work to pretty it up and I added a “privacy score”. I then retweeted the link, did a Facebook status update and went to bed.

The next morning (17 May), I was very surprised to see that I now had 200 “likes” and over 1500 page views. Over the next few days things started to  grow rapidly. I watched anxiously, concerned that my tiny little web server was going to explode…

I also started to wonder how people were actually out finding the the app. Here is what I can surmise from looking at my site logs and analytics.

Page hits and visitors

First off here are the graphs showing the page hits (dark blue) and unique visits (light blue)  per day:

As you can see the app was at peak usage on the 18th May. To date the app has had 1936 “likes” and 28845 page views.

Where did all the traffic come from?

The bulk of the traffic (64.55%) came from referring sites, 34.05% came from direct traffic and a measly 1.4% of the traffic was from search engines.

Of course a large percentage of the referring traffic was from Facebook, as my app allowed people to post their “privacy score” for all their friends to see. The post included a handy link back to my app so that others could then easily check their score.

A total of 11.8% of the total visitors to the app came from Facebook. The other referring traffic was from the large number of blogs and websites that posted articles about the Facbook Privacy issue with links back to my app. In fact there were over 100 sites that did link back to the app which is pretty staggering. See the end of this post for a list of some of them.

The direct traffic figure of 34.05% is interesting as it is highly unlikely that anyone was typing the URL to the app (http://www.rabidgremlin.com/fbprivacy) directly into their browser. I can only guess that that these visits must have come from people clicking links in various (non-browser based) twitter, RSS feed and (perhaps) mail clients.

Looking at the data I would suggest that over 45% of the total traffic could be attributed to social networking ! (the 11.8% from Facebook and the 34.05% direct traffic).

Riding the hype curve

I suspect that the primary reason that the app became so popular so quickly was it appeared right when there was the most Internet buzz about Facebook privacy.You can clearly see the strong build up and the equally sharp drop off in traffic as the Internet became enamoured with some other topic.

Did I WIN?

Now if my app was a commercial product then I would say NO. Around about the same time as my app went live so did several others such as: youropenbook.org, reclaimprivacy.org and Saveface.

I would say that reclaimprivacy.org would be a direct “competitor”. If you take a look at their site they have over  238000 shares and over $3000 in donations. So around 12100% more shares/likes and roughly 60000% more in donations!  BTW I must give a shout-out to Brian for his donation (and yes it is enough to buy a beer in New Zealand, thanks).

Clearly reclaimprivacy.org would be destroying me if we were competing businesses :)

So why did they do so much better?

I don’t believe that it is the “product”, several sites have mentioned that my app provides the most in-depth information.

I could see that perhaps it is because their app looks better but no one mentioned that my app was ugly or unusable.

I suspect that the answer is that of trust, reclaimprivacy.org has a nice domain name, the author released the source code and perhaps more importantly the author (Matt Pizzimenti) is readily identifiable. On the other hand, rabidgremlin.com sounds a bit suspect and I go out of my way to keep my identity secret (not that it would be hard to figure out who I am).

My suspicion is borne out by some of the descriptions of my app, such as this one:

The application is built by rabidgremlin, who doesn’t tell us anything about himself (I’m making an assumption here) and claims New Zealand as his home on his Twitter page. Can you trust the site?

I guess I’ll need to take this into account for future projects :)

Sources of traffic

The following list shows some the sources of traffic to my app:

http://sikkerhed.tdc.dk/publish.php?id=24892

http://youropenbook.org/about.html

http://www.f-secure.com/weblog/archives/00001952.h

http://www.net-security.org/article.php?id=1439

http://www.hwsw.hu/hirek/44627/facebook-adatvedele

http://www.infospyware.com/blog/facebook-privacy-c

http://news.ycombinator.com/item?id=1346003

http://webisztan.blog.hu/2010/05/17/teszteld_hogy_

http://www.simplyzesty.com/facebook/tool-lets-chec

http://themoderatevoice.com/73103/concerned-about-

http://www.guardian.co.uk/technology/blog/2010/may

http://bagtheweb.com/oembed/proxy/IBB2DI

http://www.taringa.net/posts/info/5534654/Facebook

http://37signals.com/svn/posts/2330-diasporas-curs

http://index.hu/tech/2010/05/21/kivonulas_a_facebo

http://www.informacija.rs/Vesti/Privacy-Check-apli

http://news.ycombinator.com/item?id=1354731

http://slo-tech.com/novice/t416348

http://flipthemedia.com/index.php/2010/05/facebook

http://wiredpen.com/2010/05/18/facebook-and-privac

http://www.cnis-mag.com/quand-les-navigateurs-parl

http://www.reddit.com/r/technology/comments/c3jyi/

http://caballe.cat/wp/eina-que-calcula-el-nivell-d

http://www.reddit.com/r/reddit.com/comments/c557m/

http://www.facebook.com/notes/f-secure-labs/facebo

http://www.cnis-mag.com/4456.html

http://www.taringa.net/posts/info/5515348/Facebook

http://taringa.net/posts/info/5534654/Facebook-Pri

http://twitter.com/mikebutcher

http://www.wir-muessen-twittern.de/blog/2010/05/18

http://www.techsupportalert.com/content/probably-b

http://www.matuk.com/forosmatuk/vida-digital/priva

http://livingwithoutfacebook.com/

http://giovannidepaola.nova100.ilsole24ore.com/201

http://blog.f-secure.jp/archives/50403236.html

http://youropenbook.org/about

http://socialbits.net/blog/facebook-and-privacy-to

http://www.lemagit.fr/article/google-france-facebo

http://news.ycombinator.com/item?id=1347982

http://www.websegura.net/2010/05/teste-a-sua-priva

http://www.plurk.com/bikerock

http://www.lemagit.fr/article/google-france-facebo

http://www.softcatala.org/planeta/

http://www.islamicaweb.com/forums/science-technolo

http://vulps.forumotion.com/discussion-f4/oo-er-so

http://twitter.com/theharmonyguy

http://twitter.com/harryadams

http://maketecheasier.com/4-tools-to-unscramble-yo

Well, it has been a while since I posted something meaty, I’ve been kinda doing a lot of micro-blogging and tinkering with other things like my Privacy Check for Facebook, so haven’t really had time to sit down and write a decent post.

Of course as soon as I did sit down to write something, I got hideously distracted with the idea of creating a new theme for my blog…

Luckily due to some very handy tools, it did not take nearly as long to finish off my new theme as it could have.

First up Blueprint CSS, this is a fantastic CSS framework. I used it for contactprotocol.org and for my Privacy Check for Facebook app so it was a no brainer to use for the theme. If you are not a hard-core webcoder then this is the easiest way to put together a good looking website that just works.

Next up: jQuery, which, is a fantastic Javascript framework. I’m really getting to grips with it and there is no way I would ever build another site without using a Javascript framework of some kind.

For instance I have a lot of code examples on the blog. These I  format into

 blocks so that they are easier to read. Problem is that they are often very wide and would get cut off with this new theme. A bit of digging around on the web and little bit of Javascript and we have the following; a code block that expands when you hover the mouse over the it. Here is an example (and the actually code):


//this code finds all pre tags and makes them expand on hover
//code has been formatted to be extra wide to demonstrate the effect
$('div.entry').find('pre').wrapInner('').hover(function()
                                               {
                                                 var contentwidth = $(this).contents().width();
                                                 var blockwidth = $(this).width();
                                                 if(contentwidth > blockwidth)
                                                 {
                                                   $(this).animate({ width: '950px'}, 250);
                                                 }
                                               }, function()
                                                  {
                                                  $(this).animate({ width: '640px' }, 250);
                                                  });


I also used Fancybox to create a lightbox effect for images and image galleries. For example try clicking on one of  the images below:


  

    

      
    
  
  
  

    

      
    
  
  
  



Lastly I used the new Google Font API (that was released this week) to embed the cool font I used for the blog & post titles in a cross browser compatible way. The font is Reenie Beanie by James Grieshaber.

So what do you think? Leave a comment :)

    

ClearPoint held one of its regular tech-drop get-togethers last night covering Google Wave.

The Cloudbreak team gave a good walk-through of the product  and I gave a quick overview of some of the technology inside Google Wave and it’s APIs.

Here is my slide deck:

The PDF (with notes) can be downloaded here.

For those of you who know nothing about the wave, here is short intro video:

Wow, I have just announced the launch of my pet project: split-the-bill.com I’m feeling  excited yet panicked at the same time.

It will be very interesting to see how this pans out (hopefully well). For more details check out http://blog.split-the-bill.com/the-cat-is-out-of-the-bag-2

Finally got off my butt and packaged up version 1.0.0 of SvnViz. It can be downloaded from sourceforge.

SvnViz builds visualizations of the activity within a Subversion repository. Here is an example of the default visualization run against the project that I am currently working on. Green dots indicate file adds, blue dots are modified files and red dots are deleted files. The greater the activity of the user the higher their score.

SvnViz also provides a framework for creating your own visualizations. Simply extend the FrameViz class and implement the generateFrame method. To run your vizualization class, instead of the default class, just pass the fully qualified name of your class to the application using the -vc parameter.

Source files can be downloaded from here. All code is released under the GPL.

Have fun and drop me a line if you come up with an interesting visualization.

This is actually more of a note for myself but it may be of use to you. I often find myself running up Linux VMs to test and build LAMP based systems but since I (generally) use Windows it is a major pain to have to transfer files via scp or worse edit files using vi.

However is you install Samba into your test VM, you can simply browse to the folder using Windows explorer and edit the files directly. The following configuration exposes your /var/www folder via Samba and makes its content editable by everyone. It makes the files read/writeable by all and makes sure that www-data remains the owner.

Needless to say this configuration is very very insecure and MUST NOT be used in production !

`This is actually more of a note for myself but it may be of use to you. I often find myself running up Linux VMs to test and build LAMP based systems but since I (generally) use Windows it is a major pain to have to transfer files via scp or worse edit files using vi.

However is you install Samba into your test VM, you can simply browse to the folder using Windows explorer and edit the files directly. The following configuration exposes your /var/www folder via Samba and makes its content editable by everyone. It makes the files read/writeable by all and makes sure that www-data remains the owner.

Needless to say this configuration is very very insecure and MUST NOT be used in production !

`

_Update: The latest images from Microsoft now ONLY work under MS Virtual PC ! Not so useful if you are a Mac developer or you want to run under VMware like we are. Microsoft is aware of the problem, hopefully they fix it soon.

_

I’ve been setting up a bunch of VMware images for testing various browser and OS combinations. This has worked out very nicely and the best thing is you can do it all for free !

In my travels I came across these very useful images from Microsoft, basically XP and Vista installs with various flavours of Internet Explorer ( 6, 7 and 8 ) installed.

These are free for download (but they do expire) and can be easily run using Microsoft’s free Virtual PC.

To get these images to run under VMware, you first need to set up the images to run under Virtual PC (to create a .vmc file) and then you can converted the images to the VMware format using the VMware vCenter Converter. This tool is also free.

The VMware Converter is also able to create an image of your locally installed OS, I haven’t tried this but it could be useful for backups and the like.

All up its taken about 2 days to set up XP, Vista & Ubuntu images running combinations of IE 6, IE 7, IE 8, Firefox 3, Opera 9, Safari 4 and Chrome.

Now the fun really starts….

Last week I released by first Android application on the Android Market. It is called ScanPaste. The application lets you scan barcodes and then  copy the scanned data to the phone’s clipboard for pasting into web pages, emails etc.

I had been looking for a simple app to build, to test out the end to end Android Market publishing process and when I saw this blog post by about populating your Google books list using barcodes scanned with a USB scanner, I figured why not build an Android app to do it.

Now scanning barcodes with a phone’s camera is not that simple but luckily someone else has done all the hard work. The ZXing team have released an excellent barcode scanning application and library. Even better, using a cool feature of Android, integrating barcode scanning into ScanPaste was only a few lines of code!

In an Android application each screen is broken down into it’s own little task called an Activity. If an Activity is correctly “marked” it can be initiated not only by the application owning the Activity but by other applications. This is what the nice guys on the ZXing team have done and with their application installed, any other application can simply use the following code to scan and process barcodes:

...
// start the scan
Intent intent = new Intent("com.google.zxing.client.android.SCAN");
startActivityForResult(intent, 0);
...
public void onActivityResult(int requestCode, int resultCode, Intent data)
{
  if (resultCode == Activity.RESULT_OK && requestCode == 0)
  {
    Bundle extras = data.getExtras();
    String result = extras.getString("SCAN_RESULT");
    // do stuff with result here
  }
}

The rest of the app is pretty straightforward, a couple of buttons, a text field and some error checking. All up the application is less than 100 lines of code.

In all it took a few hours to put together and test. The bulk of the time was actually spent working on the icon :) The 1.5 Android platform has some pretty clear guidelines and I was trying to adher to them.

Building a signed app for upload to the Market was a snap, just a menu click and a step by step wizard. Actually publishing the application was as simple as uploading the signed .apk file, filling in a form and clicking on upload. Couldn’t be simpler especially when you compare it to the nightmare process of uploading an iPhone app to the iPhone App store and of course the Android Market doesn’t have a vetting process so as soon as the upload was complete the application could be downloaded by anyone.

One of the things that took me by surprise was that within half an hour the application had been downloaded 20 times. A week later it has been downloaded 1849 times and it has 1156 active installs! It also has a 4 ¹⁄₂ star rating and all positive comments. From the comments it seems that many people are using the app to scan the barcodes of books that they are selling on Amazon.

Ok the bad stuff….

Firstly, a minor one,  in the developer console of the Market there is no way to see the comments about your application. You can see the rating and the number of ratings but that is it. Instead you need to look up the app in the Market application on your phone or view a 3rd party site like Cyrket (which apparently uses the Market’s own APIs so why the info cannot be surfaced in the developer console is beyond me).

Now for the killer…since I am in New Zealand I cannot sell any Android applications! I need to be in the US, UK or one of a couple of other countries to be able to sign up as merchant. What the heck is up with that? I see that as a major shortcoming of the Android platform and one that Google needs to rectify ASAP.

Hopefully with the imminent launch of the HTC Magic here in New Zealand this will change. Lets wait and see….

_[Update]: I have created contactprotocol.org which now holds the draft specifications._

About ten years ago I had a couple of interesting ideas but due to sheer laziness on my part I never did anything with them.

One of these ideas however keeps popping back into my head and so finally I’ve decided to do something about it.

The original idea is very very simple: wouldn’t be nice to have a URL that points to information about you ? You could give this URL to people and they would always be able to find you.

Now of course it’s 2009 and the idea is slightly more refined and so I give to you: the “Contact Protocol”… It works as follows:

1. you give out a Contact URL which looks something like contact://host.com/xyz . This URL can be put on business cards, email footers, websites etc
2. the URL can then be used to retrieve your up-to-date contact details. If your details change you simply update them in one place and anyone who has your Contact URL can retrieve them.

Now obviously you would be able to type the URL into a web browser to lookup someone’s details but that is only one use.

How about an email client ? Just add the Contact URL for someone into your address book and voilà your email client will always have right email address for them.

What about your mobile phone ? Add a contact URL for a contact and the device can use it to figure out which phone number to use when you call them.

Instant messaging, same deal…

Pretty nice… at least I think so.

So what the heck is an RFC and how does it fit in with your crazy idea I hear you ask ?

Well I want the Contact Protocol to be widely used and the easiest way to do this is to make it a standard. On the Internet standards are defined in request for comments or RFCs. This practice has been in place since the Internet was born.

The RFC process is looked after by the IETF (Internet Enginnering Task Force) and most RFCs are written by this group but anyone can write one and submit it for consideration so this is what I have started to do.

It is however not entirely straightforward, RFCs have specific format, language, style and content requirements. Check out the RFC style guide (formatted as an RFC itself). Luckily the IETF have provided the xml2rfc tool which takes an xml file and generates a correctly formatted RFC, this makes things much simpler.

So I’m currently enthusiastically hacking away on my xml file, I’ll let you know when I have something to look at.