Users complete work by interacting with components such as text fields or pickers. In Pega Platform, you can add these elements to your application by configuring out-of-the-box controls or embedding existing fields and views in the UI. This mixed approach helps you build an intuitive, modular UI that is easy to use and convenient to update and maintain.

Controls

Controls are the text areas, buttons, and other user interface elements that determine what actions the user can take in a form. You can use controls to display and collect data, or to trigger an action. By choosing the right controls, you can build a more intuitive user experience.

When a control is assigned to a property, the control defines the appearance of that property.

Pega Platform provides a wide variety of standard controls, which you can configure and reuse with minimal effort.

For more information on controls, see the Pega Academy article Controls and presentation.

For example: You can assign a .Price property with a numeric value of 1.5 to a Text input control and a Currency control. The Text input control displays the value of the property as a simple string, but the Currency control formats that value to look like an amount of money, for example, by adding a currency symbol.

Fields

Fields model data in your application UI and define what information you need to provide to reach your business goals. For example, in a process of hiring new employees, you can create properties that correspond with the personal details of a candidate, such as a name, surname, and address.

You can adjust the type of your field to match the data that you want to collect, and pair the field automatically with a control in the UI. For example, if you want the candidate to provide an email address, you can include a field with the type email. In the user interface, the system renders the field as an Email control. To make the development process more efficient, each field type defaults to the most intuitive control, such as a checkbox for a Boolean expression.

For more information, see Configuring a data model for a case.

Views (sections)

A view is a reusable configuration of UI elements that you can use to build a modular, consistent, and intuitive work space with less effort. When users work on a case, they interact with views to gain insight into the case and perform their tasks.

You can inspect the views that each case type contains by reviewing the Views tab in the Case Manager menu. Data objects also have related views, which you can access in the View tab of each object.

For more information, see Creating views for case types.

• Adding UI components to a view

  Build an interactive and visually appealing UI that is consistent throughout all your applications by using controls. By adding the right controls, fields, and views (sections) you help users to navigate through the environment more intuitively and to process work items more efficiently. With a wide variety of default components, you can create a UI that meets your business needs.

• Configuring common control settings

  Improve the presentation of your user interface by configuring out-of-the-box controls. By adjusting options such as visibility, helper text, or on-click behavior, you can adapt the controls to the needs of your business, and build a cleaner, more intuitive user experience.

• Configuring a Button control

  Provide users with a familiar way of triggering actions in their applications by using Button controls. For example, users can click a Button control to submit a form that they complete, which creates an intuitive workflow that does not require training.

• Configuring a Link control

  Provide users with a familiar way of navigating around and outside of their applications by using Link controls. For example, users can click a Link control to navigate to a page with a license agreement and to review it.

• Configuring an Anypicker control

  Enhance navigation in your application by grouping drop-down list items into expandable categories in the Anypicker control. For example, if your business operates in several cities, use this control to group business locations by region and to help your users quickly select the right option in a drop-down list.

• Configuring an Autocomplete control

  Reduce the number of user input errors by providing the users of your application with a list of values from which to choose. The Autocomplete control displays matches from a data source as a drop-down list when the user types one or more characters in the field.

• Configuring a Date Time control

  Standardize date and time formats and ensure that correct date and time selection in forms is possible, including relevant time zones. For example, with this control users can set an appointment date.

• Configuring actionable icon controls

  Use actionable icons to create a user interface that is more intuitive and quicker to localize for different audiences. By linking common operations to familiar icons, you can make the UI more friendly and reduce the time that is required to train new users.

• Configuring the Attach content control

  Help users attach content to forms by configuring the Attach content control. For example, with this control, users can conveniently upload documents for review, or upload a photo to endorse a claim.

• Geographic reference

  Geographic reference helps users quickly identify locations that are relevant to the case. By clearly indicating the position of a place on a map, you provide users with a transparent interface that helps them read geographic data.

• Text controls

  Text controls help users enter textual data into your application. Depending on your business needs, you can set up controls that process short strings of characters, whole paragraphs, or even formatted text with images.

• Paragraphs

  Paragraphs store long-form formatted text that you can reuse throughout your UI in various read-only contexts, such as correspondence rules and user forms. By relying on paragraph rules for repetitive text, you reduce maintenance efforts and encourage a single-source approach to content in your application.

• Restricting user input in a field

  Configure fields in your data model to define the way that they store or display information to help users provide data in a format that is required in your business scenario. As a result, you minimize the risk of providing erroneous data and improve quality of case processing.