PaintCode 2.0 review: Helps developers and designers create great user interfaces

paintcode icon
At a Glance
  • PixelCut PaintCode 2

    Macworld Rating

    Paint Code 2 is a valuable tool for converting vector images into source code for your software.

It’s been a little over two years since I last reviewed PixelCut’s $100 PaintCode, a Mac app designed to help developers more easily integrate vector graphics into their software.

In the intervening years, Apple’s own operating systems have evolved beyond pixel perfection to embrace vector graphics as an easier way of dealing with the many form factors that the company’s devices offer today. As a result, instead of producing individual bitmaps for each possible resolution at which their apps will be used, developers can today simply import PDF files directly into their source code, and let the operating system take care of rasterizing and rendering them on the screen.

These changes have certainly vindicated PixelCut’s bet on bringing developers better tools for dealing with vector graphics, but the company hasn’t been sitting idle either, and, as a result, PaintCode 2 (App Store link) hit the App Store earlier this year.

paintcode 2

Like its predecessor, PaintCode 2's main function is turning vector images into code—but with a cleaner and more streamlined interface.

What’s new

PixelCut sells PaintCode 2 as a completely separate product from its predecessor. This means that, if you own a copy of the latter, there is no upgrade path that will let you acquire the new edition of the app at a discounted price; on the plus side, support for Photoshop’s PSD files, which used to require an in-app purchase, is now included in the base version of the app, and special pricing is available for both academic and business users.

Like before, PaintCode’s main function is that of converting a vector image into source code that can be used to render it when your software runs. The app can produce code in Objective-C, C# for use with Xamarin, and, for the first time, in Swift, Apple’s newest programming language.

Because it transforms images into instructions, PaintCode allows you parametrize pretty much every aspect of the drawing algorithm. For example, you can decide to change colors, strokes, and fill patterns at runtime, making it easy to apply themes to your graphics without having to keep multiple copies of each asset.

What’s better

The new version takes this concept even further: You can now parametrize features like angles and dimensions, and then establish relationships between them that are automatically handled by PaintCode’s code generator at runtime.

This makes it much easier to control complex animations that depend on the interaction between multiple parts of an image: Instead of worrying about how every little shape needs to change, you can create higher-order parameters that control the animation’s logical layout. For example, if you wanted to have a series of gears move, you could introduce a single parameter to control the rate of rotation, and use PaintCode to determine how each gear interacts with the others.

These concepts will feel entirely familiar to artists who have experience using animation software, while the code that the app generates can be immediately used by a programmer. This is, in a nutshell, what makes PaintCode great: It allows designers and developers to focus on their respective strengths when creating an immersive and interactive user experience.

To this end, I feel that PixelCut has done an excellent job of smoothing out many of the rough edges that affected the image editor in the old version of the app. The new release features a much more streamlined interface, more powerful tooling, and a generally more responsive controls. It also seems less crash-prone—not a huge problem before, but certainly one that I don’t mind seeing taken care of.


PaintCode makes it easy to parametrize every last aspect of an image, from colors to complex animation interactions.

What's great

Two new features of PaintCode 2 deserve special mention. The first is something that PixelCut, borrowing a little from Apple’s own nomenclature for developer products, calls StyleKit.

A StyleKit essentially collects multiple images under a single roof, giving developers a single set of instructions that offer a unified interface for every rendering parameter in the form of class variables, making it easier to import and reuse every design element at runtime. This addresses one of the major complaints that I had with the old PaintCode, and definitely makes sense (at least from the point of view of a developer).

The second feature is a special plugin that makes PaintCode compatible with Facebook’s Origami, a system that the social media giant has built to help developers and designer work together to build complex interactive animations.

The plugin allows you to import a PaintCode project right into Origami, and then wire it up into a larger interface component to create the kind of exciting experience that users have come to expect—without, of course, having to worry about coding every single iteration of your work by hand.

Bottom line

I really can’t find anything bad to say about PaintCode. The developers have honed in on a tool that hits all the right notes for its function. Instead of adding features just for the sake of having more functionality, they have applied a laser focus to their core product, and come up with something that feels considerably more useful than its predecessor.

The app’s pricing reflects both its niche nature and complexity. Like I said in my previous review, if you truly need PaintCode, you will be able to recoup the $100 it will cost you in a matter of minutes—and gain much more in terms of value from its use than you would by creating your animations and user interactions by hand.

This story, "PaintCode 2.0 review: Helps developers and designers create great user interfaces" was originally published by Macworld.

At a Glance
  • Macworld Rating

    Paint Code 2 is a valuable tool for converting vector images into source code for your software.


    • Easier to control complex animations
    • Streamlined, more responsive interface
    • StyleKit makes it easier to import and reuse design elements at runtime
    • Plugin provide compatibility with Facebook’s Origami


    • None significant