Blog Archives

Make No Wonder – Bugs and Sprites

My summer game project is coming along well. I’m leaving for a trip to the U.S. this week, and was hoping to post a new draft version before I left, but it looks like it will have to wait until I get back. As you can see from the screenshot above, the game has progressed a little graphically, and I’ve added a number of new types of objects, and the ability to build permanent bridges and walls. I’ve also rewritten a ton of code to make it more efficient. I’m still working with Raphael and SVG, but unfortunately I’ve run into a serious bug that affects scrolling SVG patterns in Safari. Basically, when the window scrolls, Safari does not scroll the SVG fill patterns, which makes the game sprites look completely garbled. I keep running into random bugs like this, which are made even more frustrating by the fact that not many people are using browser-based SVG, so when I do happen across a bug there is little documentation to be found and there is nothing I can do to fix it. To avoid some of these problems I am going to switch to using DOM elements like divs to create some of the sprites, instead of SVG objects. This is the technique I’ve been using for my previous games (Probable System and Favimon). Since I’ve started to use pixel art for some of the game graphics, this makes more sense anyway – the advantage of SVG is that I can easily draw and animate vector shapes, but once I start creating pixel-based artwork, divs with background patterns will work just as well. I’ll still use SVG for things like the islands, which are randomly generated, and stones placed in the water, which are animated as they sink.