Revamping UI Architecture with Constellation (Cosmos-react): A Success Story from Pega Traditional UI Migration
In early 2022, Pega introduced a new UI architecture called Cosmos-React, also known as Constellation. LeasePlan, a leading global specialist in automobile leasing and fleet management and a client of Aaseya was given the responsibility of being the Pega COE UI/UX lead, driving all the UI/UX requirements throughout their Pega landscape. Lex Ruijter, the Head of COE LeasePlan, decided to take a bold step by moving 10+ applications into Pega’s new UI architecture, Constellation UI.
However, the Constellation architecture was new to everyone within the team, and there was limited documentation available in production. Thus began the journey from UI-Kit to Constellation Architecture.
What is constellation architecture?
Constellation is a pattern-based modal-driven architecture that follows a prescriptive way of development. In order to create a UI, users first need to define the data modal based on which the UI will render on the browser. It helps businesses to have a consistent UI throughout their Pega products and makes applications low-maintenance. It also enables open API-based, industry-understandable architecture that allows front-end developers to extend Constellation and use their own design systems.
Advantages of constellation architecture
One of the most significant advantages of Constellation is that it enables businesses to be more productive by improving the modular design, which encourages prototyping and design consistency. It helps in building more consistent and channel-agnostic apps, provides better separation of concerns for easier maintenance and upgrade, and provides clients with well-defined extension points. It also offers easy, fast, consistent, and error-proof configurations in App Studio.
However, working with Constellation requires a shift in mindset from “customization to configuration.” It is a complete shift of technology in Pega, and everything that UI developers and Pega developers used to do before does not apply in the new architecture. A traditional UI developer may find it challenging to work with Constellation UI initially. Still, it is a citizen developer platform that enables people with business knowledge to quickly boost the customer journey, flow, data modeling, and promptly provide all the essential information.
Here are some suggestions for UI developers
To work with Constellation, it is important to unlearn the traditional way of working in Pega UI and adopt the Constellation standards. You must learn quickly about what’s doable and what’s not and how to work on app studio authoring and design pattern-based modal-driven applications. You must also learn how to extend the design system by knowing how the SDK works and how to extend the design components. To advocate for Constellation, you must convince clients and other Pega associates who are new to Constellation architecture. You should also execute many POCs and learn the power of low code to construct a consistent and feature-rich UI.
If you want to extend the Constellation UI architecture, you must have knowledge of ReactJS and design patterns in Constellation. It is essential to believe in configuration, not customization, and refer to design.pega.com for more information about the components. It would help if users also read about Pega’s public APIs and how PCore and PConnect objects play a role in Constellation architecture.
At Aaseya, we understand the challenges of working with new technologies and architectures like Constellation. That’s why we have a team of expert UI developers skilled in working with Constellation and can help our clients achieve their UIUX requirements. Our team of experts has extensive experience in working with Pega frameworks. It can help our clients unlearn the traditional way of working in Pega UI and adopt the Constellation standards.
If you’re interested in working with Constellation UI architecture, Aaseya can help you with our expert UI development services. We can provide low-code solutions that enable you to quickly boost the customer journey, flow, and data.
