Using Visio To Write iPhone Apps. Seriously?
I was contacted by @mysterycoconut about taking his Wednesday slot on the idevblogaday site. I learned about this site a month or so ago and thought it would be good to become a little more involved in the indie community and get the word out there about Funky Visions and our products. So thanks for having me. I’m excited to share my knowledge and experience.
I’ll do a quick intro and then get into the topic this week. I’m 45 years old. I’ve been programming since I was 12 years old on a PDP-11 my Dad built and then later an Apple ][ that we wire-wrapped (if you don't know what wire-wrapping is -- congrats on being so young!). I worked for WordPerfect for 8 years, 2 of which I spent working on the NeXT version and the tools that would later become OS X and iOS. I then spent 12 years with Compuserve/AOL mostly working in C++ and Java. Finally in January 2009 I decided to buy my first Mac (refurbished Macbook Air) and an iPod Touch and see what I could come up with. In March 2009 I released Jiggle Balls to the App Store. Since then I've released "Jiggle Balls: Spikes!" and "Tramp Stamp" and I'm currently at work on my first iPad application "Jiggle Balls HD". I've found modest success, paying off all my equipment and receiving a nice supplemental check to my day job each month. I'm really doing this for the fun of it. Once it stops being fun, I will probably quit. Is the potential for having a big hit still in the back of my mind? You bet... but it's not the driving force.
Ok... so that's me... if you're still with me... here we go...
I wrote an article a little while ago about my experiences while writing "Jiggle Balls: Spikes!". Specifically about designing the levels. I searched high and low for an editor that would fulfill my needs. Having used Visio for many years in my job, I knew that was the type of editor I needed. Objects with settable properties. I've also been unfortunate enough to have done quite a bit of xslt programming with my day job. Once I discovered Visio could save as an xsl file it all clicked that I could really use that as my editor. Save to xsl, run an xslt tranformation to get it into plist format (similar to json), and then read it in using NSDictionary.
Here's level 6 from Spikes.

It made it incredibly easy to layout the levels. It even helped with the creativity. Sometimes I'd just start with the ball and a box on the screen and the ideas would just start flowing. Notice the little box in the upper-left hand corner. That's the world properties, like gravity, time to complete level, etc. I use this to setup the world but the object is never rendered. Each of the "Jiggle Balls" (the smaller circles) has a property that tells how many to spawn (check out the game, you'll see how they explode in a circular pattern). This saved me lots of time, since I didn't have to create each individual ball. There are lots of other properties too, like bounciness, color, density, etc.
You can look at the original Visio file here. I then transformed that file using Microsoft's XML Notepad 2007. Yes... I know... too many Microsoft tools being used here, but I haven't totally migrated off of Windows yet. Here's the xsl file I used for the transformation. And the resulting plist output file.
I can then read an entire level as follows (assuming I've already read the file into mainDictionary).
NSDictionary *levelDictionary = [mainDictionary objectForKey:@"level1"];
and then traverse through all it’s settings, walls, balls, spikes, blockers, faders, and sliders (using additional NSDictionarys). For example, level 0, which is the title screen, looks like this:
level0 = {
settings = {
type = "settings";
title = "title";
background = "0";
};
wall = {
};
ball = {
};
spike = {
spike1 = {
radius = 2;
x = 0;
y = 12.5;
type = "spike";
restitution = "1.2";
};
};
blocker = {
};
fader = {
};
slider = {
};
};
Just the Spike exists on the title screen along with some settings about what background to load, etc. Take a look at level 1 (too lengthy to put inline here) for a good example of what a level would look like.
Lessons learned?
- An indie developer should use whatever tools he/she has at their disposal and they are comfortable with. Using Visio might seem archaic to some, but for me it fit the bill quite nicely and proved to be flexible and powerful enough to handle all the levels I designed.
- I really hate level design (that’s why Tramp Stamp went with the “Stay Alive As Long As You Can” ala Canabalt approach). It was fun in the beginning, but the last few were really hard to eek out. I did recently go back and create 5 additional ones with a renewed interest and freshness, so perhaps that is the approach.
I’m really enjoying iPhone development. I love being an indie. I love seeing what other indies are coming up with. It reminds me of my days back writing Apple ][ shareware. I’m excited to participate in idevblogaday.
Comments
4 Responses to “Using Visio To Write iPhone Apps. Seriously?”
Leave a Reply





Great article! I know you’re comfortable with Visio but for those other indies who are not or don’t want to pony up for a copy of Visio you could use something like Inkscape http://www.inkscape.org/ (free / cross platform open-source). It’s a vector graphics program that can save files as SVG. You can then use xslt to do the same thing.
Thanks Byron. I think I’ll look into this and get myself totally over on my Mac.
Nice Article!
I agree Inkscape will actually work great.
I like the way u did with json/plist
Any chance u code a built-in editor for the game?
Tom, I definitely will check out Inkscape. I think I remember listening to a FLOSSWeekly podcast about it.
If I go with an editor I think I’d go with an external site you design your level in and then import into your game and share with others. I just don’t think the screen is big enough to do level editing, although I’ve seen games do this pretty well.