Here to Help: How to Optimize Your Form for Mobile Submission

Written by Jessica Haas on October 12, 2016

Posted in Here to Help, Mobile Forms

“Here to Help” is a support column written especially for Formstack’s awesome, loyal customers.

Does this sound familiar?

You’re on your phone and discover an event you want to attend. You scroll down to the form on the page, and it’s…tiny. Miniscule. You zoom in to see what it’s telling you to fill out, but then you have to zoom out again because you can’t read the entire first question. After five minutes of this, you finally tap the Submit button, exasperated (if you didn’t decide to give up and leave the page entirely, of course).

We’ve all been through this, and it happens far too often. Mobile browsing now exceeds desktop browsing, so it’s more important than ever to ensure that the online experiences your organization creates are mobile-friendly. And this includes creating mobile forms.

At Formstack, all of our forms are mobile-ready out of the box. But there are a few additional tricks you can use to create an enjoyable form experience for mobile visitors.

Here are 3 form features you can use to optimize your mobile forms:

1. Conditional Logic

Conditional Logic is a feature that lets you show or hide questions based on someone’s previous answers. It’s a great way to personalize your mobile forms and make the submission process faster and easier for mobile users. There are many different ways to set up Conditional Logic. You can use it to hide irrelevant questions on surveys, open up new questions related to someone’s product purchases on an order form, and even create customized messages that lead people to other products or services. The possibilities are truly endless.

To add Conditional Logic to your mobile forms, follow these steps:

mobile forms for business using conditional logic

  1. In the form builder, click on a field of your form to edit it.
  2. You should see a button at the top of the editing area on the left labeled “Logic.” Click this button, and you will see a “Use conditional logic” button.
  3. Start adding filters to determine when to show or hide your chosen field. You can choose what criteria must be met before showing or hiding the field.

Note: The criteria you set up for a question must be matched with one of the following field types: Dropdown List, Checkbox, Number, Event, or Radio Button.

To learn more about setting up Conditional Logic, check out this Support doc.

2. Social Autofill

A common frustration amongst mobile form users is having to fill out basic contact details (like name and email) over and over again. Why not make the process easier by letting them fill in those details automatically? Formstack’s Social Autofill feature lets people prefill basic form fields with information from their social media profiles.

mobile forms for business

Setting up this feature is super easy. All you need to do is go to the “Settings” tab in your form, click on “Plugins” on the left-hand side, and scroll down to the “Conversion Rate Optimization” box. You’ll find two options for Social Autofill: Facebook Autofill and Google+ Autofill. Just click “Add” for the social network you want to use, and choose what types of data should go to certain form fields.

You can learn more about setting up Social Autofill for Facebook and Google+ with these Support docs:

3. Theme Editor

custom mobile forms for business

Finally, you can use the Formstack Theme Editor to create custom mobile forms that are visually pleasing and easy to fill out. The Theme Editor lets you tweak form elements like colors, fonts, and spacing without any coding knowledge. You can use this to your advantage when creating mobile forms for business, like an online order form.

For example, to make an order form more mobile-friendly, you could tweak the Submit button to make it stand out for mobile users. You could make the button bigger, change the color (red and orange are known to add contrast and create feelings of urgency), or increase the font size. And if you’re not sure what effect certain changes might have on mobile users, you could always set up a form A/B test to determine the best course of action.

Want to learn more about creating mobile forms? Click below to discover what mobile form issues you should avoid to decrease abandonment and get more submissions.