Upgrade to Pro — share decks privately, control downloads, hide ads and more …

What’s HCL Digital Experience&How to Integrate it with HCL Connections

September 17, 2019

What’s HCL Digital Experience&How to Integrate it with HCL Connections

What’s HCL Digital Experience&How to Integrate it with HCL Connections


September 17, 2019

More Decks by LetsConnect

Other Decks in Technology


  1. Copyright © 2019 HCL Technologies Limited | www.hcltechsw.com What’s HCL

    Digital Experience & How to Integrate it with HCL Connections
  2. 2

  3. A Digital Experience Solution … Today • Building a Digital

    Experience Solution is much more than creating an attractive front-end experience • Consumers’ expectations are shaped by their best experiences across industries • Enterprises must relate with a multi-faceted & multi-stakeholder audiences in different dynamic contexts that change over time It means redefining how you do business across the value chain of your key stakeholders through a new ⇢ Digital-First Strategy
  4. Pursuing a Digital-First Strategy allows for … Rapidly adapt and

    improve experiences for all stakeholders (customers, employees, partners) Innovate and reinvent new business models Re-imagine operational processes
  5. Digital-First Strategy : Key Requirements Experiences that blend content, apps

    and business processes Navigating sensitive security and compliance requirements Managing multi-brand, multi- market or multi-lingual experiences Delivering a consistent experience for all stakeholders across multiple touchpoints Ensuring mission critical experiences never fail Personalizing experiences based on behavior, role or segment
  6. HCL Digital Experience – What is? • HCL Digital Experience

    is a platform that offers modern, flexible tools & technologies to deliver a Digital Experience that provides users with: • a single point of personalized access to the applications, services, information and social contents … • … always according with their needs and the context in which they operate
  7. HCL’s Digital Experience Platform Spans Across All Use Cases Marketing

    / Content Sites Online Stores & Transactions Self-Service Partners / Agents Social Intranet Deliver great online brand experiences Build loyalty with relevant, personal online self-service Support partners with integrated online self- service Empower staff with relevant, personal online self-service Attract and convert with great content Claro Peru, Primerica Tracfone, Soccer.com State Bank of India, HP, Cigna, Goteborg Pacific Life, Bombardier Federal Bank, Cemex, Goteborg HCL Digital Experience Platform
  8. HCL Digital Experience – What does it provide? • HCL

    Digital Experience simplifies complexity 9 Digital Experience offers industry-leading functionality Digital Experience leads with superior technology Single Platform Highly Customizable Role Based Experiences Blend Content, Applications & Business Processes Scalable Performance Flexible Deployment Model Enterprise-Grade Security Modern Architecture
  9. Benefits of the HCL Digital Experience Platform Accelerate time to

    market Faster ROI Performance at scale Lower Total Cost of Ownership
  10. DX Investment Themes & Upcoming Releases Empower users Reduce TCO

    Increase agility • Media management (DAM) • New user interfaces • Kubernetes • Microservices enablement • APIs developers love • Kubernetes Feedback/Market/Technology Driving the HCL DX Strategy Share your ideas about new capabilities ⇢ https://hclsw-dx.ideas.aha.io/
  11. HCL Digital Experience Components integrate applications, services and content with

    role based access PLATFORM build publish and update personalized pages and sites with visual editing SITES create, manage and publish responsive content to any channel CONTENT Full-featured digital experience capabilities integrate applications, services and content with role based access PLATFORM build publish and update personalized pages and sites with visual editing SITES create, manage and publish responsive content to any channel CONTENT Infusing AI everywhere to increase Customer Experience create sophisticated multi-channel web forms applications FORMS
  12. HCL DX – Platform • It’s the basic framework to

    provide single point of role-based access and rich user experience that enable organizations to: • Create, manage and deploy multiple digital sites • Manage their digital brand • Provides tools for intuitive page assembly, dynamic navigation, and extensible design by exploiting a componentization pattern • Secures access to resources • Offers: • Standards-based functionality & Foundation Services to support deep integration with any external application
  13. HCL DX – Page & Site Management Tools Site Manager

    • Business user tool for an integrated page & content view of the Site • Tools for Creating, Managing and Configure the Site Structure based on Page Templates Site Builder • Tool for creating and work with Site & Section Templates • Business Users can use existing templates or they can create, change, as well as distribute templates
  14. HCL DX – Page & Site Management Tools Site Toolbar

    • Select the Content/Application component • Drag&Drop it into the page place holders • Update and reconfigure as needed In-line Content Targeting • Hide Content for certain user segments • E.g. create rule that only shows content to mobile users • Show specific Content under defined Contexts • E.g. create rule that shows smaller or different image to mobile users • E.g. Show different promotions during the year
  15. HCL DX – Personalization & Targeting • Different types of

    solutions: • With different levels of efficiency & different implementation and usability scenarios that you can mix&match according with the business requirements TARGET Contextual & Real Time Personalization 2 External Marketing & Analytics Engines Integration with: - Customer Experience Analytics - Marketing Platform - External Segmentation Engines 1 Personalization Engine PZN Rule Engine allows to create different types of business rules: Profile, Select, Bind, Visibility PZN Application Object allows for integrating external Resources & Rule Engines Security & Authorization DX provides pervasive security authorization features on all the resources: pages, portlets, content, component and more … 0 AI
  16. HCL DX – Content Management • Allows business users of

    all skill levels to create and publish content • Enables rapid development of sites through reusable, out of the box components and templates • Separates content from presentation allowing authors to create content independently from the channel and how they will be rendered • Manage content through Workflow and Project • Improves customer experiences through dynamic content delivery and a high level of personalization to the web user ... But is also an integration tool !!! End-to-End Web Content Management Solution
  17. HCL DX – Textbox.io The goals for Textbox.io: • Create

    the best user experience • Introduce advanced features • No Java dependency – Java Script • Seamless interoperability with MS products • Standard, clean HTML generation across platforms • Easy deployment • Modern, clean, uncluttered look and feel • Mobile ready from day 1- fully responsive design Make editing a breeze on any screen The ‘Next Generation’ Online Rich Text Editor
  18. HCL DX – Mobile & Multi-Channel Responsive pages and content

    automatically adapt to the device you are using from a single source, showing the right formatting and navigation for the right experience The pervasive concept of “Device Class” as abstraction for common properties for the device, allows for managing and controlling the digital experience behavior based on the user device
  19. HCL – Leap ⇢ Creating Forms Application • Designing forms

    is easy • Pure WEB WYSIWYG tool • Create dynamic web and mobile friendly forms • Collect, access and analyze data • RESTfull solution Drag widgets onto the canvas Set their properties Lets non-technical users (and technical users too!) create sophisticated web applications for … Collecting Information Tracking & Updating Information Automate Process Reporting & Analysis Capabilities that make Leap outstanding Integrate with other systems Automate process Access to and management of your data and resources Control over behavior, look and extensibility API REST
  20. HCL DX – Integration Capabilities HCL DX Marketing Insights Commerce

    Service Advertising Social Each organization will have its own mix of ecosystems (e.g. products) And each ecosystem has their own vantage point, specificity and strengths HCL DX “glues” this nicely together A Digital Experience Platform must integrate with all the ecosystems that support the customer life cycle
  21. The modern web development landscape • The world of Web

    Development and Design has been advancing rapidly and Web Development and JavaScript skills are the most widely available skills today • JavaScript frameworks and libraries are quickly evolving and improving • Angular, React, Bootstrap, and many others provide rich capabilities that let developers focus on application functionality • Continuous Integration & Delivery tools and practices enable more frequent release cycles with much less manual work • Powerful development, build, and test tools such as Node-based tools give developers and designers big boosts in productivity • The integration patterns and application openness are increasingly based on the use of REST APIs
  22. HCL DX - HTTP Outbound Connection Service Single Reverse Proxy

    WAB SFP (SS Mode) SFP. (CS Mode) Custom Portlet HTTP Outbound Integration: API, Servlet Configuration: WAB Manager UI Owner: WAB team Ajax Proxy team Features: Sun Java engine, Trust generation, Trust Association, SPNEGO, Plug-in support, User Impersonation, HTTPS Tunneling Services: WAB Manager UI as Connection Manager Host + Policy = Application Connections as a PortletService Connection Picker Component Improved admin UI Consistent & controlled accesses across all outbound connections Browser Digital Experience HTTP Outbound External Web Application • To overcome CORS, HCL DX provides a central point of administration for all the outbound HTTP connections • Support for authentication and cookie handling • Ajax Proxy
  23. Both based on WCM This is where WCM acts as

    Integration Tool !!! HCL DX – Integration Tools Landscape • Extended support for both “traditional” Java development and the new development tools landscape (Web Developer focus) • Traditional Approach • Java based Coding (IDE : RAD, WEF) • Robust, Quality of Service, certified • Supporting Industry Standards (JEE, JSR286, Web Services, ...) • Agile Approach • Created and added on the fly by line of business (authoring) • No-Code Deployment approach • Digital Data Connector (DDC) • Script Application
  24. What’s Digital Data Connector • Digital Data Connector (→ DDC)

    is a Public & Open Framework to integrate data from External Data Sources • External Data Sources : • More often → any external application that expose its own data in a XML or JSON format (→ normally, as typical result of a Rest API call) • For example: • You can use DDC to render social data that you have on your HCL Connections server or on other social platforms in the context of your portal pages • You can point to other data sources like: news feeds, BPM task lists, Commerce product catalog, etc. • In this specific case, XML or JSON are recognized as a powerful way to describe a data structure • This power is the higher the more you are aware of the meaning of each element in the structure and of how you can identify and use it • In general → any arbitrary source of data you can “address” and “work with”, through coding, to extract & retrieve data and “translate” them into reusable information
  25. DDC – High-Level Overview HCL Digital Experience HCL Connections Commerce

    ERP Systems Domino External Search Engines BPM (task list) Any Custom Feed Write data to Remote Services data Read & Visualize Remote Data markup XML JSON HCL Digital Experience Markup Web Content Viewer Portlet Portal Page WCM Presentation Template & Components DDC XML Plugin Generic Bean List Data Structure WCM Content item List-Rendering Profile External Systems REST API The portlet is a WCM Content Viewer Portlet It works with a WCM Content items
  26. How you do work with DDC • With Digital Data

    Connector, you will work with a WCM Content Items to "describe”: • which data to include • … & maybe filter them • how to manage the presentation by choosing between different List Appearance components
  27. Key Benefits of the DDC Approach • In many cases,

    integrations built on DDC → do NOT require any Java coding skills nor code deployment activity • WCM Designers have full control over Presentation and you can display any external data on any device, with a consistent look managed using WCM • You can use all the WCM management facilities for managing your external data integration • These facilities include content syndication, versioning, projects, workflow, preview and targeting • Basically, you can manage the external data integration in the same way as your other WCM content Web Content Management News Articles Presentation Title Summary Body Picture Data Title Summary Body Picture ATOM, RSS, XML, JSON Digital Data Connector Data Name Body Price Picture Presentation Name Body Price Picture List of Products External Systems REST API
  28. Typical Use Cases & Samples for DDC DDC Sample for

    WebSphere Commerce Feeds Atom & RSS
  29.  HCL DX product feature  Set of ready-to-use components

    for the different Connections applications:  Blog, Wiki, Files, Profiles, Communities, etc.  Implemented using a custom Social Rendering DDC Plugin  Additional computed attributes contributed by Social Rendering DDC plugin  Delegating XML processing & loading to the generic XML DDC plugin  Fully Responsive web design Typical Use Cases & Samples for DDC HCL Social Rendering
  30. Why script-based applications for HCL DX • Web programming skills

    – using HTML/JS/CSS – are very prevalent and widely available • Many JavaScript libraries and frameworks are available and widely known • Angular, React, Bootstrap, and many others provide rich capabilities that let developers focus on application functionality • Powerful development, build, and test tools such as Node-based tools give developers and designers big boosts in productivity • Continuous delivery tools and practices enable more frequent release cycles with much less manual work • Many organizations are moving toward a client-side application architecture • The application code runs in JS on the client, accessing data via REST services • A client-side application architecture can have performance and user experience benefits
  31. HCL DX – Integration Tools: Script Application • Web developers

    build standard web applications (“Single Page Applications”) that run alongside other content and applications as part of a complete Digital Experience site • Developers use their favorite frameworks: Angular, React, Vue.js, Bootstrap, etc. • …and their favorite tools: editors, Node-based tools such as Bower, grunt/gulp, LESS/Sass • Applications are stored in WCM • Use Portlet & Portal features such as targeting, conditional rendering, Shared Render Parms, Portlet Preferences, Portal AJAX proxy, Portal Styles, etc. • No code deployment
  32. Creating Script Application in HCL DX • Build in the

    browser with the Script Application Editor • Used only for very simple applications, (no Source Code Management support) • Type or copy/paste into the tabbed editor • Applications are limited to single HTML, JavaScript, and CSS elements • Build on your workstation with your preferred tools, then use ⇢ “sp push” to move/upload the application to the server • Used for any simple or complex applications, integrated with Source Code Management • Applications can have any number of files including JS, images, HTML fragments, etc.
  33. Script Application: Test & Staging • All the HTML/JS/CSS/etc. for

    Script applications, can be maintained in a source code repository • Command line or GUI tools can push files to a development or staging server • Script applications can be syndicated from staging to production server Git, SVN, RTC, etc. Developer or designer workstation Build or integration system Source Code Repository Push to server Push to server with automated tools Developer Test Portal WCM or WebDAV Staging/Integration Portal Production Portal WCM or WebDAV Syndication WCM or WebDAV
  34. Key benefits of the Script Application approach • You can

    build portlets using skills you can easily hire (JS/HTML/CSS, jQuery, etc.) • Line of Business is less dependent on central IT - a small team of script programmers can make new portlets and customizations quickly and easily • You can build portlets without deploying any new code on the server • Both the use of the ⇢ Script Application Editor and the ⇢ sp push script command line result in the creation of a ⇢ WCM content item • All the features of WCM can be used for managing applications • Projects and workflow can be used for approval by business and/or IT before applications go live through Syndication • Many of HCL Digital Experience’s key value-add features are available​ • Eventing, multi-channel delivery, responsive design, public render parameters, portlet preferences, etc
  35. Configuring the Application through the Portlet Preferences • You can

    use Portlet Preferences to provide application configuration at the portlet instance level • Applications can be configured from the browser by business users, page authors, or administrators • Preference data is stored as JSON • A JavaScript helper object has functions to store and retrieve preference data A “Stock Tracking” application can be configured for which stocks to show A “Customer List” can be configured for which columns to display
  36. Typical Use Cases & Samples for Script Applications • Any

    type of Single-Page Applications • Any JS libraries and frameworks can be used • Data is accessed with REST/JSON services • Any type of application UI • Forms, views, charts, etc. • HCL Connection Services • According with the available Rest API
  37. Integrating HCL DX with HCL Connections • HCL DX provides

    different integration paths: • HCL Social Rendering (⇢ Digital Data Connector) • Script Applications • Community Pages • This integration happens at the DX Page level • With this integration path you can integrate HCL Communities into a DX site by associating a DX Page (or a set of DX pages) with a specific Community • By doing this, all the connection integration portlets in those pages automatically render their content within the context of the selected community • The HCL Connections’ Community contributes to set the context of the DX Page • When using Community Page Templates, you can configure the solution to automatically create a new Community in Connections, based on the name of the new DX Page. • Finally, you can "Mix&Match" Community membership and DX authorization model • Remote Content – create link to Connections files into the RTE • Social Media Publisher – publish to Connections for WCM • Federated Tags • Search