This content has been archived.
Close popover

How to model the user interface of your application before all properties are defined (PRPC 6.1)

Summary

During the Elaboration stage of application development, prototypes of user forms (such as work object forms and flow action forms) help business users and the team to understand requirements, use cases, and processing steps. Producing such prototypes is sometimes called "user interface modeling."

You can rapidly mock up harness rules, section rules, and flow action rules using standard "placeholder" properties before the real application properties are defined. You can save these rules (as they are valid), reference them in flow models, and execute the flow models. Of course, these run-time forms are only prototypes and cannot perform any useful processing.

NOTE: This article describes V6.1 facilities. Similar capabilities are available in V5.5SP1. See How to model the user interface of your application before all properties are defined.

Suggested Approach

In this example you will add placeholders for not-yet-defined properties to a flow action.

  1. Select Preferences from your profile pull-down menu (next to your name on the header bar) . On the General preferences screen, select View in the Run process in... field, and select the skin for your application in the Skin field. If your application does not include an application-specific skin, select the standard CompositeBrand skin. Click Save ().
    The preference setting causes the Designer Studio portal presentation of harness, section, and flow actions to reflect the skin.
  2. Open a flow action that is based on a section. This example uses the flow action Address from a Purchase Order application.
  3. On the Layout tab click wireframes () to view the name and scope of the section. Click the Open Rule icon () to open the section.

In this example, the section named Address already includes several layouts with functional properties, but additional properties are needed to prototype the flow action's appearance, though the property rules do not yet exist.

  1. Add a new Smart Layout to the section.


     
  2. To maintain uniformity with the previously used layouts in this section, add a Double template and click OK.


     
  3. The new layout appears as:

  4. You can add any number of placeholder properties as needed. To do so, click the Basic toolbar or Advanced toolbar and select a control.

    In this example, a Calendar feature is added to the new section. Click the Calendar option from the Basic toolbar and drag it into a field in your new layout.

  5. Add properties as desired. In the example below, a text area and Input box is added. The text area is renamed to Delivery Instructions and the input box is renamed to Urgency. These new fields have names, however they do not reference properties in your application. The Cell Properties dialog indicates that the property is the standard property @baseclass..pyTemplateInputBox.


     
  6. Click Save (). Notice that you can save the section rule because it references only existing properties, though some are merely placeholders that are not truly part of your application.

    When running the Purchase Order flow, notice that true application properties are not defined. However, the appearance of the flow action reflects the new properties and controls.

    This quick and easy method of adding properties to sections aids in prototyping, creating sample flows, and other Elaboration phase development activities.
     
Pega Platform 6.1 SP1 System Architect
Suggest Edit

Have a question? Get answers now.

Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.