Effect Idea: Motion Blur (a proper one)

This is a very realistic effect that I've managed to program in MMF (construct's still iffy for me, I think my laptop's too pants), and think would be awesome if you could make an effect for it (rather than having to use events).

It would have these parameters:

• Step (in Pixels)

• Luminoscity (0-100%)

What it does is thus:

When an object moves very fast, it jumps a few pixels. This effect loops from the start point (previous frame) to the end point (current frame), drawing copies of the object on every step pixels in between.

Additionally, each 'instance' that it pastes has its opacity split this way:

step / distance * 100%

So if the object is moving at 100px/f, that means it's travelled 100px between this frame and the last one.

So instead of drawing just one object, if it has a step of 1px, it'll draw 100 instances of the object, all at 1% opacity.

This emulates very very realistically the motion blur in every day life.

You can see the effect as it appeared in MMF below. It has practically no slowdown over distances of about 300px, even in MMF. So I can't imagine how fast it'd run in Construct!

<img src="http://i202.photobucket.com/albums/aa130/ChrisDines/scrn_motionblur_3.png">

<img src="http://i202.photobucket.com/albums/aa130/ChrisDines/scrn_motionblur_2.png">

<img src="http://i202.photobucket.com/albums/aa130/ChrisDines/scrn_motionblur_1.png">

This last one has got the cleanup routine switched off (since this one is hardcoded in events, obviously), and shows better the effect over several frames.

You know you want that on your Sprites

Just forgot one thing, the luminoscity value.

This basically adds an extra % to the opacity of the object, so if it's a light, you can have a luminoscity of 50% or something. That'll adjust the opacity, making the light appear brighter, so you get some more realistic streak effects.

It emulates the fact that light sources are sending more light to the camera's sensor, thereby creating a deeper impression than a normal object reflecting indirect light. So the motion blur is stronger.

In maths terms, I haven't tried it, but I'm guessing you'd have do something like this:

luminoscity;

distance;

step;

base opacity per step = step / distance * 100;

lum opacity per step = step / distance * luminoscity;

opacity per step = base opacity per step + lum opacity per step;

So your final opacity per step is the spread object's opacity, plus a spread of the additional luminoscity.

You know you want that on your Sprites

That does look pretty sweet

Lol, ta. I still can't get over how fast it is, and how real it looks in motion. Only downer is, it looks better on lower framerates, cos it's skipping more pixels at a slower speed. Because it works like a real motion blur, if you have an enormous framerate then you'll hardly notice the effect.

Looks really good; a motion blur is definitely an effect that should be there (though due to the amount of options and scope, it could be an object like Dropshadow).

It'd be nice to see it, and construct has the horsepower to handle it better too

The only important thing to bear in mind - which people often don't realise with motion blurs - is that there's never a 100% opaque copy of the sprite visible. People imagine it as a fading trail behind a solid object, but that couldn't be further from the truth.

The motion blur actually blurs the object itself, stretching it between where it was at first, and where it is now. So if the effect was applied as a separate object, it'd need to make sure the original object is invisible. Otherwise the effect doesn't work.

One advantage of having to use events to code it in MMF was that the sprite itself is being used as the paster to create the blur. So by the time the blur is finished, the sprite is the same opacity as the rest of the blur (it basically takes the place of the final 'instance'). But of course, if it's applied as an effect or effect object instead, that may be quite different.

This is a really nice effect, but I don't think it can be done as a pixel shader - shaders themselves can probably do it, but limitations (such as bounding boxes) that Construct places on shaders makes it difficult. It could be coded as a 'movement', i.e. you add it on to the object and it changes how its drawn (a bit like what Rich said). This has the added advantage it doesnt actually require any pixel shader hardware - it's just drawing the sprite a bunch of times!

Also I'm pretty sure this would look better in Construct - since Construct uses floating point X and Y coords, you wouldn't get any of the step-aliasing I can see in your screenshots, if you look closely, especially in the first and last pictures. However, I still don't think it's a true motion blur - you can see outlines of the original image at the first and last position, when really no individual image should be visible. Ideally, each step should be rendered and blended equally to a final image (temporal anti-aliasing), but this is probably near enough for most uses.

I'll see if I can come up with something for the next build!

Another more interesting idea is full-scene motion blurring which is possible with temporal anti-aliasing - but this is trickier, I'll have a think about that...

I've evented a motion blur in Construct and it runs very well (my GeForce 8800 GT can manage 1500-8000FPS constantly, depending on blur distance), and without the step-aliasing in your pictures. However this is not a true motion blur, I find if you move the object slowly, it becomes slightly transparent - this is not realistic, because at least some areas of the object will be opaque, where there has always been something in the way over the "exposure". It's probably because the algorithm you state does not blend equally each rendering, but rather is only tending towards the correct value - for example, drawing two 50% transparent objects over each other gives you a 75% opaque image, so this method of rendering is not accurate for a motion blur. Still, interesting technique, I'll see if it can be refined - it still looks great!

Scweemshots pwease?

I'd love to see it in Construct!

Well whaddya know, I got all interested in this and added full-scene motion blurring for all moving objects, done with a real temporal-antialiasing algorithm too, and no pixel shaders. Check out a pic of it here - this is zooming in rapidly in the RTS demo, which shows a cool motion blur. (Oh, check out my 8800 GT cranking out 730fps )

ooh... That's awesome!

That looks totally boss. It is full-screen only or will you be able to apply it to individual sprites as well?

It's a global effect, so it applies to anything that moves on the screen at all.

Mummy.

Could you maybe do a little mock-up of a sprite following the mouse, like in mine, just so we can see a straight comparison? I'd love to see it

OK, here's a quick demo:

http://www.gullen.pwp.blueyonder.co.uk/ ... urtest.zip

There's a normal version and a motion blur version. Move the mouse and use arrow keys to move the objects. Both use a normal 8 direction and mouse movement.

It requires a new-ish ATI or nVidia card to work (Radeon 9500+ or GeForce FX 5700+), otherwise it'll probably give an error. If everyone could try it out and let me know if it works, and your video card model, that'd be useful. Also if you move the mouse really quickly and take a screenshot, you can see step-aliasing (because it uses a fixed number of steps, not one for each pixel of movement like your example), but the result is good enough for the human eye.