Creating deforming circles like bubbles

beginners
#1

Hi,

I was wondering for a way to create more dynamic animations with OF. Most of the time I use transparent PNGs for animations but now I really want to take a step forward.

I am looking for a way to create deforming circles, which I want to use to create an underwater bubble effect. My instincts say that I should use ofMesh to draw circles/spherical shapes and map proper textures on them. I would be really thankful if anyone can provide few pointers on this.

Thanks!

#2

One option would be to just draw a circle using ofCircle and deform it with a vertex shader, something like the following might get you started:

  
  
uniform float currentAngle;  
  
void main( void )  
{  
	vec4 v = vec4( gl_Vertex.x, gl_Vertex.y, gl_Vertex.z, 1.0 );  
  
	v.x += cos( gl_Vertex.y+ currentAngle );  
	v.y += sin( gl_Vertex.z + currentAngle );  
	v.z += sin( gl_Vertex.x + currentAngle );  
  
	gl_Position = gl_ModelViewProjectionMatrix * v;  
  
	gl_TexCoord[0] = gl_MultiTexCoord0;  
	gl_FrontColor = gl_Color;  
}

There’s a ton of resources that might be more helpful if you search for “deformation shader”.

#3

Wow, This is great!

Thank You so much! :slight_smile:

#4

There is a very nice HTML5 example of something similar: http://hascanvas.com/blobby
It wouldn’t be too much porting it to c++ (the code becomes visible if you hover the white arrows on the left of the screen)

I’ve used this and modified it to add more blobs and have them interact with each other (which I guess wouldn’t be possible to do with a vertex shader)
here’s my example http://pcuret.com/the-eurozone-bubble/

You could probably get a nice bubble effect if they were transparent and floating upwards :slight_smile:

#5

These are really nice examples! Many Thanks!

Yes, I do not think it is possible to create an interaction between objects using a shader. I am pretty new on shaders so I am not quite sure though.

In a side note, how about creating a collection of resources on making special effects with OF? We can have categories like shaders, particles, meshes and such. :slight_smile:

Thanks once again!

#6

Though you can’t access other vertices in a vertex shader, you can model the results of an interaction using a shader by using attributes in your shader which allow you to set different values per vertex. It does require that you do collision and deformation at least in part on the CPU, but it means that you can keep all your display logic in the GPU.