Recently I had a discussion with Aly, our UX Architect, about what is the “perfect” form. Usually we work on specific UX improvements but this time we had managed to dive in theory. Our discussion was about what today is considered “Perfect Web Form” and is it really.

While we have PDF Share Forms software that helps thousands of organizations to implement complex forms easily, we have never set a goal of offering “perfect forms”.

So, what is “perfect web form”?

Shortly, our UX Architect believes that “perfect form” is a form that user opens quickly, checks our all prefilled values and just confirms that everything is correct.

“THE perfect form is no form at all”, Aly Mitsuk, UX Architect

Meaning, if we assume that a user just confirms values, then no fields are necessary. Utopia, isn’t it!?!

One thing is for sure: conventional articles about “perfect web forms” focus only on gradual improvements…

Conventional “Perfect Web Form” True Perfect Web Form
  • Responsive Design
  • Strong header with benefit line to explain what users should do
  • Add hints to form fields
  • CTA/Submit button should be easy to click
  • Opens quickly
  • All values are pre-filled
  • User just confirms data with one click

Perfect Webforms - sceptical

Let’s just say that I was not accepting such utopian idea lightly. The hard part of my discussion with Aly was an inner tendency to see all aspects of her ideas as some gradual improvements of PDF Share Forms. In a way, it is like a medical doctor who always see a medical disorder of the person he converses with – even if it is a conversation with acquaintances. It is hard to compartmentalize internal “what you know” with imaginary concepts, so in my case, I was struggling to apply “perfect” to PDF Share Forms. Thinking about limitations of web technologies, specifications, and other down-to-earth aspects were hindering to be open minded.

Having a passionate colleague pays off

PDF Share Forms is a lucky company as everyone is very passionate about what they do. Literally. Nobody lets others be complacent in PDF Share Forms. We argue, we defend our ideas, and then once decided, we all pull the maximum weight to make it happen. The same way, our UX architect sets end user experience above everything else. She fights for what she believes in. And so, we have debated what it would take to make truly perfect web form.

Starting with basics

Let’s start with basics. There are many ways to pre-populate data into the fields. It is probably the most obvious and commonly implemented approach improve UX of form filling. PDF Share Forms can query SharePoint lists or external services to populate various fields or option values of the dropdown fields. And yet, “data pre-population” only covers the tip of the iceberg we defined as “perfect forms”.

So, if we break “perfect” forms into technical specifics we identify several patterns/ideas: some easy to implement and others – a borderline futuristic.

“How many times do I have to enter my name?”

I think all of us can relay to this frustration. I am still “John” or “Dmitry” no matter what form I fill in. And yet, I have to enter my name several times a day.

Yes, implementing user authentication (logged in) can formalize this type of data gathering. In the same time, if Amazon knows me before requiring me to logging, then perfect form will know my name before I have to commit to “logged in”.

Today, we already see UX improvements on the browsers level. Most modern browsers offer autofill capabilities based on your previous answers and HTML field name.

Another approach here can be a mix of browser cookies and smart anticipation. Just to throw a couple of ideas here:

  1. If user answers “No” to the question “I am using a public computer”, then we can persist user entries in the browser cookie. Later we can use those preserved values to populate similar fields with ease.
  2. We can go even a step farther by considering a device user is using. If I fill-in a web form and my device is identified as iPhone, it is a fair assumption that it is a personal device and using cookies should be beneficial.

Perfect Webforms - iphone javascript

Note: yes, there are many scenarios when a mobile phone can be a shared device but the point here is to show that forms can be smarter than just “login to reuse your data”.

Address and geolocation

Field “address” can be mean different things: billing address where my credit card bills go to, mailing address, business address, current address. Some of types of address (billing, mailing) are similar to my name – they rarely change for a given user. Current address (as if “from here”) though can be easily auto-populated by geolocation information. Not only mobile devices but also modern browsers in the workstations are pretty good in determining user’s current location. If it populates most of the address fields (city, state, postal code, county), we will get a way close to perfect.

Perfect Webforms - ZIP code geolocation

Another approach you probably saw when postal code field is placed first. Once it is entered, all other data (city, state, country) is auto populated.

Use and determine data without login

Working with Microsoft SharePoint / Office 365, we always differentiate users as logged in versus anonymous public users. It is a common binary pattern: not logged in and logged in. Aly reminded me about a great presentation “Insecure & Unintuitive: How We Need to Fix the UX of Security” by Jared Spool (watch it here).

Perfect Webforms - UX security

If you want to improve security UX for your software product, then I highly recommend Jarod’s presentation. The point in our context is that perfect form must strive for a balance between unknown/anonymous public user and fully logged in user.

Consolidation of fields

Sometimes we feel that capturing data in a more granular way will allow better data validation and better user experience. For example, a form is presented with a date field as 3 separate fields: day, month, year. There are some patterns to make UX better for such scenarios. One of such known patterns is auto transition to next field when you type sufficient amount of characters. For example, you type “10” in “Day” field and focus automatically transitions to field “Month” as field day cannot be more than 2 characters. This would be a very conventional approach to “perfecting web form”.

The problem is that more granular data gathering leads to more fields, more fields lead to more complex layout, more complex layout rarely lead to better UX. And working with PDF forms, we are masters of handling complex forms .

The example with 3 fields “Day”, “Month”, “Year” may look cool in the browser of the workstation, but it is far from perfect on mobile devices. Using a device natural input control is a way more preferable way to select the date.

Perfect Webforms - date field

Let’s review an example of “Name” field as well. From standpoint of metadata we may want to capture first name, middle initials, and last name. However, from the standpoint of the end-user, I am just “John K. Smith” (see above about “How many times do I have to enter my name?”). Especially if we can pre-populate name, why don’t we just show “John K. Smith” as a text and if the person wants to change it, then allow to enter specific first name, middle initial, and last name.

Perfect Webforms - name field

The illustration above forces user to click on the name to change it. However, if we pre-populate the value, we should feel very comfortable that it will happen rarely. One more step toward the perfect form.

Taking suggestions to the next level

Now, let’s talk about all other fields on the form. Many textual field controls that populate complex forms … and not so complex forms also. I always imagine myself sitting in the doctor’s office with those insane medical forms you have to fill-in before you see your doctor. Sometimes I get a feeling that number of those questions exist for a sole purpose to reduce number of patient visits.

My favorite part comes when you need to fill-in “what medication do you take now”. In a perfect world, I would be also a pharmacist to remember all pharmacological names. In the perfect form of unperfected world, form field would have auto-suggestion based on what a “regular” patient know.

Perfect Webforms - smart field suggestion

user can type “cough…” and auto-suggestion will offer a list of most common medication for cough medication.

Another example would be “most-commonly used values”. Of course, in B2B scope, you need to be careful so you don’t expose values you don’t want to “auto-suggest”. Still, sources for suggestion can be goggle data api or your internal lists.

Say Something

Finally, we can consider free text fields, “describe what you want from us” type of fields. Yes, we need to account for flexibility in user’s input. Of course, we can just preserve an old-fashioned multiline text field. Or we can drive for perfect and consider the following alternative:

Allow to capture voice, auto-transcribe it, and offer an intuitive interface to correct spelling mistakes. This approach is not only a human preferable but also UX friendlier on mobile devices where typing can be cumbersome sometimes.

Perfect Webforms - audio capture

Power of AI and ML

A lot of we have discussed can be implemented even better with help of the Machine Learning algorithms and AI in general. ML can make forms smarted by applying classification models to data pre-population in very complex scenarios.

Conclusion: Perfecting Forms in PDF Share Forms

There are many other great patterns exists to make web forms better: floating labels, instant notifications, etc. Without trying to minimize benefits of those advices we don’t want to succumb back to conventional “perfect form”. True perfect form is no form at all.

All aspects mentioned in this article is something we would love to have in PDF Share Forms. Some of them are in the product roadmap, others may get there one day.

Original idea of PDF Share Forms was to change a culture of creating web forms: stop building forms over and over – reuse existing forms easily. That ground-breaking approach allows many of our customers just take existing PDF forms and start using them as web forms in minutes.

Now, maybe we should do the same disruption with perfect web forms…