somewhere to talk about random ideas and projects like everyone else

stuff

#3D

Digital Sculpting with Three.JS 23 November 2010

The above testament to my artistic ability, or specifically my lack thereof, was made in my experiment with digital sculpting, technically, part II. Wikipedia says

Digital sculpting is the use of software that offers tools to push, pull, smooth, grab, pinch or otherwise manipulate a digital object as if it were made of a real-life substance such as clay. I saw this Lifehacker article on sculptris a few months ago and it sort of made an impression on me of how cool and awesome 3d was. Any real program is of course much different and better than this one because of the ability to actually grab, smooth and pinch the digital object.


3D Sculpting Tool 08 September 2010

So for the past few days, I discovered this neat app called Sculptris. It’s this amazing digital sculpting app where your canvas is basically a blob of virtual clay that can be molded into any shape with any level of detail. It’s windows-only, and I thought it would be neat to have something like it that works in the browser. First I thought of using WebGL, but trying to start chromium with webgl always ends up with a GLXFBConfig error, and on Firefox, it’s stuck with using libosmesa which gives absolutely terrible framerates (IDK why but Fx4 crawls on my computer. Panorama is so slow it lags from simple dragging). Eventually, I ended up basing it off my js1k function plotter, because it’s a fairly simple 3d renderer.

The pictures on the top of the page are of the death star and alderaan, respectively, mostly because planets (and moons that aren’t moons) are mostly spherical and explosions and light rays are pretty much the only things that this app is suitable for at these stages.

So how does it work? It’s actually really simple, and probably too simple. At ~300 LOC of pretty trivial JS, it’s not much at all (though it is hideous, I must warn you). It is based on my js1k entry, and I considered making this a 1k submission, but I gave up and said I couldn’t. It starts off simple enough, do lots of freaky trigonometric loops to generate a set of points that lie on a sphere. Then loop through every 50 milliseconds, apply a 3d transformation, get points that lie within a radius of the mouse position and reference them in the selected array. Then you segregate the selected array into the foreground and background, find the arithmetic mean of the fg and bg, respectively and find the difference. Then I convert it to spherical coordinates and get rid of the ratio to ignore the magnitude of the vector and add it to the position of foreground points. Then loop through all the points and wherever there’s a long distance, insert a new dot at the midpoint.

For no apparent reason I decided not to put many words on it. I was actually reluctant to add “points” and “undo”, but it’s fine print in faded color that doesn’t help the user at all.

  • Middle Click + Drag to rotate (in 3d)
  • Right Drag to deflate the shape
  • Left Drag to inflate the shape
  • Middle Scroll to zoom in/out
  • The slider bar is for controlling the size of the selection.
  • The checkbox enables/disables Undo/Redo (via CtrlZ/CtrlY or CtrlZ/Ctrl+Shift+Z). App: http://antimatter15.github.com/3d-sculpt/3d.html

Mirrored Version: http://antimatter15.github.com/3d-sculpt/mirror.html

(Not as in the other meaning for mirror, but it actually reflects the X axis so that it’s symmetrical, which is a neat feature in sculptris)

Github: http://github.com/antimatter15/3d-sculpt


1k JS 3d Function Plotter 06 August 2010

Interestingly, it does seem that a lot of the demos for the js1k competition are a whole lot more impressive than the 10k competition. Despite that js1k started with no prizes and 10k has a collective $10,000 worth of prizes. Though I do have several entries on both. Anyway, this is the continuation of my old 3d function plotter, but that one doesn’t work anymore because i’m evil and hotlinked the github repo and three.js updated in an api-breaking way.

Anyway, after you vote up http://10k.aneventapart.com/Entry/46 and http://10k.aneventapart.com/Entry/18 you should totally try out my 3d function plotter at http://js1k.com/demo/62


Simple Javascript 3D Function Plotter 04 May 2010

 sin(sqrt(sq(x)+sq(y)))/sqrt(sq(x)+sq(y))

http://antimatter15.com/misc/f(x).html?sin(sqrt(sq(x)+sq(y)))/5.html?sin(sqrt(sq(x)+sq(y)))/5 )

http://antimatter15.com/misc/f(x).html?sin(sqrt(sq(x)+sq(y)))/sqrt(sq(x)+sq(y)).html?sin(sqrt(sq(x)+sq(y)))/sqrt(sq(x)+sq(y)) )

I think function plotters are cool, and since 3d is all the hype nowadays, why not make a 3d function plotter? I like how WolframAlpha does it quite nicely, but it doesn’t allow panning/moving of the camera. Just as a disclaimer, I made this because it’s cool, not because I spent lots of time on it, on the contrary, it’s taken from the three.js 3D Canvas library floor demo with a 3 line change to make it pull a function from the URL.


LED Inverse Shutter Glasses 03 January 2010

On New Years Eve, I saw the awesome movie Avatar in IMAX 3D. I noticed how there were 2 projectors (which I knew before, but seeing it is different). I started thinking about how to make 3D work better, and one of the first ideas I had was to use a polarized wheel, sort of like the fast-moving color wheels that are used in single-DMD DLP technology, but with only two states of two different polarizations. Put that over a single projector, and use the normal relatively cheap polarized glasses! After looking into it, I learned that RealD uses basically the same technology (except they have a solid state switcher thingy rather than a color wheel, which I would assume is some superior technology). So I started thinking again, and came up with “LED Inverse Shutter Glasses”, which I’m nowhere near as certain about working.

LCD Shutter Glasses work by “blindfolding” one eye at a time, allowing a frame from the monitor/tv to be visible by that one eye, and alternating. This allows a different image to be sent to each eye, which our brains can assemble into a 3d image.

The shutter glasses are pretty expensive though (well, in my eyes (pun not intended) its insanely expensive), ranging from $100 to $200 or more.

How about inverse shutter glasses (which is a term I made up)? What if instead of darkening one eye, you add light through a side-mounted white LED? Radioshack sells White LEDs for $3 each (and probably you can get it cheaper elsewhere). OLEDs are apparently awesome because of their insanely low response times which are as low as 0.01ms compared to the 2ms LCDs (according to Wikipedia), and I would assume that LEDs are similar (Anything under 8ms, or 120fps should work).

I have no idea if it would work, and obviously it won’t work nearly as well as the LCD ones. Surely it would probably be pretty annoying to have light shine in your eyes, though I would hope its not that annoying. I’m not sure how it would work either, would it make your pupils shrink, and would your eye detect the un-brightened frame as dark? Or would the LED make everything white and everything hard to see, and be the equivalent of darkening everything away? Would this vary from person to person and setup-to-setup?