Featured in Collection 04 Adobe Summit
Extending Adobe Target Functionality and Availability

Extending Adobe Target Functionality and Availability

Today, visitors interact with brands on touchpoints well beyond traditional web and mobile sites. They might deposit a check into their bank account or check-in to their hotel room via a mobile app, explore insurance plan options and select the right one for them via a digital kiosk, or even get product information from an AI-powered digital assistant. As customers’ expectations and brand engagements evolve, so does web technology.

Brands are more frequently opting to build a significant portion of their web experiences on one of many popular single page application (SPA) development frameworks for a more seamless customer experience. These brands want to use Adobe Target to personalize and optimize throughout these single page application frameworks just as they have with traditional websites, but there is the added complexity of multiple state or route changes within single page applications that occur after a page loads within the framework. We have several new enhancements that make working within these complex environments immensely easier.

I am thrilled to share three new features we’re releasing that support our goal of extending Adobe Target functionality and availability to more people and places for use in today’s “Modern Web” single page application frameworks. These features include:

  • Visual Experience Composer for mobile applications
  • Visual Experience Composer for single page applications (SPAs)
  • React JS (SPA) Implementation Framework for Adobe Target

Modify mobile app experiences using the Visual Experience Composer

In recent years, mobile has shifted into center stage in terms of  the customer experience. More customers now visit brands from mobile devices, and they’re making instant decisions on those devices and expecting real-time delivery of personalized experiences and offers.

Yet marketers have struggled to rapidly deploy testing and personalization activities on mobile the way they have done with the web. That’s particularly true with mobile applications due to reliance on developers for making modifications to the app and dealing with the complexities of the app release cycle. Adobe Target Senior Product Manager Nimit Kumar explains, “Marketers need the ability to rapidly and independently deploy their personalization strategies sooner on mobile apps. They can’t wait for developers or app development cycles and launches. And developers want marketers to be able to make those changes independently, too.”

To give marketers this independence, Adobe Target is introducing the Visual Experience Composer for mobile applications. That same ability marketers have had to easily create experiences for Target activities for web and mobile sites is now available for use on their iOS and Android mobile apps. Now non-technical marketers can experiment and personalize on common mobile app elements like prominent content areas, copy, headlines, CTAs, and more, without code, developers, or app store updates.

Getting set up to use this new feature is easy, too. It takes about five minutes for a developer to integrate the Adobe Experience Cloud SDK 5.0 for IOS and Android within the mobile app and activate it to work with Target. After completing a simple two-step authentication process, the feature is ready to use. The app interface displays in the Visual Experience Composer of the Adobe Target interface, and changes to the app made in Target update in real time in the app on the mobile device. Once all experiences for the activity have been completed, the marketer just launches it. App users then begin receiving the appropriate personalized or test experience.

We’re offering a Summit beta for a Visual Experience Composer in the Adobe Experience Cloud SDK 5.0 for IOS and Android that supports A/B testing and experience targeting with support for all other Target activity types coming later this year.

Develop experiences for single page apps in the Visual Experience Composer

Single page applications (SPAs) implemented on popular frameworks like React and Angular and custom implementation frameworks are the new norm for the websites of today’s “modern web.” Website visitors love SPAs because they deliver an almost interruption-free experience. When visitors click a link, rather than the entire page reloading, only the impacted area of the page updates. It’s fast. What’s not to like?

SPAs indeed deliver a great customer experience, but they challenge marketers and developers who want to deploy more complex personalization strategies. That’s because most approaches for showing offers rely on the visitor’s browser to request the offer to display as the page loads. With SPAs, because the page doesn’t reload, the script on the page that requests the offer from an optimization solution doesn’t run with a traditional web deployment. To make offers display, marketers must rely on developers to provide code to call the solution when those changes need to be made, or continuously call the solution, which can be tedious.

This was our impetus to create the first (and only) client-side library file engineered expressly for SPAs and the modern web in 2017 – AT.js – with extension libraries that enable a practitioner to very elegantly connect directly into the state/route changes within a single page application for a discrete call to Adobe Target.

This greatly enhances the speed of activity set-up for practitioners, and developers would much prefer to do a one-time setup and let the marketer take control of using Target on the SPA website.

We’ve been developing for SPAs and the modern web for a while now. In 2018, we are taking this ground-breaking research and applying it to the entirely new Visual Experience Composer, giving marketers the agility and control they need to build rich, personalized experiences at scale, no matter what framework or architecture they use.

Nimit describes one of the refinements that the Target team developed for the Visual Experience Composer to support SPAs:

“With an SPA website, the URL often doesn’t uniquely identify what gets shown in the browser as it does with the traditional web in which each click opens a new page and URL. That can make it difficult for marketers to figure out where they are in the SPA when modifying or creating experiences. For example, a travel aggregator website could have a flight reservations section or a hotel reservations section that displays in its SPA when a visitor clicks a tab. These aren’t page changes, but rather what developers call ‘view’ or ‘route’ changes.”

To address this issue, Nimit says “Developers can now write a single line of javascript code that lets the marketer know whenever a new view has displayed by putting a breadcrumb trail at the top of the Visual Experience Composer.” Nimit says, “These seemingly small things can make a big difference to a marketer.”

This new feature will be available through the first-look program in April.

Simplify using Target on React SPAs with the React JS implementation framework

With SPAs on the rise as an enterprise architecture, no framework is more ascendant than the SPA development framework, React. A key reason for its popularity is the method it uses to render SPA components in the browser, which makes delivery of those components incredibly fast. However, that same method also presents issues when using experience optimization solutions that are not developed for SPAs to modify those components—the experiences might not get applied, get partially applied, or disappear altogether at some future point.

To work around this issue, marketers have had to rely on IT teams to create complex custom code or hardcode the test or personalization experience on the SPA website. But once again, reliance on IT creates a bottleneck for testing and personalization scale and velocity. We believed there had to be a better way.

We built the React JS implementation framework for Target, a framework designed specifically for React architectures that enables us to tightly integrate Adobe Target with the popular SPA framework. Once implemented, non-technical marketers can create experience variations for components of their React JS websites using the full capabilities of the Adobe Target Visual Experience Composer. They can also push those experiences live when they launch the activity—in most cases, with no IT assistance needed and no degradation of website performance. The framework will be released on Github this spring.

A continued commitment to all our users and their customers

Nimit summed up the commitment to our customers that these features represent. He says, “We focus on helping our customers deliver the power of personalization everywhere in two key ways. First, by making it super easy for marketers to take control of their personalization strategies and deploy them in a do-it-yourself manner, and second, by giving developers the tools and APIs they need to enable personalization on modern web frameworks, mobile, and IoT devices.”

Next up on the Target features announcements at Adobe Summit? A feature that will help marketers meet the ever-increasing demand for more content to test and personalize in Target. Check the Personalization blog tomorrow!

Recommended Articles