Amass

The First 24 Hack

June 30th, 2007 Luke

I just finished the first 24 hack I’ve ever done.

What’s a 24 hack, you ask?

It’s pretty simple, actually. You take a project, like building a webapp or something, and give yourself 24 hours to build a working prototype with all the main features that you want.

I started at midnight on June 28th, and finished at 11:30 PM June 29th. According to my stopwatch application, the entire development process took 10:01:52, which would be worth $135.42(CDN) if I was paying myself my current wage for it.

What did I build, though?

I built a browsergame(no surprise there). It’s called “Trapper” for now(hopefully a working title), and it’s actually not ready to ‘release’, per se. Even though it’s in a good prototype stage, I didn’t spend any time securing it and it doesn’t have any content other than debug content just yet.

It’s a game based around trapping animals. Users spend their money to buy traps, and different types of traps can catch different amounts and kinds of animals. Users then set their traps, apply camouflage(if they have any - it affects how quickly the animals accumulate in the trap), and wait. When they check their traps, the time between when it was set and when it was checked is retrieved and used to determine how many of the animals the user caught. The user then receives a pelt for each animal they caught. For the moment, these pelts just get sold at the trading post, in order to make money to buy more traps. As the user catches more animals, different trading posts will become available to them based on what they’ve caught. These different posts will buy different pelts, and sell different traps and camouflage. Their prices will also vary.

This is the first project I’ve done like this. And it was fun, and now that it’s after the fact I’m looking back and going “yeah, that was really cool”. But I also learned a few things.

  • Sleep when you need to

    Originally, I had planned on finishing the entire project in 12 hours. However, at about 4:30 in the morning my coding speed was slowing significantly, and my eyelids were beginning to droop. I realized that I would be more productive if I went to sleep now, and was therefore well-rested for the next bit of coding.

  • If there are two ways to solve a problem and you only know one, use the one you know

    While having an issue with the “Set Traps” page, I asked a friend for some help. He introduced me to perl’s grep function, which solved the problem beautifully. The actual code looks like this, now:

    my @settableTraps = grep { !exists $animals{$_->{animal} } } @traps;

    Whereas it used to be an ugly nesting of foreach loops. But after solving this problem, I came upon another problem that had to do with testing whether a user fulfilled the requirements to visit a specific trading post. I tried to use grep to solve this problem, but quickly realized that I didn’t quite understand how to. I lost 3-4 hours just grappling with grep, and trying to get it to solve my problem. In the end, I just used two foreach loops. But thinking about it now, it would have been MUCH faster to have used the two foreach loops before I wasted 3 hours on grep. I could have spent the time I gained adding features or something.

  • Tools make a big difference

    I gave myself an hour to build the template for Trapper. It’s a very sparse template. But every once in a while while I was developing, I’d notice some odd irregularities. These virtually always had to do with my CSS, and Firebug helped me track down what was going wrong within a matter of seconds instead of minutes. Also, using Smultron’s stored and hotkeyed snippets, I was able to drastically reduce finger strain AND typing time.

  • Sketch it out

    While I was working on Trapper, I would occasionally come to an issue that I hadn’t thought of before I got started. Things like “how should a trading post be laid out?”. These were problems. In my case I ended up creating HTML mockups of two different ideas I had for laying it out, and just point-blank asking a friend “which one of these do you like better?”. But it would have been faster if I’d had it pre-sketched originally.

  • When in doubt, trust your gut

    No, this isn’t about what to do when you get hungry. It’s about what to do when you have a tiny issue that’s bothering you. I had this issue with some of Trapper’s templates: they bold different segments of their messages to(hopefully) draw attention to what’s going on. In some cases, there will be 3 bolded terms out of a sentence made up of 4. In those situations, I would often look at my code and go “should I adjust what’s bolded and what isn’t?”. Ultimately, these are questions that only you will be able to answer. It’s your project after all; you should be happy with how it looks in the end.

All in all, I enjoyed it. Trapper was a project I’d had on the drawing board for a long time, but just hadn’t found the time to build. Who knew that 24 hours would be enough to kickstart the process? Now that I’ve built the basics, I can move on to tweaking and customizing and polishing, and I already have the sections that I always hated building originally.

Maybe I should make all my projects into 24 hacks, at least to start.