So it’s been a while since I’ve posted an update, but that’s not to say progress hasn’t been made. Very far from it. Bezzy was due last week, which means I spent all my days (and nights) scrambling to get it done. This has left me with little time to update this blog. I ended up getting everything I wanted done in time, albeit not quite as polished as I would have liked. Still, that’s how software development goes.

So what have I been working on for the past week? Keyframe animation, two Non-Photorealistic Rendering (NPR) fill techniques, and a little tech demo to tie all of this together. I also visited my “friend” Dynamic Tessellation for a bit.

We’ll talk about the first two today. Part two will be posted “soon”.

Keyframe animation

This along with morphing animation forms the animation module of Bezzy. I was a bit unsure whether something as high-level as animation would work in a very low-level API, but it turned out really well. What’s neat is that there’s a good deal of flexibility to allow for the type of “reactive” animation that videogames require. So you can start an animation and (with a bit of work) tweak it on a per-frame basis depending on what the state of the game is.

Keyframe animation does two things: (a) it allows you to make an object move along a path, and (b) rotate and scale an object any number of times along the way.

Here’s an example screenshot. I’ve super-imposed the animation on the same image to save me the trouble of posting a video. As you can see, the diamond is scaling differently on both axes, as well as rotating clockwise and counter-clockwise along the path. The path it travels on is rendered in the background, but this is obviously my doing, not the API.

Non-Photorealistic Rendering

The field of Computer Graphics is focused on achieving photorealistic rendering. Thankfully, some smart people decided this was a terrible goal, and started researching aspects of non-photorealistic rendering. This has lead to all sorts of fantastic rendering techniques that are more art-like, and mostly quite abstract. I implemented two NPR techniques right into Bezzy.

The first is Stippling. Stippling is using dots to simulate light and shading. This is problematic, because Bezzy is 2D, and therefore doesn’t have any light or shading. To compensate for that, I simulate light for stippling. Basically, to stipple fill a path you have to provide a light position and radius.

This was the last feature I implemented, so it was a bit rushed. I’m not entirely pleased with it, but it works reasonably well.

Contour filling, on the other hand, worked out fantastically. Like contours on a map, this renders a gradient fill of your path using discrete colours. The number of contours and their distance is customizable, as the screenshot below demonstrates.

I plan to take this a step further and write a “smooth contour” fill mode to make the transitions between the contours gradient, which would create a sort of halo of the path. Presently, I can do this by increasing the contour count to a very big number, but there’s a very noticeable hit on performance.