WEB FORMS AND UX

Web forms are the entry point to the most complex interaction patterns of modern digital experiences. In the next few paragraphs, I’ll share my experience on the value of investing time in designing user-friendly web forms. I will pinpoint the potential pitfalls of underestimating this task and explain how web forms can unlock business value.

Why do we bomb users with web forms?

Web forms are about asking the right questions at the right moment. They need to be designed to improve the user experience by collecting the data that will enable the system to simplify the user’s task.

Here you can find the mid-level mockups for this UX pattern:

We often ask our customers/users to add content to our system. We often ask our users to complete some requests through a complex process. To be sure that our users will not get lost or panic, we should provide simple and clever web forms. Given that the wizard process delivers a seamless user experience, it is sometimes a brilliant solution. When we start to design a product that asks the user to introduce some content, we must remember that we’re asking the user to increase his/her focus on our platforms. We must ensure all the information is in the right place and delivered to our users most understandably.

Of course, when we talk about UX, there are (fortunately) strict rules – and sometimes, the best experience concerns the device ecosystem and the scenario. As far as I am concerned, it’s always a good idea to Keep in mind the critical lessons learnt from the book by “Luke Wroblewski “Web Form Design: Filling in the Blanks”;

Browse a lot trying to find web forms and processes, from the easy ones to the most incredible and hard to understand;

Make a grid with the following:

1. Strengths and weaknesses of the solution that we found;

We followed this approach during the project startup phase, and these are our findings: The process should be straightforward, using the design of the interface and the collection of user tasks. We found this interesting article about workflow best practices during the benchmark step. We copy and paste some points because they fit our needs for this design task:

• Goal – You should give some sense of the total task;
• Steps – You should display how many steps are involved;
• Status – You should display where the user is in the process;
• Mandatory – The user should know what is required;
• Confirmation – You should know when you have completed a step;
• Position – You should end up at an appropriate spot;
• Correction – You should be able to undo your actions;

And we added:

• Support – You should provide a specific tool to support the user during each step (ex. FAQ page);
• Notification – You should always provide a report and/or a notification because some processes are not doable in one session and with one device;
• Confirmation on the go – You should provide such info to ensure the user understands what he/she did and why. This is the case where the user is not able to fill all the fields: here, we provide a “save” button to ensure access to this specific page;