maanantaina 28. heinäkuuta 2008

Never Trust a Smiling Succubus?

So, she approaches you, with bright smile and cute-but-curvy looks. Talks sweet nothings to your ear. Why should there be anything to worry about? Horns? What horns?



Markers and black pen on paper. Inspiration from one of the greatest webcomics out there, Sinfest. That comic's been running for eight years straight and still going strong.

sunnuntaina 6. heinäkuuta 2008

Bubblun

This project has been unfinished for far too long, so this week I decided to complete it. And now it's finished, at last! So let me present to you: my own super-huggable video game plushie.


Made of cotton cloth, fiberfill, a bit felt and plenty of thread, it's my second hand-made plushie. The first was Tux, made to the Free Penguin Project patterns.

keskiviikkona 2. heinäkuuta 2008

Filter effects: Lighting effects

This is part of my filter effects tutorial series

Lighting effects can help in creating a feeling of depth in you image. They take in a height map and various light and material parameters and produce a light map. This light map can then be composited with your object to produce a result that looks like light falling on the object.

There are two lighting filters: Diffuse Lighting and Specular Lighting. This is how lighting is usually created in computer graphics. Diffuse is how the light reflects off a completely matte object, the sides facing light are brighter and sides facing away from light are darker. Specular in turn is how the light reflects off a smooth surface, it creates bright spots where the light reflects towards the viewer.

There are two other common lighting properteries: ambient lighting and mirror reflection. Ambient is the light that doesn't seem to come from any particular direction. In filter effects, ambient component comes from the original colour of the object. Mirror reflections, as the name states, are reflections that show the image of other objects. Mirror reflections are not supported by this simple lighting model.

First, before I'll explain these filters more throughly, I'll tell you a bit about height maps. SVG drawings are two-dimensional and as such, they don't actually contain any depth information. Without depth information, everything in the scene is completely flat, and lighting totally flat objects would be rather useless, because everything would be of same brightness. Height maps are used to overcome this problem. Any image can be used as height map, the transparent areas of image are the lowest point and the more opaque a point is, the more it is considered to be above image plane.


In this image, the height map here is completely black and lighter shades are more transparent areas. The light comes from top-left. You can see how this height map is used to create the looks of light falling on three-dimensional object.

For practical uses, it is often useful to create the height map automatically from the filtered object. Gaussian Blur, for example, is handy for this. The next image shows a height map derived from original object by Gaussian Blur

Again, the white areas in height map are transparent and more dark areas more opaque. The red line shows the original shape of the object, it's not actually part of the height map. The used lighting filter is from examples/lighting-filters.svg from Inkscape distribution. The result looks more like some rat-shaped badge than an actual rat, but I'd guess, it's quite fine for demonstration purposes.

So, enough of height maps, let's go to the actual effects. I'll start with Diffuse Lighting.

Diffuse Lighting is, as I stated above, the light reflecting off a completely matte object. In reality, it's hard to find any such object, but cotton cloth, unpolished stones, bricks and other such materials with highly uneven surfaces come close.


There's a bunch of settings for Diffuse Lighting, so let's go through them.

Diffuse Color sets the light colour to be used.
Surface Scale determines, how to map the height map to actual height values. The bigger the value, the higher the peaks of height map. Also, you can move this to negative side, to turn the peaks into valleys.
Constant modifies the strength of the light. High constants result in harsh lighting and strong contrasts between the light and dark areas.
Kernel Unit Length is not yet used in Inkscape. It is used to make the result resolution-independent. Now that it isn't used, with high zooms you can see odd plateaus forming. (There's an other way around this, though it requires using XML editor. See examples/lighting-filters.svg in Inkscape distribution)
Light Source determines the type of light used. Available settings below that also depend on type of light used.

The resulting image from Diffuse Lighting is fully opaque. It is best used by multiplying the colour values with the colour values of original image. This can be accomplished with Composite filter in Arithmetic mode and multipliers set as K1=1.0, K2=0.0, K3=0.0, K4=0.0. (See Composite tutorial for more through explanation of these factors)

Specular Lighting simulates light reflecting off a smooth surface. Plastic and metallic objects often have strong specular reflections, though for really smooth objects mirror reflection can become dominating.


Most settings for Specular Lighting are same as for Diffuse, so I'll just go through the new ones.

Specular Color is the same as Diffuse Color, it determines the light colour.
Exponent is completely new here: it determines the shininess or smoothness of the object. Low values correspond to not-really-shiny objects, high values to really smooth objects. Essentially, the higher the exponent value is, the smaller and sharper the shiny spots are.

Specular Lighting filter produces an image, that is filled with Specular Color, but opaque only where the specular highlights should fall. It is best used by adding the colour values with the colour values in the original image, or the colour values of diffuse shaded image, if you're using both lighting modes. This can be done with Composite filter in Arithmetic mode and multipliers set to K1=0.0, K2=1.0, K3=1.0, K4=0.0.

Although the filters I've shown here have used Gaussian Blur to create the height map, this is by no means a requirement. Any image will do, though preferably one with several shades of opacity. For example, using result of Turbulence filter as height map can create interesting effects. Here, I've used turbulence to create an effect that looks somewhat like crumbled tin foil.

The filter is available in Inkscape distribution in file examples/turbulence_filters.svg

lauantaina 31. toukokuuta 2008

Big Buck Bunny

You may remember the Elephants Dream, the open short movie. It was developed as project Orange at the Happy Blender Institute. Now, a new team working on project Peach at the Blender Institute has published their work: an open short movie Big Buck Bunny.

At LGM, I had the pleasure of watching this great movie on a big movie theatre screen.

Elephants Dream was a technical masterpiece, showing the quality of graphics that can be accomplished with open source programs, it was somewhat lacking in the area of storytelling. While I'm guessing this dreamlike drifting to different directions was intentional at least to some degree, it just felt somehow odd to me. Maybe I just don't understand the fine art ;)

Things look quite different in Big Buck Bunny. It's still a technical masterpiece, actually they've bumped the graphics quality up a notch or two with fur, grass and all such natural phenomena. But the bigger difference is in storytelling. This movie tells a simple story in easy to follow manner, with loads of humour. Some might think that it underestimates the mental capacity of viewers, but I digress. It's nice entertainment.

Other interesting thing from Blender Institute is the project Apricot, which is creating an open source game using Blender, CrystalSpace and several other related tools. I've tried the released versions of these tools, and from what I saw at LGM, this project has made huge improvements to them. Already with the release versions, you can edit stuff like models, textures and actions between the player and scenery in Blender and export all that to the game engine. With the development version project Apricot has, it's possible to actually have the game engine running in a blender window while you can edit game data in other windows.

perjantaina 30. toukokuuta 2008

Fun with markers 2: Freefall

A couple days ago I bumped into a great webcomic Freefall. One thing that caught my interest was how well the artist is able to express the characters' moods, reactions etc. in small scale and with just a couple lines. I decided to try and imitate that style.

So, here's Florence Ambrose, a Bowmans Wolf and a technician, from Freefall:


While I'm not quite happy with the colours (I need more brown shades!) I think that came out quite well.

For those who've been following this webcomic, finding the strip with Florence posing like that shouldn't be a hitch.

Also, I noticed that there are some interesting colours in my palette:

Blender, Orange and Apricot. Too bad, there's no colour Peach in my palette nor in ProMarker colour range.

torstaina 29. toukokuuta 2008

Filter effects: Convolve Matrix

This is part of my filter effects tutorial series

Convolve Matrix can be used for several different effects like blurring, sharpening, edge detection and embossing. While it's a powerful tool, it can take quite some expertise to create the desired effect.

Inkscape support for Convolve Matrix filter primitive is not yet quite finished, but it can already be used for some work. The biggest problem is, the results will depend on the rendering resolution.

The idea of this filter is to apply a convolution on image. Basically, it takes certain amount of pixels around the target pixel, multiplies the colour values of each pixel by its multiplier and sums them up to form new colour value for the target pixel. There also exists common divisor and bias that will be applied after summing pixel values up.

For more through and mathematical explanations of convolutions, see Wikipedia page on Convolutions or article on Matrix convolution filters on GameDev.net.

Here's an graphical example with single target pixel and the 3×3 area surrounding it.


This same filter is specified in Inkscape Filter Effects dialog as follows:


Two special notes here: first of all, the bias is specified as 128 in the first image but as 0.5 in second image. These are actually the same thing, the first image just uses colour values in range 0–255, the second image in range 0–1.

Second, the divisor isn't actually required. I could have specified the kernel with values of -1/8 and 1.0 and left the divisor as one. The divisor just makes specifying the values easier.

Here are some examples of possible effects:

Box blur:

(notice though: usually it's better to use the Gaussian Blur filter primitive for blurring)

Motion blur:


Edge detection:


Sharpen:


Embossing:

torstaina 22. toukokuuta 2008

Rant: Curly Braces

I bumped into an writing called Java: Braces are your friend. While I can see that there are good reasons to use braces after every if statement (or after for, while, do...), the reasoning seemed a bit off.

First of all, it states that the following is allowed, but dangerous:

if (condition)
Exactly one statement to execute if condition is true
else
Exactly one statement to execute if condition is false

Well, all fine and dandy and I can see where it's aiming to. The thing is, that very form is the only form that exists. The braces just serve to gather several statements up to form a single statement, they're by no means part of 'if' syntax.

The first actual reason stated, as to why not leave the braces out, is the following situation

if (condition);
do_something();

Well, OK. I can see how one can accidentally type the semicolon after the if clause. But then again... Hello, it's 2008 calling! You won't believe what cool things our program editors nowadays have. They colour the different parts of code with different colours and you know what: they even indent your code for you! Amazing, ain't it?

if (condition);
do_something();

That certainly doesn't look like such a big error anymore. Also, if one can go and write an extra semicolon after the if clause, why couldn't this happen as well?

if (condition); {
do_something();
}

Even automatic indenting won't save you from that!

The other reason is one, I think I've seen quoted a few too many times:

if (condition)
do_something();
do_something_else();

Yes, the old case of "What if someone later on wants to add more functionality to the if block?" Well, 2008 calling again and all that. Try writing that to any even semi-decent programming editor. It becomes this:

if (condition)
do_something();
do_something_else();

Not so dangerous error anymore, either. You can clearly see that the second statement doesn't belong to the if block.

Also, it crossed my mind that both these errors become invalid code, if you have an else block after that if. That's pretty much a corner case though.