Pega Platform version 8.7 expands the scope of Cosmos React and its underlying UI architecture to support the latest open-source technologies and UI solutions. Cosmos React features a curated authoring experience that helps professional and citizen developers build an application in the low-code App Studio environment, while also providing flexible orchestration.
Cosmos React uses the latest technology and is the recommended architecture for new Pega applications. Evaluate whether Cosmos React supports your use case before building a new application, and continue using Theme Cosmos for complex applications that require highly specialized features, such as offline mobile. For a list of supported and unsupported features in Cosmos React applications, see UI architecture comparison and Feature limitations in Cosmos React.
For existing applications, the best practice is to keep your current front-end setup, whether it is Theme Cosmos or UI Kit.
Theme Cosmos applications feature a consistent and familiar section-based UI that helps your business build a strong presence across technologies and channels. By relying on ready-to-use templates, patterns, and themes, Theme Cosmos helps you reduce development effort and focus on the needs of your business.
Cosmos design system
Pega Platform uses the Cosmos design system as its main product design resource. The system provides a consistent library of components that form the entire user experience for both customer-facing applications and Pega Platform itself.
Pega Cosmos relies fully on ready-to-use page structures, interaction pattens, and prefabricated UI components for more efficient development and performance. In addition, a more modern design and increased focus on intuitiveness help save time on application updates and user training.
For working examples of Cosmos patterns and components, see the Pega Cosmos design system website.
When creating a new application, you can choose between a Constellation-based Cosmos React UI, or a section-based Theme Cosmos UI, which can be further expanded to include hybrid React components.
If you use Pega Cloud services or a client-managed cloud environment to
host Pega Platform, the Constellation engine is already part
of your development environment, and you only need to enable it for your
If you run an on-premises system that you implemented through Helm for Kubernetes, a single multitenant Constellation instance is installed automatically for each Pega Infinity environment. If you need a different configuration, you can also opt in by manually deploying the framework through Docker or Helm for Kubernetes. For more information, see Application UI setup and Setting up the Constellation service in Pega Platform.
Security for a multi-tenant regional service in Pega Cloud services
The Constellation Static Content Service (CSCS) for Pega Cloud services is a Regional multi-tenant service. A single deployment serves the static UI content to all customers. The single CSCS also hosts cached static images from all of customers' Cosmos React applications. Customer images are protected by the same JSON Web Token (JWT) technology that protects calls to the Infinity service. Consequently, one customer cannot pick up images from another customer. The end user can only access images for the Infinity environment and application that they have logged on to.
- Cosmos taxonomy
The Cosmos design system maximizes productivity for the core guided workflow constructs of the Pega Platform. By utilizing Cosmos' extensive library of ready-to-use page structures, interaction patterns and UI components, you can deliver excellent interfaces while focusing on critical business logic and data, rather than building a UI from the ground up.
- Configuring Cosmos React
Cosmos React offers a new low-code paradigm for developing applications quickly by using out-of-the-box components built around the concept of configuration. This still-expanding framework creates products that require less customization and one-off development, but promote a slightly different approach compared to application creation.
- Configuring portals
Portals represent the main interface of your application, and provide users, such as case workers, managers, and customers, with the tools that they need to do their work. By configuring portals, you can set up an optimal environment for each of these user groups with minimal effort.
- Configuring forms and views
Forms and views enable your application to display and collect information, for example, to fulfill requests or process cases. By setting up intuitive forms and views, you help users process their work with less effort.
- Branding your application
Design systems help you introduce consistency to the applications that you build. By choosing to use a design system, you can scale your designs to maintain a unified presence across a number of platforms with less effort.
- Configuring an accessible UI
Reach the broadest audience for your application by building a user interface that addresses the needs of users with disabilities. Designing a UI for assistive technologies, such as screen readers, is important for compliance and provides essential access to users who have visual impairments.
- Internationalization and localization
Internationalization and localization help you reach a wider audience by making your application available to users who speak different languages. Localization is the process of translating application text and converting locale-specific components, and internationalization is a general design principle that makes software more convenient to localize.
- Embedding Pega Platform UI in web pages
You can choose parts of Pega Platform UI that suit your business needs and make them available to users of your websites by creating a Web embed channel and inserting the auto-generated markup into any web page.
- Integrating Cosmos React applications
Cosmos React is an opinionated design system that promotes out-of-the-box, low-maintenance solutions. However, its architecture includes tools that allow experienced developers integrate Cosmos React applications with other design systems or older applications that rely on sections.
- Setting up the Constellation service in Pega Platform
Prepare Pega Platform and your application for the new run-time framework that offers an updated set of UI capabilities. In the 8.7 release, you can build new applications with Cosmos React, or decide to use Theme Cosmos for a section-based architecture with updated landing pages and tables.
Next topic Cosmos taxonomy