When you first drag a form field element on to your screen, it will take up a full line of text. In order to align form field elements next to each other, choose to “Align 1/2” or “Align 1/3.” This simple trick can make it easier for your end-user to read your form.
Just about every form field element can be tagged by the workflow designer with placeholder text – that grey text that gives you an example of what will fill the form field. We recommend using it whenever possible, or at least at your discretion. Placeholder text can take away any doubt that your end-users might have had about what was asked of them.
Validations can ensure that the correct type of information is being submitted into a form field. For example, a form field validated as an “email” form field will only accept information that fits the email syntax email@example.com. Validate all the emails, currencies, numbers, social security numbers, telephone numbers that you can find – this will ensure that your end user will understand exactly what is needed.
Whenever you have the opportunity to reduce the amount of time your end user will spend on the form, take it! Prepopulating form fields can save your end user tons of time, ensures that the correct information is being submitted, and makes you look like a workflow pro.
Will your form reach people of different backgrounds, who would do best if they could read it in translation? Take advantage of Alternate Text to create language options for your end users.
As a workflow designer, you can do a lot in your Form Builder to style your forms, but sometimes what you really want is to give your form a CSS makeover. We recommend styling at least the first stage in your workflow, to be easy on the eyes of your end-user. You upload CSS files (we sometimes refer to them as our “Style Files”) in the Workflow Builder, at the Stage Level. To help you out, you can download some of our ThinkSmart Style Files here.
Some of your webforms might be quite long, and scrolling through them can be tiresome for your end user. To segment your form into manageable pages, use the Form Wizard. The Form Wizard, found in Form Access, will make each section its own page that your end user can click to and from.
This tip is pretty simple to pull off for a SimpliGov workflow designer. For all those fields in your form that you need your end user to fill out, use “Required Fields.” These can put your end user at ease – everyone knows what that red asterisk means. And if they don’t, they will soon!
After your end user submits a webform, a pop-up will appear. The pop-up is an opportunity to thank the end user for filling out the form and assure that their requests will be dealt with quickly. Customize this pop-up! Thank them by name using Form Result Values, and center the text with your logo at the top. If you’re feeling fancy, add a GIF. Here’s a CSS template you can try.
Your notifications are automatically styled with your organization’s logo, but a SimpliGov workflow designer can further customize them with inline CSS and HTML. You can also easily pull in information from the webform – addressing the recipient by name and explaining the kinds of steps they need to take.