Ninja Forms 3.0 Released, Features New Drag-and-Drop Form Builder

Ninja Forms 3.0 was released today after a year in development. WP Ninjas have completely rewritten the plugin using Backbone, Underscore, and Marionette, an undertaking that required the bulk of development time for this milestone. This architectural overhaul brings major improvements to the user experience.

The most visible improvements can be seen in the form building screen, where the process of editing or setting up a new form has been completely re-imagined with a drag-and-drop interface.

“We decided to go with a fully-headless JS UI for Ninja Forms about three years ago, when we first threw around the idea of a re-write,” said WP Ninjas co-founder James Laws. “We wanted to create something more modular, easier to extend, and simpler to troubleshoot.”

Laws said that the new Ninja Forms codebase is an application that consumes and returns JSON data. As such, the team is no longer tied to PHP for form building or display and templates are now pure HTML, freeing developers and designers from having to sort through the processing code in order to modify how forms look.

“A few months after we began our re-write, Matt gave his famous ‘Learn Javascript Deeply’ homework at WordCamp US,” Laws said. “We were ecstatic. He seemed to validate everything we had assumed about the future of WordPress and consuming and creating WordPress data.

“Ninja Forms 3 is our foray into that world, a world in which we can display our builder anywhere on a user’s site, power our plugin with the REST API, and give our users experiences that the default WordPress admin just doesn’t offer. We’re really excited to be one of the first plugins with a user-base of our size to take the JS-first plunge.”

Laws said WP Ninjas decided to use Backbone because it comes with WordPress core. They use Marionette to simplify the process of making nested views and applications on top of Backbone.

“The switch to JS was definitely the hardest part of the development process,” Laws said. “All of our developers are PHP developers by trade, so our CTO, Kevin, undertook the task of teaching himself how to create what we wanted in JS. It has taken about a year, but we now have a few developers on the team who are fairly fluent in JavaScript.”

In addition to the new drag-and-drop form builder UI, Ninja Forms 3.0 introduces pricing fields (product, quantity, shipping, and total) to help users sell products and services. The release also streamlines form settings and adds the ability to sandbox forms for editing on the fly without impacting visitors.

Version 3.0 ships with a one-click rollback button for users to revert to Ninja Forms 2.9.x after updating, in case of any problems with add-ons or custom code. The plugin includes the codebase for both versions in order to mitigate issues with backwards compatibility.

The latest version also ships with support for 29 different languages, whereas previous 2.x versions had support for only 8 languages at 50% or more string coverage. As Ninja Forms comes pre-installed on GoDaddy hosting, the company donated the translations in order to offer their hosting customers better language coverage. Laws said WP Ninjas is testing partnerships with other hosting companies as well but cannot disclose them at this time.

Ninja Forms is active on more than 600,000 WordPress installs and Laws said the company has been hovering at the $60-80K monthly revenue mark for its extensions.

“This year we didn’t increase revenue that much and that is mostly because we did zero marketing and didn’t release that much new for an entire year,” he said. “We were just too focused on 3.0. Obviously, when you neglect one or both of those, sales will slow.” The company’s founders are anticipating an increase in sales as they prioritize marketing “for the first time ever.”

“We’re convinced that 3.0 is the absolute best plugin experience, at the very least from a form building perspective,” Laws said. “We think if we get ourselves out there, users will take notice.”