Create an Interactive Communication using the Interactive Communication editor. Use drag-and-drop functionality to build the Interactive Communication, and preview both print and web outputs on different device types.
Interactive Communications centralize and manages the creation, assembly, and delivery personalized, and interactive correspondences. Utilize print as master channel for web, you can minimize effort duplication in creating the web output of the Interactive Communication.
The following are the prerequisites for creating an Interactive Communication:
Log in to the AEM author instance and navigate to Adobe Experience Manager > Forms > Forms & Documents.
Tap Create and select Interactive Communication. Create Interactive Communication page appears.
Enter the following information. :
Tap Next. The screen to specify print and web channel details appears.
Enter the following:
For more information on print channel and web channel, see Print channel and web channel.
Tap Create. The Interactive Communication is created and an alert box appears. Tap Edit to start building the contents of the Interactive Communication as explained in Add contents using Interactive Communication authoring user interface. Alternatively, you can tap Done and choose to edit the Interactive Communication later.
After you have created an Interactive Communication, you can use the Interactive Communication authoring interface to construct its contents.
For more information on the Interactive Communication authoring interface, see Introduction to Interactive Communication authoring.
The Interactive Communication authoring interface is launched when you Tap Edit as mentioned in Create Interactive Communication. Alternatively, you can navigate to an existing Interactive Communication asset on AEM, select it, and tap Edit to launch the Interactive Communication authoring interface.
By default, the print channel of the Interactive Communication appears, unless the Interactive Communication is web-channel-only. The Print channel of the Interactive Communication displays target areas, as available in the selected XDP/print channel template. In these target areas and fields, you can add components or assets.
With the Print channel selected, select the Components tab. The following components are available in the print channel:
Component | Functionality |
---|---|
Chart | Adds a chart that you can use in Interactive Communication for visual representation of two-dimensional data retrieved from an form data model collection. For more information, see Using charts in Interactive Communications. |
Document Fragment | Allows you to add a reusable component, such as text, list, or condition, to an Interactive Communication. The added component could be either form data model-based or without a form data model. |
Image | Allows you to insert an image. |
Drag-and-drop the components into your Interactive Communication and configure them as required.
With the print channel selected, go to the Assets tab and apply the filter to display only the assets you want to see.
Using the Assets browser, you can also directly drag and drop assets into Interactive Communication target areas.
Drag-and-drop the document fragments into the Interactive Communication. Following are the types of document fragments that you can use in the print channel of the Interactive Communication.
Document Fragment Type | Example purpose |
Text | Text for adding address, recipient's email, and body text of the letter |
Condition | Condition to add the appropriate header image to the communication based on the type of the policy: Standard or Premium. |
List | Group of document fragments, including text, conditions, other lists, and images. |
For more information on document fragments, see Document Fragments.
To set up binding of variables, tap a variable and select (Configure) and then set up the binding properties in the Properties panel in the sidebar.
You can also choose to configure the relevant text document fragment. The Properties panel displays the list of variables in the text document fragment. You can tap (Edit) next to a variable name to display that variable’s settings for editing.
To add a table, with the print channel selected, in the Assets tab apply the filter to display only the Layout Fragments. Drag-and-drop the required layout fragment to the Interactive Communication. A layout fragment is based on an XDP and can be used to create graphical layouts or static and dynamic tables in Interactive Communication that get populated with dynamic data.
Example: A layout table to display gross premium, loyalty discount %, and emergency roadside assistance availability for old and the new policies.
For more information on layout fragments, see Document Fragments.
With the print channel selected, in the Assets tab apply the filter to display images. Drag-and-drop the required images to the Interactive Communication, such as for company logo.
Further, manage the following in the Interactive Communication:
Sychronizing web channel with the print channel
Switch to Web Channel. The web channel appears in the Interactive Communication editor. When you switch from the Print channel to the Web channel for the first time, the automatic synchornization takes place. For more information, see Synchronizing web channel from the print channel.
Since we are using Print as master for the web in this example, the Print channel placeholders, content, and data binding get synced to the web channel. However, you can change and customize the specific content in the web channel as required.
To add additional components in the Web channel, with the Web channel selected, tap Components. Drag-and-drop components in the web channel of your Interactive Communication as required and proceed to configure them.
Components | Functionality |
---|---|
Chart | Adds a chart that you can use in Interactive Communication for visual representation of two-dimensional data retrieved from a form data model collection. For more information, see Using chart component. |
Document Fragment | Allows you to add a reusable component, text, list, or condition, to an Interactive Communication. The reusable component you add to an Interactive Communication could be either form data model-based or without a form data model. |
Image | Allows you to insert an image. |
Panel | The Panel component is a placeholder for grouping other components together and controls how a group of components, such as accordion and tabs, are laid out in the Interactive Communication. A panel component also allows you to make a group of components repeatable for the end user, such as in multiple entries required for filling in educational credentials. |
Table | Adds a table that lets you organize data in rows and columns. |
Target Area | Inserts a target area in a web channel to organize the web-channel-specific components. Target area is a plain container that allows you to group web-channel specific components. |
Text | Adds rich text to the web channel of an Interactive Communication. Text can also make use of form data model objects to make the content dynamic. |
As required, insert assets in your web channel.
You can preview your Interactive Communication to see what the print and web outputs of the Interactive Communication look like and continue making changes, as required.
You can use the Preview option to evaluate appearance of the Interactive Communication. The web channel of Interactive Communication also provides an option to Emulate experience of an Interactive Communication for various devices. For example, iPhone, iPad, and Desktop. You can use both Preview and Emulator options in conjunction with each other to preview the web outputs for devices of different screen sizes. The sample data in the preview is populated from the specified forms data model.
Select the (print or web) channel to preview and tap preview. The Interactive Communication appears.
The preview is populated with the specified form data model’s sample data. For more information on previewing the Interactive Communication with some other data or using the prefill service, see Use form data model and Work with form data model.
For the web channel, use to view how the Interactive Communication looks on various devices.
Further, you can Prepare and send Interactive Communication using the Agent UI.
In the Print channel, you can configure the attachments and library access to allow the Agent manage attachments in the Agent UI for the Interactive Communication:
In the Print channel, highlight the Document Container and tap Properties.
The Properties panel appears in the Sidebar.
Expand Attachments and specify the following properties:
Allow Library Access: Select to enable library access for the agent in the Agent UI. If enabled, the Agent can add files from the library while preparing the Interactive Communication.
Allow Re-Ordering Of Attachments: Select to enable the Agent to re-order the attachments with the Interactive Communication.
Max Number Of Attachments Allowed: Specify the maximum number of attachments allowed with the Interactive Communication.
Files To Be Attached: Tap Add and browse to select files to be attached and specify the following:
Tap Done.
While editing the Print channel of an Interactive Communication, hover over a field, which is built in the Print channel template, and select (Configure).
The Properties dialog appears in the sidebar.
Specify the following:
Name: JCR node name.
Title: Enter a title that will be visible to the Agent in the Agent UI and in the Document Container tree.
Binding Type: Select one of the following binding types for the field.
Default Values: Default value ensures that the field is not empty when there is no value provided by the specified data model object or text fragment. If the data binding type is none, the default value is prepopulated in the field.
Editable By Agent: Select to allow the agent to edit the value in the field in the Agent UI. This setting is not applicable if Binding Type is Text Fragment.
Label: Specify a text string displayed with the field to the Agent in Agent UI. This setting is not applicable if Binding Type is Text Fragment.
Tooltip: Enter a text string that will be visible on mouse over to the Agent in Agent UI. This setting is not applicable if Binding Type is Text Fragment.
Required: Select to make the field mandatory for the Agent. This setting is not applicable if Binding Type is Text Fragment.
Allow multiple lines: Select this field to allow multiple lines of text as entry in the field. This setting is not applicable if Binding Type is Text Fragment.
Tap .
To conditionalize components or content in the interactive communcation, tap the component/piece of content and select (Create Rule) to launch Rule Editor.
For more information, see:
You can add dynamic tables in Interactive Communication using layout fragments. The following steps use an example of a credit card statement to illustrate the use of a layout fragment for creating a dynamic table in an Interactive Communication.
Ensure that the required layout fragment for creating the table is available in AEM.
In the print channel of your Interactive Communication, drag and drop a layout fragment (with a multi-column table) in a Target Area from the Asset browser.
A table appears in the Interactive Communication layout area.
Specify data binding for each of the cells of the table. To create a repeatable row, insert form data model properties in the row belonging to a common collection property.
Tap a cell in the table and select (Configure).
The Properties dialog appears in the sidebar.
Configure the properties:
Name: JCR node name.
Title: Enter a title that will be visible in the Interactive Communication editor.
Binding Type*: Select one of the following binding types for the field.
Data Model Object: The form data model property whose value is populated in the field.
Default Value: Default value ensures that the field is not empty when there is no value provided by the specified data model object. The default value is pre-populated in the field.
Editable By Agent: Select to allow the agent to edit the value in the field in the Agent UI.
Tap .
Preview the Interactive Communication to see the table rendered with the data.
You can create a web-channel only dynamic table in an Interactive Communication using a data model property of type collection. Such a table is a representation of a collection property’s child properties. You can edit only the formatting properties of the various cells in the table.
Switch to the Web channel and then choose to display the Data Sources browser.
Drag and drop a collection property into a subform.
A table gets created in the subform.
Preview the table in the web preview of the Interactive Communication.
When you select Print as Master for Web Channel while creating an Interactive Communication, the Web channel is created in sync with the Print channel and the content and data binding of the Web channel is derived from the print channel and the changes made in the print channel are reflected in the web channel when you tap Synchronize.
The authors are, however, allowed to break the inheritance for components in the web channel, as required.
Click to enlarge
If you are using Print channel as the master for the Web channel and you switch to the Web channel from the Print channel, automatic synchronization takes place. The automatic synchronization brings the placeholders, content, and data binding into the Web channel from the Print channel. Depending on the complexity and content of your Interactive Communication, automatic synchronization may take a little time.
Synchronizing the channels syncs only the document fragments, images, conditions, lists, and layout fragments from the print channel to the web channel. The subforms or parent nodes of that include such elements are not synced.
In the web channel, the components are embedded in the target areas.
Hover over the relevant target area in the web channel and select (Cancel Inheritance) and then in the Cancel Inheritance dialog, tap Yes.
The inheritance of the components within the target area gets canceled and now you can edit them as required.
In the Web channel, if you have cancelled inheritance of a component, you can re-enable it. To re-enable inheritance, hover over the boundary of the relevant target area, which includes the component, and tap .
The Revert Inheritance dialog appears.
If required, select Synchronize The Page After Reverting Inheritance. Select this option to synchronize the entire interactive communication. If you do not select this option only the relevant target area gets synchronized on reinstating the inheritance.
Tap Yes.
If you are using Print as Master for Web Channel and make changes to the print channel, you can tap Synchronize to bring the newly made changes to the web channel.
To synchronize the Web channel with the Print channel, tap Synchronize.
Synchronize Content From Master Channel dialog appears.
Tap one of the following: