The new UI unifies all the tools Mozilla has added over the past year

Dec 17, 2012 15:11 GMT  ·  By

Firefox is getting completely revamped developer tools, the new UI is already in the Nightly channel for you to test. It's a complete rewrite of the interface and, as such, not all features may be included or working just yet. By the time it's done, the new UI should be at least on par with the old one.

The idea behind the revamp is to bring all of the tools together. For more than a year, Mozilla has been building new developer tools into Firefox. Every time a new feature was added, some new UI was stitched on.

This quickly became unwieldy and the need for a new look to incorporate all the tools became obvious. This new look is now enabled by default in the Nightly Firefox 20 builds.

The one thing to notice is that there's now only one panel, at the bottom. All of the tools are now included in that one panel, with the Inspector selected by default.

You can then switch between the Web Console, the Debugger, the Style Editor and the Profiler via the tabs. You can also open the tools in a new window, for better control.

The 3D view, the Scratch Pad and the Responsive Design mode are also accessible via buttons. Overall, the new look is much more reminiscent of Chrome's dev tools, which is hardly a bad thing as the Chrome/WebKit dev tools remain the gold standard.

Mozilla's set of tools has been evolving fast and, while not as comprehensive or as solid as Chrome's, there are actually a few tools not available in Chrome, particularly the last three mentioned, the 3D view, the Scratch Pad and the Responsive Design tool.

In the meantime, Mozilla needs developers testing the revamped tool and filing bug reports to be able to ship the new version with Firefox 20.