Jumbler, my first flash game

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.

The viral spread of my privacy check app for Facebook

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

They’re baaack! Revenge of the blobs

Well they’re back., those supposed slime moulds that have previously turned up on my lawn. This year they seem a bit more widespread. They are just so weird I had to take some more pictures:

For reference they are about 7cm to 15cm in diameter. I still not convinced that they slime moulds as they don’t appear to match any picture of a slime mould that I have found on the web…

New theme is a go

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 :)

Odd attractions

I found these fantastic flyers in my hotel lobby this morning.

Alarmingly the Amish Attractions seems to simply consist only of quilts.

The Castle Winery however, sounds pretty impressive with its authentic 12th century, 121000 square foot Tuscan castle consisting of 107 rooms, 8000 tons of hand squared stones, 8 levels (with 4 below ground), 900 feet of caves,  a moat, dungeon, a torture chamber, a consecrated chapel and a hand-painted grand hall. Not quite sure how they can claim that the castle is authentic since its sitting in California and built in the 90s.

YouTube drops IE6 support

Earlier this week YouTube officially dropped support for older browsers such as Internet Explorer 6. If you try access YouTube with IE6 you get this nice warning message:

The order of the browsers appears to be random, refreshing on each load. Hopefully they used a better random algorithm then Microsoft recently used for their EU browser choice site.

I’m really hoping that this trend will be followed by more mainstream sites and we will finally, finally see the death of IE6 which still holds around about a 20% market share!

And if you are still running IE6 (I’m looking at you big New Zealand corporates),  a quick read of the “Operation Aurora” attacks on Google and other big US companies should be enough to scare you into upgrading ASAP.

Death to IE6!!!

Google’s timetable for dropping IE6

I received the following email from Google yesterday. It details their timetable for dropping IE6 support:

_Dear Google Apps admin,

In order to continue to improve our products and deliver more sophisticated features and performance, we are harnessing some of the latest improvements in web browser technology.  This includes faster JavaScript processing and new standards like HTML5.  As a result, over the course of 2010, we will be phasing out support for Microsoft Internet Explorer 6.0 as well as other older browsers that are not supported by their own manufacturers.

We plan to begin phasing out support of these older browsers on the Google Docs suite and the Google Sites editor on March 1, 2010.  After that point, certain functionality within these applications may have higher latency and may not work correctly in these older browsers. Later in 2010, we will start to phase out support for these browsers for Google Mail and Google Calendar.

Google Apps will continue to support Internet Explorer 7.0 and above, Firefox 3.0 and above, Google Chrome 4.0 and above, and Safari 3.0 and above.

Starting this week, users on these older browsers will see a message in Google Docs and the Google Sites editor explaining this change and asking them to upgrade their browser.  We will also alert you again closer to March 1 to remind you of this change.

In 2009, the Google Apps team delivered more than 100 improvements to enhance your product experience.  We are aiming to beat that in 2010 and continue to deliver the best and most innovative collaboration products for businesses.

Thank you for your continued support!

Sincerely,

The Google Apps team

Paper ship markers for Rogue Trader

I've just started GMing the Rogue Trader game (from Fantasy Flight Games) with my regular gaming group and I realised, I needed some way of tracking ships.

Now ideally I'd love to have some Battlefleet Gothic models out on the table but apart from the expense, I do not want to freak out the newbie (and female) players in the group by plonking down some "toy" spaceships.

So I went in search of some paper markers that I could print out and use. Alas I did not find any,  so I decided to whip some up for myself…

And so I present Rabidgremlin's Tactical Ship Markers. These markers are designed to be printed, cut out, folded and glued together. They come in 3 handy colours: red for enemy ships, blue for neutral and green for friendly.

I got a little carried away and even made them 3D (and perhaps in doing so, have risen to new levels of nerdom).

Here is a pic of an assembled marker.

And here is the PDF of the markers, that you can download and print out: Tactical-Ship-Markers-Coloured-v0.1.pdf

I used standard office 80g paper and they work ok but you might want to use something stiffer.

For those of you who are interested, I used Inkscape to create the markers. Inkscape is a fantastic, open source, vector graphics editor.

Tip: Creating easy to remember passwords

Passwords are a pain in the butt, if you use a computer or the Internet then you no doubt have a list of passwords bouncing around in your skull or worse yet a single password that you use everywhere! Here is a simple technique for creating good, easy to remember passwords.

Password inputFirst off here are some golden rules for passwords:

  1. A password needs to be strong (see below)
  2. You should only use a password for one site or account
  3. You should never write a password down
  4. You should never tell anyone else your password (duh)

Of course all of us break these rules…

So what is a good password? A good password is one that is “strong” from a security point of view. Typically this means a string of 8 characters made up of numbers and letters. Additionally the password should not contain any “dictionary” words (e.g. a word you find in the dictionary) nor should it contain information relating to you, such as your name or date of birth.

On top of that, your password should not be a common one. Believe it or not, people tend to think just like you and so there is a whole raft of passwords that people tend to use such as qwerty, 7777777, bond007, butthead, trustno1. This list (from Twitter’s sign-up) page contains 370 common passwords which Twitter does not allow to be used. Needless to say, if one of your passwords is on this list then you should probably not use it :)

Here are 10 “strong” passwords generated using the excellent from pctools.com password generator.

ne3hebr4 fe5ec7ur
th55ucep 2rayaves
24astete 8hacruth
fathu4e7 5rubrast
tebra2ep 4awraph4

Now these passwords are all well and good but you are not likely to memorise them are you? Which means you will either write them down or you will just memorise one, which you would use everywhere. Once again breaking the rules.

So here is better way, which not only generates strong passwords, unique to each website but also makes them easy to remember !

First off choose 4 characters, a mix of letters and numbers (ideally more numbers then letters). These 4 characters are the only thing you will need to remember. For instance r085, which I will use in the examples below.

Next up, when you need a password for a website, take the first 4 characters of the website’s domain name and alternate them with the characters in your secret 4 character string, for example:

facebook.com:
                f a c e
                   +      = fra0c8e5
                 r 0 8 5 

twitter.com     t w i t
                   +       = trw0i8t5
                 r 0 8 5 

gmail.com       g m a i
                   +       = grm0a8i5
                 r 0 8 5 

digg.com        d i g g
                   +       = dri0g8g5
                 r 0 8 5

And voila you get nice strong passwords, unique to every site !

Configuring a test SSL certificate for Jboss

I just had to set up a test certificate for my local install of Jboss 4.2.3 to try out some SSL code. It wasn’t completely obvious so here are some notes on how to do it.

First off you need to create a self-signed certificate. You do this using the keytools application that comes with Java. Open a command prompt and run the following command. You will need to change the path to your Jboss conf directory to reflect your install:

C:\>keytool -genkey -alias tomcat -keyalg RSA -keystore C:\jboss-4.2.3.GA\server\default\conf\localhost.keystore

When prompted use a password of changeit everywhere. It’s important that you answer localhost to the first question:

Enter keystore password: changeit
Re-enter new password: changeit
What is your first and last name?

What is the name of your organizational unit?
  [Unknown]:
What is the name of your organization?
  [Unknown]:
What is the name of your City or Locality?
  [Unknown]:
What is the name of your State or Province?
  [Unknown]:
What is the two-letter country code for this unit?

Is CN=localhost, OU=Unknown, O=Unknown, L=Unknown, ST=Unknown, C=NZ correct?


Enter key password for
        (RETURN if same as keystore password): changeit
Re-enter new password: changeit

Next up you need to configure tomcat to create a SSL connector.

Edit C:\jboss-4.2.3.GA\server\default\deploy\jboss-web.deployer\server.xml and find the commented out SSL connector example, uncomment it and tweak it as follows:

<Connector port="8443" protocol="HTTP/1.1" SSLEnabled="true"
maxThreads="150" scheme="https" secure="true"
clientAuth="false" sslProtocol="TLS"
keystoreFile="${jboss.server.home.dir}/conf/localhost.keystore"
keystorePass="changeit"
/>

Finally add two System properties to your Jboss startup command to get the javax.net.ssl library to use your new keystore. These are only needed if you need to make SSL calls back to yourself. I needed them because I had CAS and 3 apps authenticating with CAS all running in the same dev Jboss instance:

-Djavax.net.ssl.trustStore=C:\jboss-4.2.3.GA\server\default\conf\localhost.keystore
-Djavax.net.ssl.trustStorePassword=changeit

Ok now browse to http://localhost:8443/

Your browser will complain about a self-signed certificate. Just follow your browser’s instructions to add this certificate as a security exception so you won’t be prompted again and you are all done.