2010-03-07

arclight 0.1

Arclight is a tool for rendering images that was written in Google's Go programming language. I was curious to check out Go so I wrote a tool to help generate button and background images for other projects.

How Do I Get It?

You can download the source code or a command line 32 bit OS X app. There are caveats on both, so please check the readme files.

How Does It Work?

An Arclight project has four main concepts: Layers, shapes, mods and arcs. Layers are the same as any paint program: Multiple layers are composited to create a final image. At the heart of each layer is a single shape. The only shape currently implemented is the humble circle. (all illustrations are labeled with the corresponding file name used to generate the image, included with the download)




circle.json
To make the circle interesting, we need to shade it. This is accomplished by modulating an arc. An arc is essentially a 1:1 mapping that takes values of 0 to 1 and replaces them with new values of 0 to 1. Each layer has a single arc.
For the arc to draw, we need a mod. A mod is a combination of a source and a destination. The source is responsible for getting information from the shape, then the mod takes this information and applies it to a destination in the arc.
Let's see an example. Here's our circle, but it now has a source set to the degree of each pixel from the center of the circle. In Arclight, degree 0 is the right edge, and it sweeps clockwise, so the lowest (0) and highest (1) values are the right edge, and the middle (0.5) value is the left edge:




circleNormals.json
There's another kind of source: The distance from the edge of the circle. The edge is the lowest value and the circle center is the highest value:




circleDistance.json
Just setting the source isn't all we did to shade the circle. We also needed to set a destination for the source, and this meant supplying an arc for the layer. The arc we used was called Constant: Simply a constant number, from 0 to 1. So the source values (remember, each source can be either angle or distance) are modulating the constant value in the arc. This means when the distance is 0 the constant is 0, when the distance is 0.5 the constant is 0.5, etc. The result is that the circle is shaded according to the source.
Arcs can stack. This means we aren't limited to just using a Constant arc to shade the circle. If we want the shading to look a little more natural, we can run it through a pow() operation. Here's the circle, but now the Constant arc is being sent through pow(0.5) before shading the circle:




circlePow.json
The difference is subtle, but non-linear operations like pow() are inherently more pleasing. The circle feels a little more solid and real now.
When shading the circle, there are four possible fill modes. Clockwise from top left they are INSIDE (shade starts inside the circle and ends at the edge), OUTSIDE (shade starts at the circle edge and proceeds outward), INSIDE/OUTSIDE (shade starts inside the circle and proceeds outside the circle) and EDGE (same as INSIDE/OUTSIDE except the center is not filled in; this mode will likely go away at some point). In addition to the fill modes, the following example prettifies things a little bit by adding a drop shadow, which is simply another layer beneath each circle built from the same components we've already discussed.




locationShadow.json
There are currently very few arcs provided: We've talked about Constant and Pow. There's also SCurve, which is similar to Pow (it's used to make linear shadings more appealing, and was used in the drop shadow example above). We haven't talked about Binary but it's how arcs are stacked (a Binary arc has a left and right, and it processes them in that order). Finally, there's Sine, used to render sine waves. In this example, a sine wave with a period of 0.5 is being modulated by the angle, and the result is filtered through a Constant being modulated by the distance.




sineNormals.png
Each layer only has a single arc, but it can have any number of sources and any number of mods. Each source also has an arc that can do processing. In this example I'm processing the source with Pow() before patching it to a sine wave.




ringFade.png
Of course you aren't limited to the rather spectacular blue and gray colour scheme I've been using. Each arc can be rendered with an interpolated colour array of any size.




ringSwirl.png

So What Are You ACTUALLY Using it For?

Oh you caught me. Just this:


When you give an Arclight patch a file name ending in ".9.png" it knows to save the image in the Android 9 Patch format, which is a stretchable bitmap that can be used for size-independent drawing in Android applications. Sometimes I get bogged down in generating and futzing with various background graphics, so I wrote a tool to help me out.

Anything Else?

There's no user's guide and probably many implementation details that haven't been mentioned. The only big thing that comes to mind is that mods can accumulate in multiple destinations before rendering, meaning a destination can have any number of mod sources. The value of this app is based entirely on the shapes and arcs it includes, which are extremely limited right now. Obvious improvements are a shape for reading SVG files, and a slew of arcs (noise, looping, and multipoint envelopes would all be nice), but this was only meant to be a fun, quick project to get a feel for Go programming.

No comments:

Post a Comment