Well, it looks like your a webpage threw up multiple levels of structured data in your browser. Wonderful 3-dimensional throw up. Mozilla Firefox version 11 is out and with it a new developer tool that allows you to view a website’s Document Object Model (DOM) in the beauty of three dimensions. Fancy a look?

Firfox 3D DOM Viewer

The 3D visulization tool is part of the Developer Tools accessed from the main Firefox menu (Firefox, Web Developer, Inpsect). Once you select ‘Inspect’ you’ll see the option in the lower right-hand corner to toggle the 3D view of the website or you can use the keybord shortcut Alt-M to make it appear. It uses WebGL, a standards-based JavaScript API allowing rendering of 3D objects in an HTML Canvas element, to pull the underlying data stacks into view and provide the panning, zooming and rotation of the site’s hierarchy. It’s a great example of how it can be used for data visualization but even more for how website interaction can be provide client-side though the technology.

The Smack

The idea with is that by providing the 3D visualization, web developers can see how complicated the structure of a website is and make changes to simplify accordingly. So, why couldn’t the same be done for 3D models? (Granted you’re using a history-based, hierarchical modeling system.) Thing is, if we’re the ones creating the models, we know how complicated they are and could (likely) care less. But make this a model generated online by xml/css and you’ve got 3D visualization of your 3D visualization.

Firefox 11 via Mohamed Mansour. Thanks Ion!


Josh is founder and editor at SolidSmack.com, founder at Aimsift Inc., and co-founder of EvD Media. He is involved in engineering, design, visualization, the technology making it happen, and the content developed around it. He is a SolidWorks Certified Professional and excels at falling awkwardly.