5 ms·

Show HN: 3DTin - 3D modelling in browser

62 points by jayeshsalvi 16y ago

johnyzee 16y ago
That is awesome use of canvas. What is it for?
kevingadd 16y ago
It's nice to see that you can do stuff like this without plugins now thanks to Canvas and WebGL, even if the performance and stability aren't quite there yet. One particularly strange bug: Setting smoothness 'too high' (how high you can set it seems to depend on the number of cubes) causes random parts of the model to vanish. The responsiveness also leaves something to be desired, especially since it causes the browser/tab to freeze up - I thought it was supposed to be possible to use web workers to solve that problem, but I've yet to see a HTML5 app that actually uses them :(
- mwg66 16y ago
  No performance problems for me - Chrome, Mac OS X 10.6, MacBook Air.
- jayeshsalvi 16y ago
  3DTin does use Web Workers. However the smoothing algorithms generate too much data if there are lot of cubes and/or the smoothness is high, that makes the tab/browser unresponsive. The problem of vanished parts of the model at higher smoothness is a known one (happens when WebGL is the backend). I've further optimizations planned in the near future that should improve the performance gradually and fix the bugs like vanished parts. Stay tuned. Thanks for the feedback. -3DTin Developer
  - malkia 16y ago
    I think smoothing of ONE is just fine - Maybe you should just leave at that. Cool app :) - Lots to learn from it (using WebGL, etc.). Before looking in the source code - was something like marching cubes used for the smoothing?
    - jayeshsalvi 16y ago
      3DTin uses Catmull-Clark subdivision to create smooth surfaces. Details here: http://blog.3dtin.com/smoothing-or-subsurfacing http://blog.3dtin.com/smoothing-or-subsurfacing - 3DTin Developer
ph0rque 16y ago
Impressive! It seems to be 90% of an online 3D CAD app that I've envisioned and blogged about: http://hacking-shindyapin.tumblr.com/tagged/3dCAD http://hacking-shindyapin.tumblr.com/tagged/3dCAD. Any plans on making it open-source?
bajsejohannes 16y ago
Opera is not listed among the supported browsers, but everything I tried works fine (version 11.00). Did you forget it, or does it actually have show stopping bugs?
- aw3c2 16y ago
  I confirm this. Opera 11 on Linux (11.01 - 1160).
  - jayeshsalvi 16y ago
    Yes, it should work find in Opera too (except Opera doesn't support WebGL, so it will use Canvas 2D, hence will be comparatively slower). It's not on supported list, because I don't test on it regularly. -3DTin Developer
orls 16y ago
That's really very impressive, I can imagine coming back to this as a rapid-sketch tool in a way that I never could with SketchUp. One suggestion: To aid camera/scene navigation, you might want to consider hotkey + drag to temporarily flip into camera move modes, even when in draw mode; many desktop 3D/CAD tools offer this. I'd opt for ctrl/⌘+drag for rotate, and allow your existing shift+drag for panning to work in draw mode.
- jayeshsalvi 16y ago
  That's a good suggestion. Thanks. Not sure if hotkeys like WinKey or ⌘ can be detected in javascript, but ctrl+drag seems doable. -3DTin Developer
edna_piranha 16y ago
awesome. love it. it's almost like having lawnmower man right in the warmth of my home.
Xurinos 16y ago
I clicked the link, thinking, "Please be like Blender, please be like Blender". Then I clicked the link, found a cool voxel modeler, and was satisfied. To clarify... This is 3D modeling with voxels.
vanni 16y ago
Nice tool to make funny startup logos! :)
fuzzythinker 16y ago
Since you gave credit to even your operating system, the fact that that you leave out any canvas/webgl libraries probably means you didn't use any -- I'm superly impressed! Was thinking you may be using three.js or pre3d to get it working on both canvas & webgl. @everyone: Try it in webgl like in Chrome Canary or FF4, huge difference in performance and panning angle allowed.

62 points by jayeshsalvi 16y ago

That is awesome use of canvas. What is it for?

It's nice to see that you can do stuff like this without plugins now thanks to Canvas and WebGL, even if the performance and stability aren't quite there yet. One particularly strange bug: Setting smoothness 'too high' (how high you can set it seems to depend on the number of cubes) causes random parts of the model to vanish. The responsiveness also leaves something to be desired, especially since it causes the browser/tab to freeze up - I thought it was supposed to be possible to use web workers to solve that problem, but I've yet to see a HTML5 app that actually uses them :(

mwg66 16y ago
No performance problems for me - Chrome, Mac OS X 10.6, MacBook Air.
jayeshsalvi 16y ago
3DTin does use Web Workers. However the smoothing algorithms generate too much data if there are lot of cubes and/or the smoothness is high, that makes the tab/browser unresponsive. The problem of vanished parts of the model at higher smoothness is a known one (happens when WebGL is the backend). I've further optimizations planned in the near future that should improve the performance gradually and fix the bugs like vanished parts. Stay tuned. Thanks for the feedback. -3DTin Developer
- malkia 16y ago
  I think smoothing of ONE is just fine - Maybe you should just leave at that. Cool app :) - Lots to learn from it (using WebGL, etc.). Before looking in the source code - was something like marching cubes used for the smoothing?
  - jayeshsalvi 16y ago
    3DTin uses Catmull-Clark subdivision to create smooth surfaces. Details here: http://blog.3dtin.com/smoothing-or-subsurfacing http://blog.3dtin.com/smoothing-or-subsurfacing - 3DTin Developer

ph0rque 16y ago

Impressive! It seems to be 90% of an online 3D CAD app that I've envisioned and blogged about: http://hacking-shindyapin.tumblr.com/tagged/3dCAD http://hacking-shindyapin.tumblr.com/tagged/3dCAD. Any plans on making it open-source?

bajsejohannes 16y ago

Opera is not listed among the supported browsers, but everything I tried works fine (version 11.00). Did you forget it, or does it actually have show stopping bugs?

aw3c2 16y ago
I confirm this. Opera 11 on Linux (11.01 - 1160).
- jayeshsalvi 16y ago
  Yes, it should work find in Opera too (except Opera doesn't support WebGL, so it will use Canvas 2D, hence will be comparatively slower). It's not on supported list, because I don't test on it regularly. -3DTin Developer

orls 16y ago

That's really very impressive, I can imagine coming back to this as a rapid-sketch tool in a way that I never could with SketchUp. One suggestion: To aid camera/scene navigation, you might want to consider hotkey + drag to temporarily flip into camera move modes, even when in draw mode; many desktop 3D/CAD tools offer this. I'd opt for ctrl/⌘+drag for rotate, and allow your existing shift+drag for panning to work in draw mode.

jayeshsalvi 16y ago
That's a good suggestion. Thanks. Not sure if hotkeys like WinKey or ⌘ can be detected in javascript, but ctrl+drag seems doable. -3DTin Developer

edna_piranha 16y ago

awesome. love it. it's almost like having lawnmower man right in the warmth of my home.

Xurinos 16y ago

I clicked the link, thinking, "Please be like Blender, please be like Blender". Then I clicked the link, found a cool voxel modeler, and was satisfied. To clarify... This is 3D modeling with voxels.

vanni 16y ago

Nice tool to make funny startup logos! :)

fuzzythinker 16y ago

Since you gave credit to even your operating system, the fact that that you leave out any canvas/webgl libraries probably means you didn't use any -- I'm superly impressed! Was thinking you may be using three.js or pre3d to get it working on both canvas & webgl. @everyone: Try it in webgl like in Chrome Canary or FF4, huge difference in performance and panning angle allowed.