Point Cloud Sandbox


UPDATE – 19 APRIL 2019

As you may noticed, I worked on Point Cloud Sandbox these last weeks to add an export feature, as requested by some CGI fellows.

I did it. The behavior is quite good and you can export interesting deformed pointclouds into Houdini (or other softwares) and do some nice rendering. You can now test this export feature by yourself at http://pointcloudsandbox.cornflex.org.

Otherwise it’s time to port the old WebApp to another level. Indeed, I quickly wanted to be able to export PLY sequences at high framerate to get it animated in Houdini. I managed to do it from the browser but I quickly run into memory problems and browser limitations. I was only able to get short sequences with a very low framerate.

That’s why I dediced to port all this native OpenGL 2.x code to Unity and take profit from the power of DirectX11 and its compute shaders. I still have a lot to do but I can now record very large sequences with a decent framerate… and export it very quickly on the hard drive.

I found a way to transfert UV coords into PLY file. I’m now able to shade the remeshed pointcloud with PBR textures!

A few additional experiments:

Personal Project based on this tool:

UPDATE – 16 JUNE 2017

Finally released: http://pointcloudsandbox.cornflex.org


I got some time to optimize my FBO engine and expose a few parameters to UI controls.
The user can now upload a OBJ or PLY file, apply tessellation iterations to add more vertices to the cloud, play with it by using a brush tool, take snapshots or freeze the velocities and gravity, … I think it’s almost ready for a first public release.

And here is my Simulation Fragment Shader:


UPDATE – 21 JULY 2016

At last, my native WebGL particles now support (classic) shadow maps and phong lighting is fully integrated with ThreeJS pipeline according a point sprites technique with generated depth.
Another Live Demo is coming but I need to provide some additional parameters and propose a fresh GUI… but here is another preview:


I wrote Particle Systems in many different environments. This time, I port my experiences on a web page through WebGL and Javascript.

To start with this, I looked for examples and I found quite a lot with different approaches but I was not happy with the functionalities and the structure of source code. That’s why I wrote a new FBO oriented system from scratch to get access to the GL_DRAW_BUFFER extension in a proper way. With this GL extension I’m able to output in more than one texture from the fragment shader and handle more data in a GP-GPU way, with position maps, velocity maps, extra-parameter maps, …

To illustrate this approach, I created a model of myself using a Kinect 2 device to get a PLY file with encoded vertex colors. Then I use ThreeJS to load and parse the PLY file. I create data textures to store 32bit values of these vertex positions, velocities, colors and other parameters like distances from the mouse, sizes, … To process these data, I use an old texture swapping technique as input/output of my framebuffer because WebGL (OpenGL ES 2.0) has no computation feature like OpenCL or DirectCompute (more here).

I also made a complete integration of this FBO particle system with the ThreeJS lighting pipeline.

The particles can be rendered as spherical billboards with generated normals and depth. Later, I’ll try to get a Lagrangian render of these particles (like the one I made in unity, here).

Now, I’m working on PSM (Particle Shadow Map) (more here).

The source code is not fully cleaned yet but I’ll try to push a live demo online soon.
Here is a short video preview running in Google Chrome.

QPoint Cloud Sandbox


Join the conversation
  • Avatar

    Jean Claude Robert - May 5, 2016 reply

    Super Nice as usual ! And Nils Frahm for the bgr-music perfect match 🙂

  • Avatar

    jnt - July 29, 2016 reply


  • Avatar

    Beats Away - January 8, 2017 reply

    you are amazing. your work of particle visualization+customization is the best on youtube. i.e. the world. Looking forward to learn more about your fbo library!

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.