3D Bézier curve editor

Timo Suoranta created a 3D Bézier curve editor. As of this writing, the program runs on Windows and requires OpenGL version 3 or later (shaders are involved). Here’s a screenshot:

Bezier curve editor
[click for larger image]

It looks awesome. What, no? Then you have to understand picking. In 2D, any point you click on the screen is exact. The point you click on is the point selected.

In 3D, it’s different. There are an infinite number of planes behind that virtual screen you picked on. Think of looking up at the clouds in the sky. You know the water droplets are scattered sparsely and densely in the sky. You know they are in a 3D space. But you, looking up at the sky, only see one plane, the 2D plane that has the water droplets rendered onto.

In this case, it’s simpler. We are only concerned with the points on the Bézier curve itself. Timo used the closest point to the clicked point on the screen as the chosen point. Basically you “shoot” a ray from the clicked point into the vanishing point in the far distance (far far far distance, as in infinity far). When your ray hits the Bézier curve, that’s the chosen point. You can find out more about the method by searching on the Internet for “3d picking” or something similar.

So how do you edit a point once it’s chosen? Timo solved it by using 3 cones to represent the X, Y and Z axes. Dragging on the cones move the point along the respective direction of the axis. Notice the 3 cones at the right side.

Bezier curve editor with axes
[click for larger image]

I believe most 3D rendering software use something similar to edit points.

Now notice the small details Timo added:

  • The floor is a checker board to illustrate the notion of space
  • The vertical lines drawn from the points on the curve to the checker board to show the spatial relation
  • If you hover over the big blue spheres, the checker board, or the curve itself, they glow pulse-like

Wait, you haven’t downloaded the program? Here’s the link.

Trigonometric Particles

So I dredged up a relic program from some folder that’s been unopened for ages. I was like, “I wrote that?” I was playing with the program, and thought “Hey, why don’t I make a video?”. So here’s “Trigonometric Particles” video:


Trigonometric Particles from Vincent Tan on Vimeo.

Special thanks to Ben for letting me use one of his songs “Bobsleigh” as the background music. He’s awesome. I love the quick tempo, which matches the non-stop streaming of particles.

The program uses OpenGL for 3D rendering, and I used the SDL library to help. Basically, I visualised each axis as a function. So the X axis is say, a sine function. With some creativity, I can form cylinders, cones and spheres with the 3 axes.

I submitted the program to NeHe Productions, an OpenGL site related to game programming. The submission is placed under P of the download section. I learnt a lot from the site such as general 3D skills and OpenGL tricks.

You can download the program here too (216 KB). The website address and email address in the zip file are no longer in use. It’s been 5 years since… or was it 6 years?

I’ll talk more about the mechanics soon. And yeah, I lost the source code (darn it!), so I’ll be speaking from memory. For now, just enjoy the video. If you’re hardcore, you can try dissecting the mechanics yourself. Hint: There’s an additional W axis. Hint: Composite functions are involved. Post your findings in the comments, and we’ll see how you did.

Trapped aeroplane video

This is my first video production, a demo of a trapped paper aeroplane (hosted by Vimeo). Yay! It’s a demo of an SDL (Simple DirectMedia Layer)/OpenGL project I made as a result of a university programming assignment.

The original assignment was in wireframe and in black and white (no colours). I added textures and a revolving sky background for colour. Besides, the explosion effect looks cooler with a fiery texture. Oh, I didn’t mention the explosion effect? *smile*

Unfortunately, I lost the source code. Aarrrgghhh…

Anyway, here’s where you can download the demo. Download Trapped Aeroplane [ZIP file, 380 KB]. Maybe I’ll rewrite it… XNA and C#? We’ll see. Have fun!