Expand my Community achievements bar.

Product Integration with AEM and Experience Cloud

Avatar

Community Advisor

10/9/22

Company Name: Deloitte

Company URL:https://www.linkedin.com/company/deloitte/mycompany/verification/

Your Name: Jagadeesh Prakash P

Your Title: Senior Consultant

 

 

Describe your company, the customer experience and business challenge(s) you set out to solve with Adobe Experience Cloud products, and how long your company/organization has been using Adobe Experience Cloud products.

Every business today is present on digital and online channels. XYZ company vision of is to have a future state eBusiness/eCommerce solution. The envisioned project will include future state eBusiness processes and organization, strong focus on the customer journey/experience and new eBusiness and eCommerce capabilities along with a new technology architecture and eco-system.

XYZ is undertaking a digital transformation of their site digital and marketing assets and processes starting with Adobe Experience Manager(Cloud Service) as a CMS in order to

  • Modernize xyz content management platform and marketing technology, increasing flexibility and speed to market of digital content and assets
  • Improved customer journey/experience and new eBusiness and eCommerce capabilities with new technology architecture and eco-system

 

Describe how you have integrated and used multiple Adobe Experience Cloud products to solve these challenges to improve and personalize the customer experience/journey. Please provide information that will be helpful in understanding your integration (e.g. architecture diagram, step by step process integration flow, etc.).

Adobe Experience cloud provides the centralized solution by bringing all the systems at single place and easy to access. The Auto Scalable feature of environments and centralized code management, deploying code through the Cloud manager pipeline helps for easy maintenance for client.

The XYZ client have product details at different source system and commerce details in a different system. Now that adobe cloud is providing a node storage mechanism ~ 50K product details are moved to the Adobe cloud node structure. And the commerce details are retrieved on demand basis through API calls.

IMS system supports the users access to cloud environment and bring the global authors into single system. Permissions to the author groups globally are easy to maintain in cloud manager

 The basic diagram below shows the overall architecture of the solution: 

Implementation Approach

Migrating the Product details and storing into Node structure (One time activity)

The existing system of client provides an API from which AEM will get the product details and store it into the AEM node structure in a structured and formatted way. The ordering of the products are segregated into variations and with base products. Please refer to one of the product details json from node structure

 

Below is the AEM Product Synchronization and publishing

Jagadeesh_Prakash_1-1665380514719.png

 

API call

Jagadeesh_Prakash_2-1665380546715.png

 

Structure of AEM response of the products

Jagadeesh_Prakash_3-1665380582627.png

 

This product migration is done for once and going forward the products will be added to AEM through an admin page and indexed to Solr. The approximate products migrated are nearly 50K and 2 to 3 new products and added or modified in a year. The products are storied in a structured way based on the variation and base product details. The Structure data can be referred in below diagram

Product Structure in crx

Jagadeesh_Prakash_4-1665380605664.png

 

The product URL also will follow the same structure and based on the product id selector the data will be served on the page.

Dynamic rendering:

  • PDP Pages are rendered dynamically based on Product Information available in AEM
  • Placeholder Page will be available for each category.
  • Based on Template and Component of the placeholder page PDP pages under that category will be rendered.
  • Components in the PDP Pages will be dynamic nature , based on the SKU in the URL the components will render data related to the particular SKU.
  • By making the PDP pages dynamic, we eliminate the cumbersome process of authoring all the PDP Pages and consistent experience will be rendered for all the PDP Pages.
  • Product Information from various sources will be stored in AEM
  • Assets related to products are also imported and stored in AEM
  • Assets will be tagged to each product and tagged assets will be dynamically pulled into the PDP pages

 

Authentication and access to commerce details

The pricing and the account management details are maintained at the client specific system. AEM will be making a call to retrieve the data and display on the page. From AEM the commerce calls are done through proxy servlet. The details are cached at CDN level

The price details will be display only when the user is authenticated to the client authenticated system. The authentication session is stored in the cookie for a period of 15min. Commerce call that happen from frond end to system it will check for the live session in the cookie or else it will generate a new session and save in the cookie.

 

Jagadeesh_Prakash_5-1665380635049.png

 

  • AEM will initialize WCS session using Server-side call. The Sling Servlet will be making a call Login Identity Service in WCS which in turn will return WCToken and WCTrusted Tokens, which will be then set in the browser.
  • AEM will use these tokens (WCToken and WCTrustedToken) for all the communications like Pricing call, Add to Cart and for getting mini cart information.

 

The API details are also stored in the cache at CDN level and will be cleared on demand basis (Event listeners) when products are modified and published from the node structure.

Multi-Site system

As the client is globally spread in 26 countries, we are maintaining the language-master and language-copy. The language master will have all the language copy along with the master language.

The language copy is rollout to all other country structures to maintain the live sync. Please refer to below site structure

 

Jagadeesh_Prakash_6-1665380661758.png

 

 Integrations with the Adobe Client Data Layer

The Adobe Client Data Layer reduces the effort to instrument websites by providing a standardized method to expose and access any kind of data for any script.

The Adobe Client Data Layer can integrate with your custom components and integrations with Adobe Analytics and Adobe Target can help you gain insights into the site. The data-cmp-data-layer is configured for every interactive element in the component to capture events to the Adobe Analytics and Adobe Target

Jagadeesh_Prakash_7-1665380677576.png

 

Configure the Adobe Launch script

The Adobe Launch Script is configured using OOTB configuration for all different regions separately. The launch configuration is selected on the root page of the region so that it is inherited into all the child pages. Please refer to below launch screenshot

Jagadeesh_Prakash_8-1665380704052.pngJagadeesh_Prakash_9-1665380715868.png

 

Once the confirmation is done, we can see the launch script loading on every page

Jagadeesh_Prakash_10-1665380727648.png

 

 

Based on your successful use and integration of multiple Adobe Experience Cloud products, describe how it has transformed the customer experience/journey, and the value, business impact, and results your company/organization has realized. Please cite both qualitative and quantitative results as applicable.

XYZ now have the centralized solution of having all the product details in AEM and easily target the customers with relevant offers and there increase overall engagement

In this story, we shared how we achieved real time cross channel personalization with Adobe Experience Platform and Adobe Target.

 

@Shashi_Mulugu 

Elevate Analytics Experience Manager Target