The Shape of Everything
A website mostly about Mac stuff, written by August "Gus" Mueller
» Acorn
» Retrobatch
» Mastodon
» Micro.blog
» Instagram
» Github
» Maybe Pizza?
» Archives
» Feed
» Micro feed
April 22, 2011

I've got 3 JSTalk scripts for Acorn that any iOS developer or designer will find handy. What they will do is take the current Acorn image and save it as an optimized PNG (running it through pngcrush in the background).

To install the scripts, save them in your ~/Library/Application Support/Acorn/Plug-Ins/ folder. Make sure they end with ".jstalk". When you next restart Acorn, they will show up in the Filter menu. (And speaking of JSTalk, 1.0.1 was just released on the App Store the other day.)

When designing UI elements the usual workflow is to save the documents in a native format of the app you are using (.acorn in Acorn, .psd in Photoshop, etc). This file would be considered the working document, or master copy. When you are happy with it, you would then export it as a flattened format for use in iOS. These scripts will save the images as flattened PNGs.

Here's the first one: Save@1x.jstalk. It's pretty simple- it just checks to make sure the current document has been saved, and that its path extension ends in .acorn. It then tells Acorn to save a copy of the image in the same directory, but as a png. So if you have "MyButton.acorn", Acorn will save a copy as "MyButton.png".

The second one (Save@2x.jstalk) does something similar, but adds a @2x at the end of the filename. So "MyButton.acorn" will be saved as "MyButton@2x.png"

The final one will save both a 1x and a 2x of the image. When used, it will first save "MyButton@2x.png" (this assumes that the master image you are working on is the 2x version). It will then scale the image by 50%, and save that as "MyButton.png", and then finally undo the operation so we're back at 2x. Here it is: Save@1x2x.jstalk.

The first two are pretty obviously useful, but the third one in practice is a bit of a novelty. You probably will want to touch up your image a bit after scaling it since not everything can be scaled down perfectly.

Hopefully some of you will find this useful.