Trust Your Instincts

Trust your instincts when you're working with Adobe Test&Target. Recently a customer of mine applied a Test&Target A/B test to part of their site. We let it run for close to a month and at the end of the test we were ready to declare a winner, but the results were odd. Both the IA on the project and I thought that the results were odd. A button at the bottom of the left hand column, below the page fold was a clear winner over a button at the top of the right hand column. It made no sense, but we trusted in the analytics that were returned and began proceeding with plans to update our experience. It turns out that a few days into our test, another dev team applied a change to the header, which changed the ID of a div container which essentially broke our Test&Target test and only rendered the left hand column button, so after running away with the early portion of the test, the right hand column button was the only experience being rendered which allowed it to catch up and surpass the left column experience. The moral of the story is not to just blindly trust the statistics that Test&Target generates when you see something that doesn't add up. Lessons Learned: 1) Its important to know what the other development groups are touching. This was an innocuous change which shouldn't have impacted us, but it did. 2) Be sure to target you T&T tests to a very specific tag ID to avoid these kinds of situations. 3) Trust your instincts, go looking for a failure in the test, when you think your results are odd.

Experience Driven Commerce Brings the Storefront to Your Consumer

As 2014 opens and we reflect on 2013, I want to talk about a topic which I spent most of last year working on, Experience-Driven Commerce (EDC). EDC is a concept that enables customers to have a personalized, immersive digital experience that blurs the lines of discover, share, shop, buy, and serve. Databases, web content management, and commerce can now be unified to deliver unprecedented experiences. For example, a consumer can watch a video and buy within the video from a tablet while storing to ‘my favorites’ and share via twitter all at one time without ever leaving the video. EDC marries content with several different technical platforms to maximize data on a consumer in order to bring a dynamic and immersive shopping experience to consumers. Big data dominated many technical discussions in 2013 and I don’t see any reason why it will change in 2014. The one thing I know and most of us understand about big data is extracting and using fine grained pieces of that data is not a trivial affair. We’ve spent decades using relational databases to store and retrieve information. We are very good at using relational databases, but they can only serve up the information that we put into them. And thus the old axiom, garbage in garbage out. We must be careful what information we use to market to a consumer, because there aren’t many chances to serve an effective advertisement before it becomes redundant and forgotten. This is the great challenge of big data, to get only the relevant data and use it effectively. Now imagine a world where brand experience is not separate from, but in fact, the front line in our eCommerce endeavor. The marketer already owns a toe-hold on content sites, with the banner space above the header, in the right rail and perhaps as an overlay in a video. Experience driven commerce is not some new ground to be tilled. Instead I like to think of experience driven commerce in the same way as we think about and recognize predictive email marketing. Experience driven commerce requires a high level understanding and focus to market goods to consumers via the internet. Retailers have been selling goods and services via the internet for well more than a decade and a half and they have continually struggled to differentiate themselves and drive sales. It’s easy for a brick and mortar retailer to cross sell, up sell a consumer once they are in the store. The concept has been perfected for decades, but consumers continue to abandon traditional retail channels in favor of eTail. New channels are still being defined and picking which ones that are here today, will be here tomorrow is a challenge every digital marker faces, especially in 2014. There is so much content on the internet today, there are an infinite number of opportunities to attract a potential consumer. The eTailer has already struck up a relationship with the content providers through banner ads and perhaps through service providers for in text links and sponsored content. This however is too easy for a consumer to avoid. I like to think of this as the elementary start of experience driven commerce. Last spring we showed a potential customer how they could weave a nearly endless set of eCommerce opportunities on their site through subject matter tutorials they had already created. They liked the idea and we continue to work with them on both technical implementation and digital strategy planning. In the same way a product marketer associates their goods with a popular intellectual property in order to gain the consumer’s attention and drive an impulse buy; we can attempt to use content to draw the site visitor into a new experience for conversion. This kind of experience needs to tightly couple content and commerce together as we move into a new golden age of digital marketing. No longer will eTail be able to stand on only one good leg. A site with good content, but a poor commerce experience will be left behind. In truth, even good content and good commerce still need strong analytics, predictive email marketing and an integrated effort serving customers laser guided product suggestions. Take the Geometrixx demo which Crown developed this past summer, where we combined compelling content with commerce, analytics and highly targeted product recommendations. The demo starts with a video that is entirely content driven. This video follows a snow boarder down a mountain side. There is nothing to suggest that it’s an eCommerce experience, until the viewer is invited to view the gear the snow boarder is using. By the time the site visitor arrives at this video, you know a decent amount about them. You know about at least one of their special interests and perhaps whatever other information you might have been able to extract from various cookie swaps and shares with the content host and other content providers. Perhaps this person has already patronized your business, so you know their purchase history and can highly customize the eCommerce experience you are presenting to them on the fly. You may even have access to their social graph through their activities on your site or a partner’s site. While a new snow board or pair of skis might not be a typical impulse purchase, a pair of goggles, gloves or another less expensive item might be. By allowing a site visitor to add items to their cart, mid-experience and then allow them to continue their experience with minimal distraction, they can complete the immersive video and checkout. In architecting the Geometrixx Experience, we used flagship Adobe products like Test & Target, Recommendations and Search & Promote to refine the retail experience for our notional shoppers while serving a state of the art web content management authoring experience for the content authors in CQ5 and Scene7. The result is to provide marketers a bleeding edge system that allows for easy customization and rapid refinement of the eCommerce experience by delivering best of breed tools to create marketing content that will redefine the organization’s digital marketing. When I architected the Geometrixx Experience I took the approach of allowing the marketer the same level of control in creating content as I have had over the last three years architecting Adobe CQ5 systems for content authors who were just taking control of content for the first time. CQ5 provides a platform which enables the content author to have more control over their content then they ever had in the past as well as the agility to instantly deliver new content eCommerce to sites. Marketers can quickly and intuitively refine the products they are highlighting and update floundering products and campaigns quickly. In a mission critical situation, this could be a matter of minutes or less to publish new content or product offerings. I’ve seen other retailers enhance their eCommerce experience by offering the customer the chance to add “the look” to the cart or highlight related items through typical cross selling modes. While this is an enhanced cross sell experience, its not an experience that’s necessarily going to drive new customers to an impulse buy. Call it a higher level of awareness, but it’s not the experience which is going to yank a customer out of their seat and into your virtual store. In order for this mode of marketing to be effective, consumers need to already have arrived at your site with a general want in mind. You might not even have any useful information about this shopper when they arrive. There is little opportunity to refine the pitch you’re going to make to them. Blind marketing is still the most rudimentary form of marketing. The effective marketer needs to go to where the customer is consuming content and market to them right there in a highly focused manner. Only through a carefully crafted and managed set of experiences where the marketer can customize the pitch to the person behind the web browser in a dynamic manner can we leverage the big data tools to deliver a highly personalized and effective internet shopping experience. Using tools which allow the marketer to introspect the user browsing and shopping history to deliver to them the experience they want while consuming a more effective marketing approach is going to be the key for the next generation digital marketer. By focusing on delivering commerce connected with content, the storefront can be virtually “pushed” or “presented” wherever content may go – including social sharing, apps and more – extending your “storefront” to the entire web. At the end of the day, an experience driven approach to eCommerce gives a good marketer with great tools the opportunity to maximize conversion. You’re going to get out of it, what you put into it.

Maximizing Your Adobe Experience Manager Authoring Experience

As Adobe Experience Manager becomes a bigger and more broadly integrated platform, the authoring experience (AX) needs to be more fully considered by business analysts and information architects when developing system requirements and designs. In the past, web content management systems have been maintained by a team of developers or perhaps the savvy in house business user who has developed some acumen with modifying JSP, ASP or PHP. However, for a CQ system to be truly successful for an organization, its AX needs to be sufficiently simple and engaging for the typical business user to adopt an authoring role for the system. Without broad user adoption a CQ system cannot deliver on its short term ROI promise and the agility in rapidly delivering content to the market place that CQ provides authors with only a modest amount of training. To ensure a high level of author adoption, IAs and BAs must design authoring interfaces which are at least as engaging as the interfaces which they are designing for the end user, because the AX is someone’s job, but consuming the content (UX) is in many cases an optional, but a none the less important experience, regardless of the goal of the website, be it retail, informational an application for collecting and disseminating information. Let’s look at a couple of examples starting with an authoring dialog I came across recently:

The component is a 9x9 product grid. The authoring scheme works, but it requires the author to blindly enter information into a plain extJS dialog. Why not render the grid with a product category component in each cell and engage the authors in the same ways as the UX designer has chosen to engage the customers for this site while collecting the same component configuration properties? Another benefit of this simplified author engaging approach is that it’s much easier to render a grid with a fairly simple content component rather than write the JavaScript to modify each of the tabs as the user selects from a drop down menu in the first tab. A simplified approach makes for a faster velocity during development, fewer defects and a more modular approach to component development. Another thing I saw on my current engagement is that the existing integrator developed a slide show component where they set up the authoring scheme in a similar manner to the experience I just described above.

My approach is at least as easy if not easier to develop and it provides the author with a better experience. The current integrator is developing the slide show with a multi input to choose images or flash presentations along with setting text and URL parameters. Sure it is easy to reorder your slides, but it’s not the rich and rapid feedback authoring experience that CQ promises and companies shell out a substantial amount of money for. My approach is to have the only authorable parameter on the slide show to be a folder in the content tree, where the users create pages of a simple and specific template that presents them with an authoring experience just like any other CQ page, where users can drag in images, edit and revise text in place and see how that text looks in real time which fulfills the promise and potential for CQ. Another benefit of my approach is that you could potentially nest different kinds of interface components, such as items from the Scene7 suite, Flash or some kind of dynamic UX, into a slide rather than be locked into a static look and feel. There is no reason why most if not all aspects of a CQ5 site shouldn’t be maximizing the capabilities of CQ5, especially as the AEM suite encompasses more and more aspects of a site’s enterprise with CQ hooking into Test & Target, Search & Promote, ExactTarget, SiteCatalyst, hybris and the rest of the Adobe Cloud offerings. If your first point of focus is not your authors when you designing a new site to be integrated on CQ5, rethink your design effort, because it’s your authors who seriously impact how much value you return from your CQ5 investment. CQ5 offers so much value in not requiring developers to maintain the content and so much agility by having your business users and managers publishing their own content on demand. With CQ content can go from the author to the live production site as quickly as the author can render it and the approver can accept and publish it. No developer driven WCM system can compete with this kind of agility in the 24/7 marketplace that we live in and serve today. If you have questions or comments, feel free to contact me at rraphael@crownpartners.com. - See more at: http://www.crownpartners.com/blog/maximizing-your-adobe-experience-manager-authoring-experience#sthash.bPy4fFV8.dpuf

Previewing the Adobe/ExactTarget Connector

Having just put a wrap on my 2012 ExactTarget Connections experience, I wanted to briefly sum up the preview I got see of the ExactTarget/Adobe CQ5 connector, thanks to my friends at Adobe. Officially it’s called Adobe CQ Marketing Campaign Management (CQ MCM). Having only recently been exposed to the ExactTarget suite of tools, my first exposure to the email template creation tool was a light bulb moment. The ExactTarget content creation tool worked very much like a CQ authoring environment. You can create templates for entire emails and subtemplates to be used in multiple emails with a lot of drag & drop and in place content editing. My eyes of course lit up when I saw it and immediately saw why these tools found each other and why everyone saw a need for a coupling between them.

Getting started with ExactTarget inside of CQ is just like working with any other CQ Cloud Service; you’ll need to create the connection between CQ and ExactTarget in the same way as how you connect to a tool like Scene7. Simply navigate to the Cloud Services console, expand the ExactTarget dialog, clicking Configure Now and create an ExactTarget Configuration. Then you’ll be prompted to enter your company, username and password to connect to ExactTarget. Once you’re authenticated, you will have access to the ExactTarget Landing Page template type for creating content. The thing that really makes this coupling so compelling is the melding of CQ and ExactTarget functionality. When you pull an asset from the CQ5 Digital Asset Manager (DAM) into an ExactTarget Landing Page, CQ remembers where that asset was referenced, in the same way as when you use that assent on a typical CQ page, so no matter what channel your engaging your customers, you’re meeting them with a consistent professional message. With CQ MCM you can rapidly and more accurately identify the ROI of the campaign, which is essential in helping justify marketing expenditures which insures smiles from both the CMO and the CFO.

For my current customer who already uses ExactTarget and is considering CQ to replace their existing web content management system, this functionality is beyond valuable. They have significant privacy concerns and it’s essential for them to keep track of where every asset is used in case they need to remove that asset from their production email runs. Furthermore, you’ll have less replication of assets and little to no chance of assets becoming stale between DAM and ExactTarget. When you look at a platform that integrates content management, digital marketing and analytics, like this connector creates, it provides a tremendous value in being able to track content from creation through a marketing campaign, to the user clicking through on your website instantly in order to measure the effectiveness of your campaigns and content pages across your enterprise.

Once an ExactTarget Landing Page has been created in CQ, you can affect workflow processes on that page, just like any other CQ page before publishing that ExactTarget Landing Page to the ExactTarget platform. Once the Landing Page has been published to ExactTarget, you’re moving back into the realm of 100% ExactTarget, where you’ll need to log into the ExactTarget console to utilize the landing page for sending communications to your subscribers.

My preview was brief, but so is the nature of creating content in CQ for ExactTarget. So many features on these two platforms function in a similar fashion, it really quite simple for CQ administrators and content authors to create ExactTarget Landing Pages. Because of how intuitive the CQ authoring environment is and how similar it is to the ExactTarget templating environment. ExactTarget users will have very little learning curve for working within CQ and reaping the benefits that the CQ environment will bring to this powerful technology synergy.

Basic Template Inheritance Tutorial for Adobe CQ5

In coming to an engagement where I am helping one of the world’s most iconic fund raisers migrate from an aging and unwieldy Vignette integration to Adobe CQ5, one of their biggest concerns is with template creation and construction which for them is one of their primary pain points. While this might be an onerous task in Vignette, I don’t find the same to be true with CQ5, especially once you get your integration started and have a couple of master templates to inherit from. Having spent the day on the ground with the customer and the evening with a couple of new to CQ5 consultants, explaining how template inheritance work, I felt like capturing my thoughts and illustrating how quickly and easily a child template could be created. To start with, assume we have a basic parent template already created, with a fairly basic layout that is probably pretty common to many websites out there; a header, footer, left column navigation, a center content body and a right rail. Our parent template content component probably looks something like this:
homepage_main
content.jsp – includes some basic HTML & includes of the rest of the template content

header.jsp – includes the html to render out top banner and site wide links
footer.jsp – includes html to render typical boiler plate at the bottom of the page
leftnav.jsp – includes the html or an include of the navigation component
contentbody.jsp – lets make this simple for now, just an include of a parsys
rightrail.jsp – same as contentbody, just a parsys
Now a page of type homepage_main is going to be pretty plain, with 2 separate content areas for authors to drop content in a free form manor that has become one of the key differentiators of CQ5. Now this is a fairly simple template that any even remotely practiced CQ5 developer could create in say, an hour or two, depending on how convoluted the front end code is. Now is where the inheritance model of CQ5 really comes into play and really empowers the developer to create additional new templates quickly. The requirements for the system state that a specific marketing tout appear at the top of the right rail on a significant percentage of the pages. So, quickly create a new template …

Create a new template called childpage under apps//component/page
Provide a name for this template, assign it properties for allowedParents, allowedChildren and then set up the sling:resourceSuperType
For the sling:resourceSuperType, set the value to apps//component/page/homepage_main

For simplicity sake, just grab the rightrail.jsp from homepage_main and add either the code for your marketing tout or an include of the appropriate component. You can either replace the parsys or leave it there under the marketing tout for further content.

Under apps//component/template create the template component of the same name and set the sling:resourceType on the _jcr_content node to point to your new page component These last 5 steps shouldn’t cost you more than 10-15 minutes and you’ve created a consistent look for a large group of pages, you’ve saved your content authors a ton of time going from page to page adding the marketing tout to the parsys and you’ve ensured that the content is right 100% of the time.

Now, lets say that we need a page type with a marketing tout and a specific title component above the parsys that displays the page’s jcrTitle. So repeat steps 1-5, but now set the sling:resourceSuperType to point to childpage. Instead of grabbing the rightrail.jsp, copy the contentbody.jsp and edit it to include your title component. And that’s it, you’ve created a page template in a modest amount of time and created its child and grandchild templates in a trivial amount of time. I hope this tutorial simplifies and demystifies the concepts of template creation and inheritance for all of you out there. As always, if you have questions or comments, feel free to contact me.

Keywords: WEM WCM WXM Adobe CQ5 CQ5.5 Java

Modifying an extJS Authoring Interface in CQ5

I wanted to share this piece of code with the community. It was developed by one of the other developers, Braxton Diggs, on my team integrating the new travel.state.gov site and I really felt like this was some cool code that I hadn’t seen anything like anywhere on the net. One of the customer needs was to have a precise control over the size of the content being entered by their authors. As you might imagine, an organization like the State Department of United States has a lot of authors and lot of sometimes arcane rules and operating procedures. To accommodate this need to control content size, we developed this counter code as well as a limiter. Here is code for how we count the characters being entered in a field of xtype richtext as well as display the counter on the top right corner of the richtext dialog. I think that this is a pretty slick integration, because it controls the content entry right at the point of content entry, rather than just truncating the user input or displaying an error message after the fact. To begin, we will need a design_dialog in our over ridden text component with a property called maxchar, which will be used to dynamically limit the input size for our richtext field. You could limit the text somewhere in the code we’re showing here or you could as we have done, allow a user with access to the Design mode to control the size of the input, making this a very flexible piece of code. Then as part of our authoring dialog, we need 2 particular items; a richtext field called text and an nt:unstructured node that we called listeners. The listeners node has a property called render, which this has bit of javascript as its value:

function(){ var dialog = this.findParentByType('dialog');//find dialog var rte = dialog.findBy(function(p){ return (p.getXType() == "richtext");})[0];//get dialog that contains richttext rte.on({ activate:function(textarea){//fires when user clicks inside textarea processContent(textarea.getId(), textarea.getValue()); } }); maxchar = MaxChar();//get maxmimum character dialog.on({ beforesubmit:function(textarea){//before sumbit/"OK" button if(ValidateText(textarea.getId(), maxchar)){//if passes return true; }else{ CQ.Ext.Msg.show({"title":"Houston we have a problem!", "msg":"You have too many characters in the textarea, please delete some characters!
You are only allowed "+maxchar+" characters."}).setIcon(CQ.Ext.Msg.WARNING);//custom dialog alert return false; } }, deactivate:function(textarea){ResetCounter(textarea.getId(), maxchar);//On close run reset function } }); }

The javascript in the text component code listed below catches each keystroke action and records if a character has been entered into the richtext area and increments or decrements the counter and cuts the user off from entering text beyond the limit specified in the maxchar property in the design_dialog.

function ResetCounter(id, maxchar){//Function fired when dialog is closed if (maxchar > 0) {//zero or less than disables limiter var txtlen = $("#"+id).find('iframe').contents().find('body').text().length;//Get Text Length $("#"+id+"_txtcount").html(txtlen+"/"+maxchar).hide();//Whenever dialog is re-opened it will have correct length } } function processContent(id, val){//Function initalizes text limit. id - open dialog unique ID. val - Not used var rte = "#" + id; var maxchar = <%=currentStyle.get("maxchar", 0)%>;//custom max characters if (maxchar > 0) {//zero or less than disables limiter if ($(rte+"_txtcount").length != 0) { $(rte+"_txtcount").html("");//show nothing if nothing is in textarea }else { $(rte).prev('div').find('table td[class*=right]').prepend('

');//disabled text limit } $(rte).next('div').find('iframe').contents().find('body').bind("keydown keyup keypress", function(e) {//attach event handler to textarea var char_code = e.which;//capture keystrokes var txtlen = $(this).text().length;//textarea length $(rte+"_txtcount").html(txtlen+"/"+maxchar).show();//show text if (!(txtlen < maxchar || char_code == 46 || char_code == 8)) return false;//do not allow typing if greater than limit, backspace and delete if (txtlen/maxchar >= 0 && txtlen/maxchar < 0.25) {//0-25% $(rte+"_txtcount").css("color","#008000");//change colors }else if (txtlen/maxchar >= 0.25 && txtlen/maxchar < 0.5) {//25-50% $(rte+"_txtcount").css("color","#cccc00"); }else if (txtlen/maxchar >= 0.5 && txtlen/maxchar < 0.75) { $(rte+"_txtcount").css("color","#ee7700"); }else if (txtlen/maxchar >= 0.75) { $(rte+"_txtcount").css("color","#FF0000"); } }); } } function ValidateText(id, maxchar) {//function fires when user hits ok button on dialog var txtlen = $("#"+id).find('iframe').contents().find('body').text().length; if (txtlen<=maxchar || maxchar == 0) { return true; }else{ return false; } } function MaxChar() {//get max character return <%=currentStyle.get("maxchar", 0)%>; }

The Business Case for Adobe CQ5

In making the case for an expensive software integration, short term vision is rarely going to bare out the costs. But midterm expenditures show, from a variety of viewpoints, the value and utility of an integration with the Adobe CQ5 platform. The coming updates (CQ5.5) on the venerable Adobe WCM/CMS will make an even more intuitive authoring environment that behaves more and more like the applications users utilize on a daily basis.


As an IT manager, the last thing you want to see is ANOTHER integration in your enterprise. CQ5 is different though: it lightens the load because it’s a self-contained system that takes full advantage of the Java technology stack. This means that you can stand up your CQ5 enterprise in a modular fashion, giving you a cohesive system without worry about being tightly coupled to the rest of your enterprise systems. It also allows you to integrate CQ5 with the rest of your backend systems at a pace that suits your enterprise.

From the point of view of the UX designer, CQ5 is a tool like many other WCM’s which can integrate any vision for your website or web application. CQ5 is flexible enough to allow the implementation to control what goes where and how authorable content appears. CQ5 provides a seamless platform for content governance. The design and implementation of the CQ5 templates, pages, and components, ensure that there is no way for unauthorized users to modify anything other than the content on designated areas, ensuring content approvers control what content is actually published. CQ5’s templating model ensures that new pages look and behave just as intended by the designer, controlling what kinds of content can be placed on different areas of the page.

As a business user or brand manager, CQ5 provides a nearly instant platform for delivering new or modified content to your users and customers. In a traditional application framework such as Struts, Spring, Java ServerFaces, PHP, ASP.NET, Cold Fusion, etc., business users need to change content, often resulting in a change order that has to be delivered to the software development department or software contractors. But with CQ5, as soon as you have your change requirements firmed up, content authors can make these changes and content approvers can publish them. Changing content on a CQ5 web page is frequently as easy as editing a Word or Power Point document.

A past customer was spending in the region of one million dollars a year maintaining about 400 hundred JSP pages with their out sourced IT partner, who on average took 3 weeks to turn around even the simplest modifications, such as changing verbiage on the page or swapping out a Flash presentation.

Now: imagine an enterprise where the manager of any given department decides that they need to update some content or revise some media. As soon as they know what content or media needs to be updated, they can begin editing page content and uploading new images, media, or files to the CQ5 Digital Assent Manager (DAM) and inserting those new files into new or existing pages. Then it’s just a matter of submitting the new or updated content to the content approver for publishing.

The publishing workflow can be as complex or as simple as needed, including content approvers from any corporate department, such as legal, IT, marketing, etc. Once the content approver(s) receive notice of a change and can approve it, the new content is published to your live site for your customers.

CQ5 is a complex platform and learning how to wield it to make real business changes is difficult. If you have any questions about CQ5 functionality, or want to know how NavigationArts is optimizing the platform, feel free to leave a comment below.