PaintCode
Latest
DevJuice: Reveal enables you to inspect, modify and debug iOS apps
Reveal, now in public beta, was originally created to enable its developers to debug client applications. Over time, they found that the tool became so useful on its own that it deserved to be productized. Developer Sean Woodhouse tells TUAW, "We built Reveal to help us debug applications for our clients. The applications we build, particularly for iPad, can have extremely complicated view structures, and Reveal's ability to isolate and focus on a subset of the view hierarchy has been critical to manage that complexity. The ability to change view properties also lets us test simple visual changes without recompiling." If you're thinking that Reveal sounds a lot like Spark Inspector, which I recently wrote about, you're right. Reveal covers much of the same ground in terms of application inspection, tweaking and exploration. It does so, however, with its own flair and interface strengths. I am very impressed by this product. The app provides a handy "tl;dr" jumpstart for anyone testing it out. Choose Help > Integration Guide. All you need to do to get started is link in a few frameworks, set a build flag and run your app in the simulator. Reveal automatically detects and integrates with any app running its custom framework. Even better, the app stores that framework in its own bundle, so there's no other material to incorporate. From the app download to up and running, it took me maybe a minute to get going. Once running, select your running app. You can tweak items in the View inspector (the third of the four inspector panes) and your changes are automatically injected into the application. You can see the simulator update live. For the app I was testing, I messed around with frames and content modes, and found the app to perfectly adjust those items. Elements in the other three panes appeared to be inspect-only in my testing. Reveal is not targeted at Auto Layout at this time, and some of my tweaks put Auto Layout's nose out of joint a bit, such as when I attempted to set a view's affine transform to non-rectangular results. This app will be best for anyone still working in the frames and bounds world, who wants to be able to adjust their interfaces in real time. It's perfect for developers who prefer not to rely entirely on Interface Builder and who use extensively use code. With Reveal, you'll be able to update interfaces without endlessly performing the tweak-build-test cycle. Instead, you explore in a live playground until you've found the interface you're looking for. Like Spark Inspector, I would have liked to have had a product output of some kind, whether it was PaintCode-like code generation, bookmarks of saved interfaces (for later review and comparison) or just settings charts. Unfortunately, neither product offers these options at this time. I'd also love if Reveal integrated with constraints. I almost never deal directly with frames and bounds any more now that Auto Layout has debuted, and I think I would find a tool that let me create, inspect and validate those rules a lot more valuable. That said, Reveal is a lovely app even if it's one I wish I had had about two years ago before Auto Layout premiered. Its interface is top-notch, it's easy to use and I really enjoyed exploring it. Because it's in open beta, I highly recommend that you download a copy and poke around. You may discover that it's exactly the dev tool you've been missing.
DevJuice: WebCode premieres, generates JavaScript+Canvas
As I've been working on a new book on iOS Quartz Drawing, I've been using PixelCut's PaintCode app pretty heavily. Today, a new PixelCut tool just hit the Mac App Store. WebCode (US$49.99) generates JavaScript+Canvas, CSS+HTML or SVG code on your behalf. If you've used PaintCode, WebCode will feel immediately familiar. Similar tools and same panes make the new app very much like the original. Instead of generating Objective C, however, you're presented with ready-to use Web source. The app just debuted, so I have only played with it a little bit. WebCode, I should note, supports Photoshop PSD import as part of its base features -- no in-app purchase needed.
DevJuice: PaintCode offers new Photoshop import IAP
See the bunny in the screenshot to the right? It started life as a Photoshop shape. As you see it there in the simulator, it's now a UIBezierPath. It got there courtesy of PaintCode. I first reviewed PaintCode last year. It offers a high-end resolution-independent design tool for transforming vector graphics into Objective-C code. In its latest incarnation, you can now import Photoshop files. The new feature is a US$19.99 in-app purchase on top of the $99.99 app, but if you'd like a sneak preview, you can download the demo version from the PaintCode website. The demo version is quite limited; you cannot copy code or use the app for more than 20 minutes at a time. I personally think this is a killer feature. It greatly simplifies the way many people already have a workflow, integrating Photoshop directly into the coding process. Plus, for design idiots like myself, you can purchase shape libraries for Photoshop and then use those vector graphics in your apps. (I would, however, suggest carefully reading through any license agreements to ensure that what rights you think you're buying are actually the ones you do purchase.) In addition to plain shapes, PaintCode will also import layer effects like gradients, color overlays, shadows and patterns. This means you can design a complete button in Photoshop and draw it into your app using Objective-C code. The new upgrade is available now. Choose Store > In-App Purchase Store to get started. Existing PaintCode owners will be happy to learn that version 1.3 of the app introduces new features in addition to the paid Photoshop upgrade. You can now import SVG, enabling you to import drawings from Adobe Illustrator directly to PaintCode. PaintCode also now integrates images into your drawings, plus it's added groups so you can combine many shapes to a single, more manageable object. Update: TUAW reader Dave Anderson was kind enough to send over a vector DogCow so I could test the new SVG import added in version 1.3. It worked great. Thanks, Dave!
Makers of PaintCode open CodeAutomat service, for turning SVGs into code
I'm currently working on developing an iOS app in conjunction with a graphic designer, and because my design skills are pretty terrible, we set out to look for a solution to turn the scalable vector graphics (SVGs) he's designed into Objective-C code snippets I can insert directly in the app. There are a few different ways to do this, but it turns out that PaintCode (which Erica wrote about earlier this year) is the solution we're going with -- it's an app that will fairly easily convert scalable vector graphics into Objective-C code, which iOS can then use to draw out a user interface for a touch-based app. And it just so happens that just as I found their app, the folks behind PaintCode have released a brand new product. CodeAutomat is a new service, from the same developers, that's designed to make SVG-to-code conversion as easy as possible. All you need to do is upload your SVG file on the site (you can even drag and drop it in), and then for a small charge (starting at US$4.99), the browser-based app will turn your graphic into code, using PaintCode's formula. Now, PaintCode's price is $99.99 (on the Mac App Store now), so if you're converting a lot of graphics, you might want to splurge for the whole app. But the service is super easy to use, and works with any SVG file -- just plug it in and play. For those who need a few conversions but don't want to buy a whole app, CodeAutomat could be very helpful indeed.
DevJuice: PaintCode offers resolution independent design
PaintCode (US$99.99) is a vector drawing app that generates Quartz and Core Graphics Objective-C (and C#/MonoTouch) drawing code. First released this March, the app was inspired by Apple's introduction of the Retina iPad. It allows developers to create resolution-independent art that adapts to the physical and geometric differences between devices. It's somewhat similar to Opacity (which I'm told it is no longer under active development), but with tools that specifically target Apple's latest technology. For example, PaintCode includes a Retina preview button that lets you visualize how the art will look on higher-density displays. Supporting both OS X and iOS code generation, PaintCode was actually developed using its own tools. Clocking in at just 2.3 MB, the app bundle's slim form factor is due to the vector graphics powering its interface. PaintCode allows you to build nuanced graphics, as you can see in the gallery at the end of this post. It is aimed at both designers and programmers. It's interactive tools mimics other popular vector-based editors. You build your design in a visual layout screen, and the supporting code appears at the bottom. You choose whether the code is generated for OS X, for iOS, or C# (for Monotouch development). What's more, you can generate either ARC or Manual Retain/Release output. PaintCode's developers have spent a lot of effort creating tools tied into the way people craft applications. For example, it's possible to build color swatches and gradients that are based off a core color. Update the root color for a family, and all the members who were derived from that base color update as well. It's a very nice feature. Another great feature is PaintCode's support for frame-based layout. Anyone familiar with Interface Builder's struts and springs tools will be able to recognize how PaintCode items resize with respect to a parent frame. If you're working with text, you'll appreciate PaintCode's ability to convert strings to Bezier-based text paths. This allows the results to resize as needed, or you can add effects like gradients to the derived paths. Admittedly, PaintCode is a pricey application, retailing for about a hundred dollars. When I kicked its wheels, I found the tools relatively easy to use -- although I was given an interactive tutorial before testing it out, which certainly helped. I did encounter a few glitches along the way, which is to be expected for a tool as new and specialized as this, but quitting and restarting the app cleared up my problems. I was impressed by the overall tool, and can see it being valuable for anyone writing across devices. This is especially true if Apple, as rumored, introduces even more new iOS device form factors this autumn. PaintCode, with its vector-based art that paints with respect to points, not pixels, offers a way to build resolution independence through code. It's a tool that continue to evolve as PaintCode's customers drive its feature set. Developer Peter Krajcik told TUAW, "We want to cover all the possibilities of Apple's APIs, but we base our feature set on our user requests and the customer demand." Krajcik discussed some of the new features that will debut in the upcoming 1.2 release. The refreshed app will introduce groups, blending modes, group clipping, SVG import, and enhanced shadow control. It's just entering beta now, and should ship within the next month or two, depending of course on the whims of the App Store. PaintCode's site offers a trial version to test out before buying, lots of examples and tutorial videos, and a wealth of documentation. %Gallery-162730%
