omino pixel blog

We most of us use Bezier curves all the time, for masks, shapes, animation curves. They’re pretty intuitive. Points, control handles… yeah, you can usually get them to do what you want.

To do some math recently, I googled a bit more about them. They’re named from Pierre Bezier (1910-1999) who popularized them for CAD while designing cars for Renault. The standard “two-handle” style used by Adobe apps (and most others) is a “cubic Bezier”, because the equation uses some cubes.

To walk a cubic Bezier mathematically, given the four points (two end points, and two intermediate control handles), you can use this Python code, varying t from 0.0 to 1.0:

# given points p0, p0Out, and p1In, and p1, and t varying from 0.0 to 1.0...
a0 = (1 - t) ** 3
a1 = 3 * (1 - t) ** 2 * t
a2 = 3 * (1 - t) * t ** 2
a3 = t ** 3
# calculate x and y
x = a0 * p0.x + a1 * p0.xOut + a2 * p1.xIn + a3 * p1.x
y = a0 * p0.y + a1 * p0.yOut + a2 * p1.yIn + a3 * p1.y

But that’s all tricky. Here’s an intuitive way to visualize just what the heck a Bezier curve really (for really) is:

I did this animation in Python… stay tuned for much more on that front.

Super kudos to bimixual.org for the clear explanation.

(The parentheses in the post title mean that this post is essentially parenthetical.)

Arggh. Developing Pixel Bender kernels and plug-ins, my test files kept behaving erratically. Expression indexes were to blame. Each time I added or removed a parameter, the numbers all shift.

So you see, first enabling the expression produces effect("my_effect")(8). But it depends on the exact order of the parameters!

But effect("my_effect")("param 9") depends on the name.

I think I like the second one better, because I’m pretty good about nailing down my parameter names, but more likely to move them around order-wise.

(See?)

Early this month, we visited the San Jose Museum of Quilts and Textiles, featuring patterns and clothing by the Hawaiian designer Alfred Shaheen. Great stuff! Yeah, I have a closet full of Hawaiian shirts.

(Show show goes til August 8, worth visiting. On the first Friday of the month, many of the galleries on First Street in San Jose, CA are open late, definitely a nice night out.)

Since I adore repetition, and halftoning, I got to wondering if I could recreate some of the patterns programmatically. The “Omino Stamper” filter runs in After Effects and attempts to do this.

download ==> omino_stamp.pbk, an After Effects filter.

The idea is pretty simple: draw a “stamp image” in a pattern which can be affected by the source image. It’s a little bit like a particle effect, but more mechanical.

Here’s the controls and few examples, which look nothing like Hawaiian shirts.

A quick rundown:

• The pattern- settings adjust the stamping grid
• The stamp- settings adjust orientation and size of the stampimage image
• The stampOverlaps setting controls how many nearby stamps are computed for each pixel; slows down the render a bit but is necessary for closely-spaced stamping. (If you see missing corners and such, increase this setting. (Those of you familiar with Pixel Bender will immediately apprehend why this is so. 🙂
• The affectsStampSizeAmount, affectsStampColorAmount, and affectsStampRotationAmount settings control the halftoning features of the filter.

Here’s a basic stamp:

Next, we adjust the bricking a little, to make it less square-y:

And let the color of the underlying image affect the stamp color:

How about affect the rotation, instead of the color? Kinda wild:

Or back to basics, let the underlying image affect the stamping-size:

Here’s a festive little animation playing with the effect a bit, and does include a Tiki god or two.

download ==> omino_stamp.pbk, an After Effects filter.

Enjoy!

Easy Rain

Here’s a cute one. Nothing deep or advanced, but it was fun. It’s a way to get a very simple and cheap “rain” in After Effects.

1. Take a tiny bit of Noise, and blur it in one direction with Fast Blur.
2. This makes very, very dim “streaks”. Use Threshold to make them visible again.
3. Fast Blur it a little in both directions to make the edges smooth again.
4. Rotate the whole layer, for angled rain.

Easy peasy!

Here’s the AE setup for it. Trivial! Small adjustments of the parameters can get all sorts of interesting results.

What about CC Rain?

Well you know, apart from the joy (cussedness) of doing it the hard way… CC Rain makes relatively slow well-defined rain streaks. Depending what look you like, combining CC Rain with the more random movement described above is pretty nice, too.

If you like, here’s the self-contained tiny AE project. ==> just_rain.aep