AEM 6.5 Enhancements

 

AEM 6.5 Enhancements

 

AEM 6.5 release is customer focused. Customers will be loyal to the brand if the content is more personalized.

It delivers innovation that enables marketers and developers to collaborate on the rapid delivery of personalized brand experience.

Following are the new capabilities provided by AEM 6.5:

1. Connected DAM (Digital Asset Management)

Digital Asset Management (DAM) platform gives you a central hub for organizing, storing, and retrieving rich media.

AEM Sites offer capabilities to create web pages and

AEM Assets in the DAM system that supplies the required assets for websites.

AEM now provides the capability to use assets from a connected DAM which is running in a completely different AEM instance.

In a large scale enterprise, there may be two AEM instances running in parallel:

AEM Site Author, executed by the AEM Site Team.

Assets Author instances, it is used by the creative team to store assets

With a connected DAM, Site authors can search, drag & drop, save, and publish assets directly even though the asset is on a different instance. It allows site authors to access from remote AEM assets instance.

 

Features provoded are as follows:

·        Easy-to-use access to all owned assets, no matter where they are stored.

·        This is ideal for a growing number of businesses that need a central, standalone DAM with AEM Assets.

 

2. Adobe Asset Link Extension with AEM Assets

 

This is very useful as it providesthe collaboration between creatives and marketers those are working in the Adobe Creative Cloud Applications like Photoshop, Illustrator, or InDesign has an option to connect to AEM Assets using Adobe Asset Link.

It will make it very easy for marketers to find the right assets which are to be used in creative workflows.

Here are a few top business benefits of Asset link:

·        The direct in-app panel ensures creatives never leave the creative context to access digital assets which are stored in Adobe Experience Manager.

·        Relevant assets can be universally searched and viewed form AEM Assets and Creative Cloud Assets.

·        Ability to check a digital asset out of and back into AEM to prevent duplicate work by the team.

·        Ability to keep Work-in-Progress assets and final production assets in separate locations.

·        Easy access through Single Sign-on with your Creative Cloud account credentials.

 

3. Integrate Adobe Assets with Adobe Stocks

 

Adobe Stock provides millions of high-quality 3D assets, templates, videos, illustrations etc. for creative projects.

Now Adobe Stock Enterprise plan within AEM Assets ensures that all licensed assets are available for creatives and marketers.

With this integration, Adobe Stocks licensed assets can be saved in DAM using powerful capabilities of AEM.

 

Some top benefits for creators & marketers are:

·        Users can quickly find, preview, and license stock Assets from Adobe Stock, and then Save them to Adobe Assets.

·        Once an Adobe Stock asset is licensed in AEM, you can use and manage it like a typical Asset.

·        Integrate Adobe Assets with Adobe Stocks, adobe experience manager

·        This Integration can be performed by AEM Administrators and Admin Console Administrator since it requires Administrative privileges.

 

4. Brand Portal Capabilities

Brand Portal is a cloud application. This is useful for practitioners who want to share some assets with their agencies or who want to share a portal with their partner but at the same time don’t want to give them the access of DAM.

Following are the list of enhancements:

·        Upload capability on the brand portal for sourcing brand, campaign assets from external agencies & teams.

·        Publish to DAM for review and multi-channel campaign usage.

·        New contributor role for an external agency user persona.

·        Direct folder share with an external agency from DAM.

·        Admin configurations to control upload sizes.

 

5. Adobe Experience Manager SPA Enhancements

 

SPA Editors are more powerful in AEM 6.5 with multi-site management.

It is recommended to use the SPA (Single Page Application) Editor if your project requires a SPA framework-based client-side rendering (e.g React or Angular).

By using AEM SPA Editor, developers can easily build web sites using SPA Framework and authors can seamlessly edit content within AEM.

 

Following features have been added in AEM 6.5:

·        In-context preview and edit of React and Angular SPA.

·        You can use Multi-site Management to create country, franchise or white-labeled SPA experience.

·        Localization and translation support for SPA now.

·        Server-side rendering of SPA to reduce first page load time and improve SEO.

·        It can be extended with the AEM SDK to be made editable for practitioners.

·        Use the Template Editor to edit and configure the AEM editable parts of the SPA.

 

6. Smart Crop for Images/Videos

SmartCrop now works with Dynamic Media.

Nowadays, all sites support multiple layouts for multiple devices such as mobile, Tablet and desktop, you needed multiple sizes of each image in your design to suit each target screen size.

With a website incorporating hundreds or thousands of images/videos, this simply wasn’t practical.

Adobe Sensei based Smart Crop features allow you to overcome this situation.

With a smart crop, all your images/videos are cropped automatically within the Experience Manager. There is no need for any other tool.

 

Some key features are:

·        Videos/images are automatically cropped to new aspect ratios while preserving the points of interest.

·        All images are automatically cropped in the folder where workflow is applied.

·        Smart Crop editing layout can also be sized for better visibility.

·        Published URL for the Smart Corp asset can be used for 3rd party applications that accept hosted assets.

·        Smart Crop option can be set up, for the target size you want, and you have the option to review the changes without affecting the other images in the folder.

 

7. Visual Search within AEM

 

Visual search is an Adobe Sensei powered search capability to find visually similar resources in the DAM

It identifies the content and composition of your image and automatically adds meta Tags to instantly deliver search results based on the visual information.

Adobe Sensei powers intelligent features across all Adobe Products to dramatically improve the design and delivery of the digital experience using Artificial Intelligence, Machine Learning, and Deep Learning.

You don’t need to translate a visual to text to search.

You simply need to drag and drop an image into the search bar and Visual Search will tag, search, and deliver similar images.

 

8. Headless Content Delivery

 

Earlier we needed to create a Content Fragment Model which is converted into the content fragment.

This content fragment was placed on AEM pages using Sling Model to export in JSON format. AEM 6.5 simplifies the process.

In AEM 6.5, the HTTP API now supports the delivery of content fragments. All you have to do is create Content Fragment and then leverage the Asset HTTP API to export it in JSON format.

It can be easily invoked by attaching “API/assets/” in the content fragment URL.

This JSON format can be consumed across SPA, Mobile App, iOS App, and more.

 

9. Automated Forms Conversion

 

AEM now automatically convert all your legacy PDF forms and traditional input fields to digital, mobile-responsive, adaptive forms.

With AEM 6.5, AEM Forms author can leverage the following capabilities:

·        Forms rendered properly, no matter what devices your customers use.

·        You can extract fragments and components that you can reuse for creating new forms.

·        Form structures extracted by identifying form sections, texts, fields and semantically mapping them to appropriate fields, types or groups.

·        This approach significantly reduces the time taken to digitize and modernize the end to end data capture experience, especially for organizations that have dozens and hundreds of legacy PDF forms that they need to convert.

 

Conclusion

 

Adobe Experience Manager 6.5, release delivers innovation that enables marketers & IT professionals to collaborate on the rapid delivery of the personalized brand experience.

In this release Adobe Sensei powers many features which help you to identify customer behavior, use those thoughts to serve relevant and personalized experience.

There are many features like smart crop, visual search, Automated Forms Conversion, etc. which help to deliver the right content, to the right audience at the right time with better customer experience.

Authoring Core Components

 

Authoring Core Components

 

In Adobe Experience Manager, components are the structural elements that constitute the content of the pages being authored.

 

Components have always been a fundamental element of the AEM experience, making page creation simple but powerful for the author and the development of components flexible and extensible for the developer.

 

Core Components were introduced to provide robust and extensible base components, built on the latest technology and best practices

 

Core components make page authoring more flexible and customizable, and extending them to offer custom functionality is simple for the developer.

 

However, using these components in the project is developer job to get maximum benefits of these pre-configured and pre-built components.

Note for Developers:

Core Components are not immediately available to authors, the development team must first integrate them to your environment . Once integrated, they may be made available and pre-configured via the template editor .

Benefits As an author:

Author will notice several advantages of the Core Components, including:

·       Simple to use and well-integrated with the page editor

·        Feature-rich capabilities to accommodate many use cases as illustrated by the WKND   reference site as well as in the Component Library

·        Pre-configurable to define which features are available to page authors via the template editor

·        Built around accessibility guidelines

·        Built to support responsive layout.

·        Built to support easy localization

 

Configuring Foundation Components was the job of a developer.

However with Core Components, a template author can now configure a number of capabilities via the template editor.

For example, if an image component should not allow image upload from the file system, or if a text component should only allow certain paragraph formatting, these features can be enabled or disabled with a simple click.

 

Edit and design dialog of component

 

Because the Core Components can be pre-configured by template authors to define what options are allowed as part of a template, and then further configured by the page author to define actual page content, each component can have options in two different dialogs.

 

Edit Dialog	Design Dialog
Options that a page author can modify during normal page editing for the placed components.	Options that a template author can modify when configuring a page template.
The content displayed by the component and how it will ultimately appear on the page.	What options the page author has available when editing the component
For example, Formatting of content text, rotate an image on a page	For example, Which text formatting options are available, which image in-place options are available

 

Component Styling

The styles of most Core Components can be defined using the AEM style system.

A template author can define which styles are available for a particular component in the Design Dialog of that component.

The content author can then choose which styles to apply when adding the component and creating content.

 

Core Components can be tricky to integrate in project:

To get up-and-running with Core Components in your own project, there are four steps, which are detailed below in 4 steps:

1.     Download and Install

2.     Create Proxy Components

3.     Load the Core Styles

4.     Enable the Components

 

Step 1:

Download and install

Releasing new versions of the Core Components more often allows Adobe to be more flexible in delivering new features. Developers in turn can be flexible in which components they choose to integrate into their projects and how often they wish to update them.

Step 2:

Create Proxy Components

Core Components must not be directly referenced from the content. To avoid that, they all belong to a hidden component group ( .core-wcm or .core-wcm-form ), which will prevent them from showing up directly in the editor.

 

Instead, site-specific components must be created, which define the desired component name and group to display to page authors, and refer each to a Core Component as their super-type.

These site-specific components are sometimes called "proxy components", because they don't need to contain anything and serve mostly to define the version of a component to use for the site.

However, when customizing the Core Components , these proxy components play an essential role for markup and logic customization.

Step 3:

Load the Core Styles

For using in your project create a Client Library that contains all of the CSS and JS files that are needed for your site.

On the Client Library of your site, add the dependencies to the Core Components that might be needed. This is done by adding an embed property.

Make sure that the proxy components and client libraries have been deployed to  AEM environment.

 

Step 4:

Allow the components

The following steps are to be performed in the Template Editor .

·        In the Template Editor, select the Layout Container, and open its policy.

·        In the list of Allowed Components, select the proxy components created previously, which should show up under the component group assigned to them. Once done, apply the changes.

·        Optionally, for the components that have a design dialog, they can be pre-configured.

In the pages created from the edited template, you should now be able to use the newly created components.