USoft gives you low-code development of web applications on the basis of a data model.

All you need is the data model. USoft will generate a fully functional, data-intensive runtime web site for you. By default, this generated site allows runtime users to query and manipulate business data stored in the data model.

USoft generates a default web application from a data model

Once you have a data model in USoft Definer:

just open the Web Designer tool. In the Web Designer catalog, you can see that default UI classes have been generated on the basis of objects in your data model:

When you publish these classes, the result is a browsable runtime web application.

As you would expect, this gives you a fill-in-the-form web page for each database table. But it does a lot more. Here are just a few examples of how work in USoft Definer affects your default-generated web pages:

• Fields in web pages become wider or narrower if you change the Length of a domain on which a column is based.
• Page titles, menu options and field prompts change if you change the Object Name for a table or the Prompt for a column.
• Data elements appear either in a grid or in a form with single-record fields depending on whether or not you set a column's In Display Selection attribute.
• From a foreign key field, the user can lookup possible values for the field, then select one to be put in the field as foreign key value. Depending on Lookup Method, the user can get a dropdown list with values, or even an excursion to a pop-up lookup window on the parent table.
• Domain Constraints and Table Constraints in USoft Definer will determine how data is enriched and how data constraints are enforced when users start interacting with these data through pages developed in Web Designer.
• Defining a new Logical View in USoft Definer automatically gives you a web form for data interaction with that view in Web Designer.

A web application is styled upfront by a template default

The look-and-feel of the end product is not determined solely by the data model. A collection of UI settings known as the template default of your application also plays a role. The template default is responsible for the overall styling of the runtime pages:

Each USoft web application has exactly 1 template default.

USoft delivers 2 factory template defaults, 'usoft-zero’ and 'usoft-classic’. By default, your application has the ‘usoft-zero’ template default. Here is an impression of what the end product looks like under the 'usoft-zero’ template default:

You can switch to the ‘usoft-classic’ template default instead. Here is an impression of what this template looks like:

These pictures may suggest that template defaults are only about visual aspects like colours, fonts, sizing and positioning, but in fact they also influence the behaviour and features of the end product: page structure, navigation paths, screen behaviour, and functionality offered through buttons, icons and links. When you compare the two pictures, you can see the first has a Back button and a Menu in the header and the other does not. The other has a left-hand list of objects to choose from, the first does not.

You can customise one of the USoft factory templates to your liking. Alternatively, you can create a template of your own. You can re-use a template from one application when you create another application.

High-level low-code iterations

Because so much is generated and defaulted, you can inspect the end product in a browser and then quickly make desired changes at very low cost. All you need to do is change the data model, re-start Web Designer, and re-publish the default UI classes.

Lower-level UI/UX iterations

You want to benefit from high-level low-code iteration, but you also want full control over the details of the finished end product. The purpose of Web Designer is to allow you to refine the detailed look-and-feel of the web pages. This process is equally iterative, but closer to what is commonly known as web development. Inspect the generated result in the browser, make changes to the Web Designer classes and perhaps surrounding layers of CSS and JS, then re-publish and inspect. This is a smaller iteration circle often called "painting”.

The word "painting” by itself evokes setting colours and shapes and not much else, but here, it is a metaphor for refining all the details of the end product, including page structure, functionality and behaviour. The result may be summarised by "UI/UX”: user interface and user experience.

You need the flexibility to "paint” but, concurrently, to expand and change the data model, even after you have been doing "paintings”. Therefore USoft allows you to make changes at the two levels in parallel. Two kinds of iteration go on at the same time:

You can go back and forth between the levels in any order. In practice, "paintings” are usually smaller and more frequent than data model changes.

As you add new elements to the data model, you get new default UI classes, that you can then begin to paint. As you change existing data model areas, there could be an effect on already "painted” classes in Web Designer. This effect is sometimes unpredictable. However, because of USoft's excellent separation of concerns, you can usually continue developing already "painted” aspects of your web application with ease, even when the underlying data model changes.

Template default is a one-time decision

This same flexibility does not apply to template defaults. The template default is a one-time initialisation. This is expressed in this picture, where the template default appears outside the iteration circles: