Modernizing Web Forms – Deploying User Experience (UX) in Data

by | Oct 13, 2022 | Dev Team

Traditional Web Form applications have custom forms that define the user experience for each type of record (Customer, Order, Invoice etc.). These user experience forms usually have extensive code-behind to control state transitions, workflow, and basic CRUD operations. Making changes to the fields of a record means changing and re-testing the application source code and then going through a complete deployment cycle across all platforms to ensure that a consistent user experience is rendered on all types of devices.

When modernizing a Web Form application, one option to consider is using Data Agnostic Record Services and a dynamic page building framework. This eliminates the need for custom user experience forms and the associated code behind creating a “pageless” application. The “pageless” application approach raises a few questions worth considering.

If you need to make a change to the user experience – how is that done?

At greatideaz, we developed functionality (UX Creator) in our trellispark platform to define a user experience as a set of Form Definitions using configuration data. Changing the Form Definition is as simple as editing the configuration data. These Form Definitions can then be tested in a development environment, validated in a separate QA environment, and then published to production.

How do you promote the Form Definition across environments?

The way we address this in trellispark is you can export the required Form Definitions as XML files and then import them into the target environment. Once the import is complete you just need to refresh any cached Form Definitions.

How does this work across platforms (for example, Web portal and native mobile apps)?

This is where it gets interesting. In traditional projects, you might have separate development teams/projects for each platform. You then have an issue of coordinating changes to records so that they can be deployed simultaneously across all platforms. With the Form Definition held only in data, that need disappears. The new Form Definition is loaded into an environment and then all the cross-platform dynamic page builders have simultaneous access to the new user experience. And your Form Definition may include conditional configuration data to tailor the user experience between devices as required.

So, we are just deploying data?

That’s right! There is no need to push a new version of the application. This is a minor issue if you are just thinking about the website (just one change on the web server). However, if you are cross-platform, then consider all the older application versions running on all the devices. At some point they all must be updated. Making sure that all customers using your application on a phone or tablet have updated to the latest version is a logistic challenge. Since we are just deploying data to the central Data Agnostic Record Storage behind the central REST API dynamic page builder – the changes are immediately available to all users when they next load/refresh the form. No application updates are required.

This is particularly important if you are pushing applications through a store front. It eliminates the wait time between publishing an application in the app store and it being reviewed and made available to your users for update/download.

Are there any other benefits?

An example of the benefit of dynamic page builders is the ability to deploy a set of Form Definitions that expose user experience based on user role. Consider, for example, that you are developing some new functionality. You can add permissions to that functionality so that it is only available to users with a given role. This allows you to push functionality that is still in “Dev” mode safely into “QA” and “Production” environments so that your developers can test it in place. The functionality can then be offered to “beta” test users by simply giving them the role allocated to the new functionality. This is then extended until the functionality is available to all users.

Additional Resources

You can access all our developer documentation for free at the trellispark Academy.

You can also download a free copy of our latest trellispark platform if you sign up to our free portal.

Whether you chose to implement your solution using trellispark, these free resources provide excellent training materials on how to achieve the most value from Microsoft’s latest .NET Blazor WASM technology and build sustainable applications.