Create code-based experiences create-code-based
In Journey Optimizer, you can create code-based experiences in a journey or a campaign.
Specific guardrails and recommendations for code-based experiences are detailed in this page.
Add a code-based experience through a journey or a campaign create-code-based-experience
To start building your code-based experience through a journey or a campaign, follow the steps below.
To add a code-based experience activity to a journey, follow these steps:
-
Start your journey with an Event or a Read Audience activity.
-
Drag and drop a Code-based experience activity from the Actions section of the palette.
note note NOTE As Code-based experience is an inbound message activity, it comes with a 3-days Wait activity. Learn more -
Enter a Label and Description for your message.
-
Select or create the Code-based experience configuration to use.
-
Select the Edit content button and edit your content as desired using the personalization editor. Learn more
You can also use an existing content template as a basis for your code content. Note that the templates available to choose are scoped to either HTML or JSON based on the channel configuration that has been chosen beforehand. Learn how to use content templates
-
If necessary, complete your journey flow by dragging and dropping additional actions or events. Learn more
-
Once your code-base experience is ready, finalize the configuration and publish your journey to activate it. Learn more
For more information on how to configure a journey, refer to this page.
To start building your code-based experience through a campaign, follow the steps below.
-
Create a campaign. Learn more
-
Select the type of campaign that you want to execute
-
Scheduled - Marketing: execute the campaign immediately or on a specified date. Scheduled campaigns are aimed at sending marketing messages. They are configured and executed from the user interface.
-
API-triggered - Marketing/Transactional: execute the campaign using an API call. API-triggered campaigns are aimed at sending either marketing, or transactional messages, i.e. messages sent out following an action performed by an individual: password reset, cart purchase etc. Learn how to trigger a campaign using APIs
-
-
Complete the steps to create a campaign, such as the campaign properties, audience, and schedule. For more information on how to configure a campaign, refer to this page.
-
Select the Code-based experience action.
-
Select or create the code-based experience configuration. Learn more
-
Edit your content as desired using the personalization editor. Learn more
You can also use an existing content template as a basis for your code content. Note that the templates available to choose are scoped to either HTML or JSON based on the channel configuration that has been chosen beforehand. Learn how to use content templates
For more information on how to configure a campaign, refer to this page.
Edit the code content edit-code
-
From the journey activity or the campaign edition screen, select Edit code.
-
The personalization editor opens. It is a non-visual experience creation interface which allows you to author your code.
-
You can switch the authoring mode from HTML to JSON, and vice versa.
note caution CAUTION Changing the authoring mode will result in losing all of your current code, so make sure to switch modes before you start authoring. -
Enter your code as needed. You can leverage the Journey Optimizer personalization editor with all its personalization and authoring capabilities. Learn more
-
You can add HTML or JSON expression fragments if needed. Learn how
You can also save part of your code content as fragment. Learn how
-
With code-based experiences, you can use the Decisioning feature. Select the Decision policy icon from the left bar and click Add decision policy. Learn more
-
Click Save and close to confirm your changes.
Now as soon as your developer makes an API or SDK call to fetch content for the surface defined in your channel configuration, the changes will be applied to your web page or app.
Test the code-based experience test-code-based-experience
To display a preview of your modified code-based experience, follow the steps below.
-
In the journey or campaign, from either the personalization editor or edit content screen, select Simulate content.
-
Click Manage test profiles to select one or more test profiles.
-
A preview of your modified code-based experience is displayed.
Detailed information on how to select test profiles and preview your content is available in this section.
Preview on device preview-on-device
When building code-based experiences for web pages or mobile apps, you can preview your personalized experiences right on your browser or on your mobile devices, in order to see how these experiences look on real devices.
-
From the Simulate screen, click the Open preview options button. The preview options depend on the platform selected in your code-based configuration.
-
If you are using a Web platform in your code-based configuration, the Device preview URL read-only field is pre-filled with the URL entered for the current channel configuration.
You can either:
-
Select the Copy link button and paste the link into a browser tab. You can also share the link with your team and stakeholders, who can preview the new experience in any browser before the changes go live.
-
Click Open in new tab to open the link in your current browser.
-
Scan the QR code with your mobile device to open the preview link on a mobile browser.
-
-
If you are using Mobile platforms (iOS / Android) in your code-based configuration, the Deeplink read-only field is pre-filled with the Preview URL value entered in the channel configuration for the selected platform.
Toggle between the iOS and Android tabs to preview your experience for the platform of your choice.
You can either:
-
Select the Copy link button and share the link with your team and stakeholders, who can preview the new experience in any mobile browser before the changes go live.
-
Scan the QR code with your mobile device to open the preview link directly in the mobile application. You must enter the PIN on your device to establish the Assurance session.
note note NOTE Adobe Experience Platform Assurance is a product from Adobe Experience Cloud to help you inspect, proof, simulate, and validate how you collect data or serve experiences in your mobile app. Learn more
-
-
Preview links are generated for the selected test profile and, if you are using Content Experiment in your journey or campaign, for the selected treatment.
When updating the content, or selecting a different test profile or treatment, the preview link is automatically refreshed. You can copy the link into different browser tabs, and compare the experiences.
Make your code-based experience live code-based-experience-live
Once you defined your code-based experience and edited your content as desired using the code-based editor, you can activate your journey or campaign to make your changes visible to your audience.
You can also preview your code-based experience content before making it live. Learn more
Once your code-based journey or campaign is live, your app implementation team is responsible for making explicit API or SDK calls to fetch content for the surfaces defined in the selected code-based experience configuration. Learn more on the different customer implementations in this section.
Publish a code-based journey publish-code-based-journey
To make your code-based experience live from a journey, follow the steps below.
-
Verify that your journey is valid and that there is no error. Learn more
-
From the journey, select the Publish option, located in the top right drop-down menu.
note note NOTE Learn more on publishing journeys in this section.
Your code-based journey takes the Live status and is now visible to the selected audience. Each recipient of your journey can see your modifications.
Activate a code-based campaign activate-code-based-campaign
-
From your code-based campaign, select Review to activate.
-
Check and edit if needed the content, properties, configuration, audience and schedule.
-
Select Activate.
note note NOTE Learn more on activating campaigns in this section.
Your code-based campaign takes the Live status and is now visible to the selected audience. Each recipient of your campaign can see the modifications you added to your content.
Stop a code-based journey or campaign stop-code-based-experience
When a code-based experience is live, you can stop it to prevent your audience from seeing your modifications. Follow the steps below.
-
Select a live journey or campaign from the respective list.
-
Perform the relevant action according to your case:
-
From the campaign top menu, select Stop campaign.
-
From the journey top menu, click the More button and select Stop.
-
-
The modifications you added will not be visible anymore to the audience you defined.