Adaptive Form Layouts: Converting a Legacy Format Into An Adaptive Form

Part Seven of the Adaptive Form Layouts Series

12-10-2021
Angèle Taylor

After reviewing the benefits and draw backs of the different standard layout options for an Adaptive Form it is now time to learn how to transform an existing 8 by 11 design into the contemporary mobile ready format.  These modern form designs allow for a simplified, dynamic and impowering experience for end users changing the tedious task of completing required data capture into an enjoyable experience, however this requires form designers to think differently about the user experience even before they start building a new form. 

Adaptive Forms have an entirely different end user experience and because of this the first step in the design process is understanding the entire life of the legacy form design to ensure the complete procedure is recreated in the new format. Identifying which areas are required, versus optional or only relevant during certain conditions, grants designers to streamline the new experience to create a better end user experience. Major sections tend to benefit from either a wizard layout or a tabs on the left layout while supportive or optional sections benefit from a tabs on the top or accordion layout.

It is also critical to understand how these new digital forms will be completed; will the majority of the forms be accessed on a mobile device, a desktop or printed? Adaptive Forms empower end users to be able to engage with forms in whichever method these choose but depending on the majority of interactions may favor different layout choices to ensure the best user experiences are created. When designing for mobile first it is best to design with a focus on using vertical space while designing for desktop allows for the use of more horizontal space.

Likewise consider simplifying the process at any given time to the end user who will be completing the form. The idea of only showing what is relevant when it relevant is really the main idea here. If sections are optional consider having them in a free-flowing format or collapsible area that a user can navigate to on their own or such as with the accordion layout. Furthermore, prefill known information for the end user rather than forcing the user to renter data.

Lastly, experiment. The more exposure you have to the different layouts and how they behave when nested within each other will give you a better understanding of how to build future forms. If something feels confusing or overly complicated experiment with different options and build out organizational standards with known formats that work.

Organizational standards and styling will also need to be considered when determining the best way to lay out an Adaptive Form. Having predefined guidelines on how new Adaptive Form should look and specific styling can help to draw focus to specific areas based on content requirements.