The Internets are all atwitter about PaintCode. A new app which claims to allow you to draw shapes and graphics using their painting app and have it generate Objective-C Core Graphics code to display those same graphics in your iOS or Mac App.

Although PaintCode says that they’ll have a free demo out soon, a lot of indie developers like me are hesitant to invest $80 in a tool sight unseen. We all have been burned too often by magic code generating tools that were supposed to make our jobs SO much easier, but in the end, just hurt us by generating unmaintainable code that we didn’t understand. That said, I, being the selfless fellow that I am, decided to take one for the team, bought it, and well… here we are.

It should be noted that this is not the first app of it’s kind. Opacity by Like Thought can also, reportedly, generate Core Graphics code from drawings you do in it. I downloaded Opacity when I downloaded PaintCode, just so that I could be fair and balanced. I’m not going to focus too much on Opacity. They have a free demo, you can download it for yourself. However, in cases where I think a useful comparison should be made, I will do so.

First up… does it work?

Yep, it sure does. Its pretty damn cool.

You draw stuff in the window, and the code to draw that in Core Graphics appears in another panel below it. I really like this model. I like it because I can just cut and paste this into my source code. I’m not generating a whole file, I just want the tiny code snippet that will draw the specific thing that I want to draw right now. It is simple, and does this one thing well, and from that perspective, I’d say the app is a success.

But the code… is it good?

Well, the code is decent. It’s generated, so it’s not hand optimized for your use case. You’ll want to edit it when you put it into your source. This is to be expected.

It does not optimize for multiple identical objects, meaning it doesn’t generate loops, or functions, or anything fancy like that whatsoever, it just generates the bare minimum basic Core Graphics drawing code you need to draw whatever it is you um… drew on the canvas.

This might actually present a problem for using this long term since the code you actually use from it will be different from the code it generates (because you will edit it). I’d argue, however, that this is simply an unreasonable expectation. The purpose of this app is to make code snippets that you will use in your app, not to generate your app.

With regard to the code itself, well, again, it’s basic. I was a bit surprised, for example, that the code didn’t seem to use CALayer attributes very much, like for example to draw shadows. This isn’t a huge deal, this is one of those things I’d do, but others might choose differently. There might be some technical reason for the style of code they generated and the API they used, but if there is, I don’t know what it is.

@schwa asked on Twitter:

If the code generated isn’t template based then there’s no fixing of bugs in it.

and the answer is, no, the code is not template based, nor does it appear that there are any preferences that would enable you to modify the code generated. This might be an issue for you if you’re expecting to be regenerating the code from the app and putting it in your app over and over.

I would say that the ability to customize the code output (via templates or preferences) is one of the biggest areas that PaintCode could improve, but it’s not a show stopper for me. I understand the limitations, and would rather have a tool like PaintCode in it’s current form without the code generation customization, than not have it at all.

A side note here is that PaintCode should not be used as a crutch. You need to understand the code it is generating. If you do not, I would actually advise not buying it. Go write some hand crafted Core Graphics code for a year or so, THEN come back and use PaintCode to help make your workflow a little faster and easier.

Can I use it to build my GUI and make it all resolution independent and stuff?

No, I wouldn’t do that. The developers (Pixel Cut) seem to imply that PaintCode will free you from the tyranny of image based GUI design and make your apps resolution independent! (My words, not theirs) This might be true if you designed all your icons and graphics using it, and then generated modules directly into your source folder and were used in your project.

The problem is, because of the lack of customization of the code generation, this kind of app will not be something you will use to regenerate your graphics repeatedly. You’ll use it once, to get a basis for hand optimized CG code, and then you may return later and use it again, but then you’ll need to hand optimize it again. That’s a bit of a pain.

If your requirements are simple, this model works… if you are generating your whole UI this way, it does not.

I would argue that PaintCode stands on it’s own without this capability. Honestly, I don’t think it’s possible to make an app that would generate perfect customizable drawing code even using templates. I think this is an impossible problem to solve, and I kinda hope that Pixel Cut doesn’t try too hard at it. Improve the code generation customization options… sure… but you’re never gonna get it perfect, and you’re never gonna satisfy everyone. When you can do that, we won’t need programmers anymore.

Are it’s graphics tools good? Is it really a painting app?

It’s tools are decent, but not great. Very much a 1.0 feature set. A solid 1.0 feature set, but a 1.0 nonetheless. It does not have layers, or grouping of objects, but it does have bezier curves, rounded rects, and interestingly, the ability to join and split objects, which is something I never would have expected in a 1.0. It has gradients, and shadows and inner shadows and things, all the basic tools… but it won’t replace Photoshop or Illustrator any time soon.

All that said, Opacity has a much wider selection of tools and is clearly a much more graphic tool intensive app, but I’ll be honest… I fired up Opacity, and there was SO MUCH STUFF that I actually didn’t even know where to start. PaintCode, on the other hand, was up and running and was able to generate some basic CG code in minutes.

The interesting dichotomy here is that PaintCode has no help file, no instructions, no preferences, nothing. It’s so simplistic, that my first impression was that it’s simplicity was an indication that it wasn’t worth it’s price. Opacity, on the other hand, has help, and tutorials, and videos, and goodness knows what else. All that and, for me, PaintCode was usable, and Opacity was not.

FWIW: I actually still haven’t figured out how to generate CG code from Opacity. I’m told it’s in there, but I can’t find it.

Can I import or export graphics files?

No, basically, you cannot. It does support exporting PDF or NeXT TIFF files, but as pointed out on Twitter, import/export of svg files would make it a much more useful app. Designers like their existing apps, and if PaintCode wants to play in this space, I think it needs to be better about interoperability. This is definitely a minus.

Interestingly, it might also be fun to be able to paste Core Graphics code into PaintCode and have it draw the result on screen, be able to modify it and have the code change according to the modifications! That would be fun. For now, however, the code panel is read-only.

So, to sum up…

It’s a good app that does one simple thing well, and for that one simple thing, IMO, it’s worth $80, yes.

As Brian Webster pointed out if it saves $80 worth of your hourly wage, then it’s worth it, and for me, I think it will.

I can easily see spending an hour crafting CG code that I could draw up in PaintCode in 5 minutes. Would I return to it later to tweak that code? No. But I’d still have gotten my money’s worth out of it.

Compared to Opacity… well, I wanted to love Opacity… I originally looked at Opacity more than a year ago, for exactly the use case I want PaintCode for. Then, as now, I just couldn’t figure it out. I couldn’t really determine if it’d let me generate the code I wanted, and even if it could… it actually seemed like it would be more effort to design the graphics in Opacity than to just write the Core Graphics code by hand. It seems as if Opacity is a so-so drawing app with the ability to generate Core Graphics code tacked on somewhere.

PaintCode is the opposite. It’s a focused programming aide and a welcome additional tool in my arsenal.

Update

I left off a sample of the code it generates. Here’s the code it generated from the screenshot above.

Update 04/04/2012

They now have a free trial. Go check it out!

This entry was posted on Thursday, March 15th, 2012 at 3:30 pm and is filed under Cocoa, CocoaTouch, iOS, Objective-C. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.