223. World of Warships #6 – Special effects

I’ve added and improved the special effects, from the sea and the movement of the boat, to explosion effects, as shown below.

IIn this post, I’ll explain what I did.

Sea

Until now, my sea has just been a flat surface with one colour. Now it ripples and moves like real sea.

I got the code from one of my earlier posts, all about using the noise function.  I just made the mesh horizontal instead of vertical, and fiddled with the inputs until it looked nice. Other than that, I didn’t change the code (not least because I couldn’t remember how I’d done it!). Each frame, I move the picture by 0.25 pixels, which creates the flowing effect.

Ship movement

You may notice the ship seems to rock around as though it’s in small waves. I’m just using a sin function – twice – to create a small rocking motion, side to side, and up and down, with small rotations on the x and z axes. These little things really add to the realism of a simulation.

This is the code that does it.

--no real reason for using math.pi, just making a and b different
local a,b=ElapsedTime*0.1,ElapsedTime*math.pi*0.1
rotate(10*noise(a,b),1,0,0)
rotate(3*noise(b,a),0,0,1)

The boat also has a wake, which is simply a flat 2D picture (also drawn by the program) which is laid on top of the sea, and moved slightly forward and backward (again with a sin function) to create the impression of movement.

Explosions

I wanted to show a smoke cloud when a ship was hit. I spent quite some time trying to write (as simple as possible) code that created a realistic smoke cloud. In the end, I made it adding 1000 ellipses of different random sizes and positions, to an image in memory (setContext). To ensure the result was circular and not square, my random numbers weren’t x and y positions, but an angle and a radius. The later ellipses were smaller and whiter, giving a nice layered effect.

I just made one smoke cloud image, which I then draw in different sizes, rotated, and for different time periods, when a shot hits a ship.

I then used a shader to fade the image, so it disappears gradually as in real life. To do this, I pass the shader a factor which is

1-(t*T)*(t*T)

(where t is time shown so far, and T is total time before the cloud disappears), so the cloud disappears fairly quickly toward the end. The shader simply multiplies the smoke texture colour by the factor.

 

I’ll post code again soon, but I want to do some more work first.

It’s time for the enemy ship to start sailing around.

Advertisement