I started working on 3DTin in first week of April. I always wanted to learn 3D graphics programming, but never had a project idea that I liked to pursue. (I like games, but have no talent to write one). With the evolving scene of 3D in browser, I started exploring the possibilities. With my interest in engineering the idea of 3D model editor that runs inside the browser struck me. It almost seemed impossible at the time, especially because I had never done OpenGL programming before.
I was initially suspicious that it may not be possible, given that WebGL is the implementation of OpenGL ES and not the full fledged OpenGL API that desktop 3D model editors have access to. But after I spent some time understanding OpenGL ES basics, I found that even though ES API is a subset of traditional OpenGL, it can do most of the things that full OpenGL can. It is difficult to do some tasks in ES, but they are possible nonetheless. Of course, there are tons of things that I don’t know yet about OpenGL, but I guess that’s the challenge. However so far I found the geometric algorithms more challenging than the OpenGL issues.
Along the way I found some really useful books on OpenGL ES and on Geometry for computer graphics. Looking into Blender source code also helped a little. Within no time the project started taking shape.
As of today, I have a working version that can draw basic geometric shapes. The workflow is very basic right now. There is a set of pre-defined geometries. You can access them by clicking on the ‘+’ button. They include 2D shapes like Triangle, Square, Circle and 3D shapes like Cube, Cylinder, Sphere, Cone. Once you have added instances of these geometries in your drawing, you can play with them as you like. You can move, scale, rotate them. If you want to change their shape, just hit TAB to enter the edit mode. Here you can click on individual faces, edges or vertices and move them around to create new shapes. You can also use the Extrude tool (keyboard shortcut ‘e’), to extend the faces of these geometries. You can color these shapes using the color tool. You can color individual faces or entire geometries (pressing ‘Shift’).
The default drawing that loads when you visit the site first time gives an idea of what can be done so far.
The drawings you work on can be saved in cloud. You just need to login with your Google account to do that.
Last week I deployed 3DTin on Google app engine and announced it on WebGL dev list. Everyone is welcome to try it out and provide your feedback.
As you can tell, this is just a beginning. Official out-of-the-box support for WebGL in leading browsers is still months away. So this is your chance to become the founding users of 3DTin. 🙂
I will use this blog to post the development progress and other announcements regarding 3DTin. Subscribe to get the latest news. You can also @reply me on twitter @jyro.
I want to use shaders to use in WebGL and specifically three.js. Is there a specific version of GLSL that WebGL and three.js uses?