JotForm Online Form Builder- An Essential Tool for Web Designers

Sunday, January 4, 2015

Designing and building a website takes a lot of work. To be successful you need those with design skills, and those who can do web development. An ideal team has people with the following skillsets:

Graphic Design

Front End Coding – HTML/CSS/JavaScript

Back End Coding – PHP (or similar)/SQL/SysAdmin

It’s no secret that some of the best websites have poorly regarded designs. Craigslist and Google’s home page come to mind. They are built with limited attention to visual appeal, and yet are among the most valuable properties on the web. In some cases functional utility trumps aesthetics.

But not all cases.

Websites are intrinsically visual. Before a user feels comfortable engaging in one’s service, sometimes they need visual assurance that this is a site they can relate to. Which is why web designers are in such high demand. Building the presentation is critical, and in some cases, is all a client really wants. Many companies need a website to be a billboard- an online brochure for their business. Backend skills can at times be minimally required. Frequently these are handled by using a framework or CMS, such as Laravel or WordPress.

This works, and client lists get lengthy, and people are happy. That is, until it comes to forms. Building an online form requires the full set of web development skills. You need front end developers to build the form itself, and backend developers to build the parts that collect submissions and process them. A typical submissions workflow entails sending an email notification, storing info in a database, or sending the results to a third party system such as a contact manager.

This is where front end developers shine the least, and any amount of visual appeal can’t make up for it. You need a backend developer to process one’s form submissions. A common workaround is to place an email address on the web page. In practical terms, forms drive up the cost of web design projects, and sometimes are cut.

Online form builders give web designers the ability to quickly manage the form building process. And you need one. Building forms is cumbersome and tedious, if not finicky and error prone. Online form builders turn form building into a simple and easy process. Today I’ll introduce JotForm, a leader in online form building.

There are two main ways to use JotForm.

For users that prefer to be hands on:

Build the form with the Form Builder.

Design the form with the Form Designer.

For users that favor using prefabricated forms and designs:

Find a template in the Form Templates Gallery.

Find a form design in the Form Theme Store.

They can all be used together. First you need to select all the fields that are needed for your form. For example, a contact form needs fields for name and email address. With JotForm’s Form Builder you can add these fields to your form, label them, and adjust the properties. Another way to accomplish the same thing is find a template that has a similar list of fields that you’d like, and use it as a base. Then within the form builder it can be fine tuned to one’s specific needs.

Once the fields of the form are defined, you then want your form design to match the rest of the site. This can be accomplished by using JotForm’s recently released Form Designer. This groundbreaking design tool allows you to quickly match the color, layout, and style of the site in which it will be embedded. It can be utilized in three ways:

The most commonly adjusted design properties can be done so on the design interface. Set background colors, spacing, fonts, and borders.

The CSS Helper is its largest innovation. By clicking on a field on the form it creates the CSS selector, and also presents a list of valid properties that can be adjusted. Select the one you want, then add a valid value. It takes the hard work out of writing CSS.

For seasoned designers, the CSS can be edited manually, providing full control.

For those who don’t want to design their form from scratch, they can visit the Theme Store and find a design they like. These are free, or can be purchased for a small fee. Once selected it can be added to your form, and further customized in the Form Designer as needed.

Within the Form builder one can also set up integrations with third party systems including SalesForce, Google Docs, and DropBox. Email notifications should also be set up, and can be conditionally optimized. If a user makes a request for just sales, it can be sent to the sales department, for instance.

Once designed and built, the form can be readily published into any web page using an embed code. Pick your favorite CMS or custom built web page, and add it in. A permanent standalone link is also available if you’d like to send it out via email or social networks.

Online form builders are a critical tool for web designers. They’re particularly useful for those who are more skilled with front end development, and don’t want the hassle of linking in the backend processing. JotForm provides a complete package in building one’s form. In particular, its recently released Form Designer gives web designers the ability to match any form to their designs.

Do you use an online form builder? Tell us about your experience in the comments.