VoodooJS – Mix 2D and 3D content on the same page

http://www.voodoojs.com

by chrislloyd • 13 years ago

60 21 13 years ago

The tree looks cool. If this catches on I might finally buy a 3d monitor just to browse the web ;)

ma2rten• 13 years ago

It really does look cool. I could really imagine that this would catch on. It's gimmickry, but unlike almost any other 3D effect on a webpage, it's not annoying.

islon• 13 years ago

The main page eats all my GPU to the point it's almost impossible to scroll (macbook air 2013). Shouldn't take so much resources for such a simple page.

antr• 13 years ago

I'm on a MBP early 2011 + Chrome, and have no issues

cupofjoakim2• 13 years ago

Dude, I'm on that hardware as well and I'm having no trouble?

dubcanada• 13 years ago

I'm on a very old 2008 Macbook and it is perfectly fine for me.

zachlatta• 13 years ago

I'm on a Macbook Air 2013 and have no issue. Currently using Chrome.

ArekDymalski• 13 years ago

Very impressive and inspiring to think about new possibilities: games, interfaces, data visualizations ... And works fine on my netbook. Now there's hope that we won't be dominated by flat design ;)

cupofjoakim2• 13 years ago

Such a great name. To me as a front-end dev, this truly is black magic.

iMark• 13 years ago

This reminds of the emphasis Apple is putting on depth in iOS 7 interface.

Lots of interesting things to be done with this sort of tech.

splatcollision• 13 years ago

This is great work. An earlier demo page from the same author is at http://www.threedeeify.com/ (VoodooJS is a much better name)

Looks like the 3d layers are running in full-page canvas overlays and the Three.js camera is positioned according to the page scroll. Clever work! Must have some kind of positioning logic to match up the models to DOM elements (like the ring around the quote)

Wish it was not closed-source, so we could learn from it a bit, or contribute. But author is free to do with it what he wishes...

SnowProblem5• 13 years ago

Essentially yes. There's also some tweaking the CSS pointer-events property on those canvases to allow mouse events to fall through when you're not hovered over 3D content.

I envision most people will want to position their 3D objects relative to some 2D element like a div.

SnowProblem5• 13 years ago

Author here. Thanks everyone. It's all still a work in progress and I'm listening to everyone's feedback.

foxbarrington• 13 years ago

"U.S. Patent Pending." -- wasn't expecting to see that on a JS lib.

bpierre2• 13 years ago

Yes, especially coming from a library built on top of three.js [1], which is a gigantic and awesome piece of work licensed under MIT, using Twitter Bootstrap (Apache License), and a logo free for non commercial use only [2]. But everyone can do what he wants with his work, as long as licenses are respected.

A question for the author: this is a really cool demo, but I can’t see where is the innovation which needs protection here? A parallax effect when the user scrolls? 3D on a Web page? The “Next Generation Internet” concept?

[1] http://threejs.org/

[2] http://findicons.com/icon/33154/mask_02?id=33154

skore2• 13 years ago

The patent thing, the licensing uncertainty, the use of public libraries and the somewhat overly enthusiastic comments here on HN (most from <300 accounts) give me a very weird taste in my mouth.

VoodooJS – Mix 2D and 3D content on the same page

Related Stories