Lightning Speed: Adobe’s Edge Delivery Service

Transcript

Good morning. Good afternoon. Good evening. Wherever you may be, joining us from across Japan and Asia, Asia-Pacific. My name is Scott Rigby. I’m the principal product manager for Adobe Commerce across this region. And welcome to our monthly series. We had a bit of a holiday break in July, but we’re back again this month and we’re super excited. We’re going to be talking about its delivery, which is one of our big announcements that happened at our customer event in the US in March this year. And we now kind of move through our DRP program and is now generally available for availability as customers and partners. So with today we got Cam. So Cam Radhakrishnan is a senior solution consultant. He is based here in Australia and he’s going to be walking us through what it means to deliver Adobe Edge at lightning speeds and what it’s going to deliver for both you as a customer or if you’re joining us as a partner for your customers. So I want to hand it across to Cam to kind of take it away. Excellent. Thank you, Scott. Cool. So, yeah, I’ll take you through Adobe’s delivery service. So today’s customers expect instant gratification. Retailers with a slow or a mobile unfriendly website are losing sales when it comes to commerce experiences. Speed is King Henry. 100 millisecond delay in loading your page. You know you’re losing 7% chance to convert. So working with retailers, they face a significant hurdle. Many struggle to deliver experiences that meet customer expectations. Based on my experience, the three major pain points are the skill gap. Often, customers say templates are just takes a long time to build templates and build engaging experiences. So it usually ranges in the order of like, you know, weeks or months. There’s often results in missed opportunities and convoluted experiences taken to market. If if it flops, it also lowers your net Promoter score. This then gets the retailers thinking if they are even getting a return on investment on their solutions. Well, why Adobe is yet here about conversion and value in a simple graph. Following traditional approaches results in lower conversion and lower value. While with edge delivery services promises to deliver higher conversion and higher value through high impact experiences, extreme content, velocity and rapid development. Let me explain to you what these three pillars mean. With some demonstrations. So when it comes to content creation, no matter what sophisticated platforms retailers have. Subject matter experts often resort to tools like word documents and Excel sheets. Documents go through many hands. Finally, someone copy paste the content to launch an experience. Knowing that we have made word document and Excel sheet the default way of content authoring. So what you’ll see is as part of the content creation process, I’d be using word, document and Excel sheets to create content. I’d be hosting my content as part of a Google drive. But you also have the choice of choosing SharePoint if you if that’s that’s your preference. Also, retailers also have the ability to pick Adobe Experience Manager. If you are looking for that, what you see is what you get kind of an editor. Obviously you get it done. When content is ready, you can publish it to the edge delivery services, which then renders each experience as a block on your web page. When it comes to third party solutions, we follow an API based approach for integration. Okay, let me demystify and take you through what this what this all means. Just to keep it simple, I’m going to, you know, take you through what a simple edit to a homepage looks like. So here I am on my Chrome browser. I’m launching my Google Drive. As you can see, I’ve organized. I have a route protocol. It’s commerce, which is where I’ve organized all my folder structures. Each of those folder structures pertain to different sections on the website. And each of these documents, as you can see, pertain to the pages of your website. So the index document specifically refers to the home page for your website. So let me open it up. As you can see, I’ve opened up a familiar Google Drive word document and it’s basically composed of a number of tables, as you can see. Pretty straightforward, right? So if I have to make a simple content change, maybe if I want to welcome you all to this particular session, let’s add a message. Say, welcome to the IDs demo. So I type it out all easy. So once I’m happy with the changes, I can then launch the sidekick. Sidekick is a Chrome extension. You also have this extension available across all the other popular browsers. So once I’m happy with the change that I made, I can hit preview and see how that experience looks like. So right now it’s presenting to me the word document in a web page format just to, you know, get, get ensure that I’m happy with the changes that I make. As you can see, the plain table based word document has translated itself into a pretty engaging website, and that you can also see the little change that I introduced to the to the website. And any time that I’m on the URL, I want to highlight, if you see the dot page, I’m actually on the preview. And if it’s not like I’m on a on a production side, the customers engaged. As you can see, my web page has a number of engaging experiences. And, you know, this allows me to now get into feedback from my other peers and, you know, and partners if I choose to. Once I am happy with the content, I can then hit publish on the sidekick, and then that launches the page to my customers. So the dot live extension in the URL indicates that the page has gone live. I can see my changes come through and my customers can now see and engage with this content. So that’s how simple it is in terms of well, in terms of organizing your content within a Google drive to SharePoint and making organizing your content, making changes and, and taking like. So that was just to introduce an existing or a homepage content which is got, you know, all the widgets as part of it, just making a little change right now. Let’s see what adding a new experience block would look like. So I’m back on my home page again, right? I’m editing the index page. So as you can see, I’ve got all the changes that I had from last time, and I have to probably choose a place that I want to introduce this new experience. BLOCK By clicking on the library in the Sidekick, I have the ability to launch this tool which allows me to grab a list of pre-fabricated content blocks. So as you can see, I have a number of content blocks for different purposes. In this case, let’s say we want to introduce a carousel which talks about mountaineering and camping experiences. Once I pick the block, I have the ability to say, okay, how does it look on different device types just to ensure its responsive? And I’m happy with the changes. So I can do that quite easily and get a preview of I also have the ability to in context, edit and ensure my characters and the word lens fit, etc… Once I’m happy I’ve done my basic tests. I can copy the block into my word document. So you don’t have to know what this structure itself. So the site structures actually come from the library, right? So once I’m a copy pasted, now I can start tailoring the content to suit my needs. In this case, I want to, you know, change the default placeholder image. Maybe with the mountaineering image and just just let it resonates with the content. I can seamlessly engage with my asset library and find the suitable asset. So I’ve got a suitable asset. Now I can seamlessly replace that asset and the placeholder asset with a mountaineering asset. So now that I’ve sort of like I’ve done with the mountaineering piece, I want to now start, know, editing my camping experience in this case. So provided a title again, looking for an image here with the relevant keywords. I can find the image that I want from my asset library, replacing the placeholder image with the, the real image and voila, that that’s done. But but then there is some more work to be done, right? So my camping experience still talks about the placeholder content. That’s when I can use Jenny as a mechanism to generate some engaging content for me. So here I am in Generate Variations, a widget which allows me to create content that prompts. So I can now tell my Jenny I variation tool to basically create some camping related content which also relates to mountaineering and provide some, you know, context as to why it needs to be placed so that, you know, it makes it a lot more engaging. Identify the audience that this particular content pertains to, in this case travel and hospitality, and also importantly, specify the tone of voice as a brand. Every brand has a tone of voice. The way you engage with your customers. So they they know, you know, they have that sort of brand relevance. So now you can, you know, specify it can also give some example of wanting to say, okay, any time you create content through the prompts, also use that as a mechanism for tone of voice. So once I’ve done that, I can hit generate, which allows me to generate three different variations of, of content, which I can which have the liberty to choose. So as you can see, based on the problem that I provided, I have I have been and presented with three sets of prompts. I can scroll through, read through and find out which of these pieces of content engage with me. I think I like the the virgin remote. So I am going to copy this piece of content and get it onto my get it onto my experience on my homepage. So it’s really simple in terms of like in how quickly you can add content and also use Jenny as a as a, as a copilot in terms of, you know, creating content. So replace my placeholder content and then I it’s all about, you know, repeating the same steps in terms of reviewing the content, ensuring you’re happy as a content, not that creating this content. As you can see, we can see the carousel show through and I can engage, it responds and all of that. So I’m happy with the content that’s that’s being presented here. And once I’m happy with the preview and my peers are happy, I am able to hit the publish button, which basically launches the site, which basically launches this particular experience like so. So that’s that’s how simple it is in terms of like, you know, how you can, you know, create in a new experience blocks onto your website, add them and also use some of the generic capabilities and your asset library that you might have centralized all your assets. So now that you’ve seen how easy it is, it was to, you know, do some of those changes. The classic question arises, so what? Right. So with edge delivery services, we have democratized the content creation process. Everyone can create content. You don’t you don’t need any specific training before you need to create some content so everybody can, you know, create content with lower the bar, the faster you can take your ideas and products to market, the higher the chances are then or up the high. The chances for them to convert. So moving on to the next main pillar I want to touch upon is the high impact experiences. How many of you know what Google Lighthouse Score means here? If if you do know like in a post, a yes or a no in the chat window would be great. Cool. So Google Lighthouse Code is a score that Google assigns to every website and ranges from 1 to 100 higher. The score meaning the site is faster and easier for your visitors to engage with on the internet. The average website has a lighthouse score of 23 with edge delivery services. We promise to deliver a perfect score of 100, setting you up for improved conversion. So with that, let me show you how we can run a quick test on the website that we’ve been working on so far. So back on my on my live page, which my customers are engaging with. So as part of Google Chrome using the inspect widget, I can launch the the lighthouse tool and here I am triggering the lighthouse code to do a performance check, an accessibility check, and also its ability to sort of and also assess the best practices that’s been followed as part of this development process. Right. So right now, it’s doing all that kind of tests on my website. And there you go. It presents a perfect score of 100. So that’s how easy it is in terms of like altering your changes and also like, you know, testing your changes because all these components are pretty optimized to deliver the perfect score of 100. So business at Adobe like Business Adobe website used to have a lighthouse code of about 15. After we moved it into edge delivery services we were able to develop. Have you been able to sort of deliver a perfect score of 100? So what this means, I mean, Lighthouse Score 100 is quite technical, but what it means from a business perspective is that it improved the organic traffic and also increased engagement and lowered the bounce rates. So now that we understand how content blocks work, I want to, you know, introduce you to how you can build ecommerce experiences as part of your website as well. So commerce experiences are delivered using commerce drop ins, which is it uses an API based approach to integrate with Adobe Commerce. And so far we’ve been looking primarily at the content logs playing with text and images and things like that. Now we are specifically going to look into the commerce drop ins, so so as you can see, the commerce drop ins that a number of out of the box blocks that are available for commerce when it comes to commerce. So you have the ability to add a product listing page, the product detail page, card, checkout, user authentication, and a number of custom blocks can be further built using these blocks as a foundation. So there is SDK available for it. And the way some of these blocks interact with commerce is through API. So let me quickly take you through what that process for setting up commerce blocks look like and also touchpoint, integration and everything. Okay, so I am back to my Google Drive. So as you can see, I’ve got a number of things. So I’m here editing the, the configuration which connects the edge delivery service and Adobe commerce. As you can see, I’m on an Excel sheet editing a bunch of key values. So these key values are primarily used to enable the handshake between actively services and commerce. Moving on, I have my equipment page, the equipment listing page, which what I’m sort of looking at curating a product list page, setting up the the, the category ID, the category name that the URL part and all the different enrichments that I want to add as part of the page in terms of, you know, filters and things like that. So once I’m done with creating my A given page, I can again repeat the same process of preview and publish to basically take my changes. Like I want to show you a few more things while I’m here from from a commerce perspective. I also I’m working on a recommended list of products for my for my from Oklahoma subside. So as you can see, I have curated a list of products that images, categories, the names and also the SKUs that they pertain to all in an Excel sheet. Once I’ve created this in an Excel sheet, the major power lies in terms of when I try preview. It’s not going to create a webpage for me, but it’s actually going to create an API endpoint for me. So the API, so as you can see here, it’s actually taken the Excel sheet and published it into a dot Jason endpoint. So what this means is it gives you the power to actually push content to any channel beach your website beach or mobile application or your partner website, so you can centrally manage all your content from that Excel sheet going on. So here I’ve got my product details page, which is again captures a number of elements around what we want to show about our product, what specifications in the images, the add to CART, you know, adding it to your wishlist, etc… Right? So this could all be like an optional elements. So I’ve added them. And in addition to that I’m also including the recommendations widget to my product details page. So as you can see, the recommended products is actually pointing to a JSON. So it’s a service and it’s pointing to the service end point, right? So when it all comes together on my website as a customer, when I engage with it, if I go to the shopping section of the website, which is the occupants part of the site, I can see all the products listed for that particular category and all the filters that go with it. And if I do the classic step of picking a particular product and looking at the detail of it, I can see all the attributes of the particular product being listed here in this view as well. And I can also see all the products that I was curating within my Excel sheet show up as part of my as part of my product detail page as the happy shopper. I’m happy I want to pick the shirt. I can add it to Cart. And what this does then allows us to go through the whole checkout process, which again is a drop in that’s available as part of the eCommerce. So you can further enhance some of these drop ins if you want to like, you know, add additional, you know, payment options and things like I’d say there’s always the opportunity to extend some of these drop ins using the SDK that’s available of the product. So hopefully that gave you a good idea in terms of, you know, what some of those commerce drop means and how you can sort of start to engage with it. So going back to our sowhat moment, right? So what you’ve seen in the last two demonstrations was the ability to have a super fast website which has a perfect lighthouse score of 100. And what this helps you do is to boost your organic traffic and coupled with engaging and rich commerce experiences, this can significantly drive your revenue growth. So again, we’ve been like now all the things that we’ve been doing so far on the Beacon website are purely based on our intuition and our gut feeling. You know, we haven’t tested we haven’t tested approach in terms of like, you know, what works best, what could what this would look like, right? So that’s why the whole concept of experimentation, you know, comes into play. And experimentation is natively available as part of its delivery service as well. So let me take you through what experimentation looks like in this case. I’m back at my home page document that we were editing earlier. So all the different experiences that make up my home page. So towards the end, as you can see, the page also has its metadata. BLOCK Along with that, you have these three experimental variants through, which is where you can actually feed in the experiments. So I’ve also got like, you know, the Challenger one and Challenger two to go with these experiments. So this is a Challenger one experiment that I’ve got here which allows me to, you know, promote some diving experiences for my customers and I can preview it independently to ensure it looks and, you know, engages correctly with my with what I want. And I’ve also created another challenger to experience, which is all about possibly journeys. So I’ve got these two challenger experiences created and I have my control experience, which is, which is, which is the page that we’ve been sort of editing all along. So I’ve got my Challenger one, Challenger two. So what I need to now do is go to my control experience, which is the default experience and map the Challenger one and Challenger two experiences. So I’m basically just saying I’m setting those two different variants as part of my page metadata. I also have the option to split my traffic to say 33, 33 for my Challenger one and Challenger two and 34 goes to my control experience. Now I can preview the content to ensure, like I said, I’m to it’s my home page and only to be messed up so I can actually preview using this little green widget here you can simulate. Okay, what if I was part of the control experience, what my experience would look like? What would I see? Which is what would I see if I was in a part of the Challenger one or Challenger two experience. So yeah, the little bit just helps me just, you know, get that sort of confidence and also helps more from a review perspective as well. Just to ensure, you know, everybody organization is comfortable with the whole experimentation process. So I verified that my to experiment and to expect a variance are looking good now when I launched the page they get attacked as they get randomly searched again based on the split that you have provided. So I can now, you know, going on to the homepage, I can now see no longer see the Bush experience, but I can see the the deep dive, the diving experiences, which also has a 20% discount. So so that’s that’s how simple it was in terms of like, you know, taking I mean, taking any sense of doubt and just experimenting and finding out what actually works with your customers. So you’re taking some data, database decisions. So so we’ve been like, you know, all along doing a number of things to this point. Now we’ve also done experimentation, but but all that we have been doing it completely from from our perspective to say, okay, by that it’s been working for us and all the stats are primarily from us, right? But we also want to know how it’s actually working and performing for our end customers. That’s where the whole real user monitoring comes into play. So let me take you through what what we offer from a real user monitoring perspective, as you can see. So Edge Services natively provides real user monitoring as well. So you can embed as part of your experiences. As you can see it, it tells me how customers are engaging in different and different from a different devices perspective and also from specifically from a page perspective, right? So the more greens that are, the higher the the lighthouse score. And it’s like in a performant and, and great. Whereas I can also see that I’d like some you know experiences which are, which are amber and red, which means to say that you know that I have some job to do and areas to optimize and fix as well. But yeah, real user monitoring keeps us all honest and ensures we can. We are constantly tuning those experiences and ensuring that performance is up for our customers. When it comes to real user monitoring, there are three main variables that are used, as you can see LCP seals and Iron Peak. So LCP meaning the largest contentful paint, it simply means how quickly the main section of your home page load or any page for that matter load so that you know the customer can see something in a shop as soon as they launch the website. When it comes to accumulative layout shift, it identifies like is your website is your web page like constantly shifting and moving as part of the whole page load process which, which can sometimes, you know, confuse your users. So the lower the the, the layout shift but it is and finally and B relates to how quickly you can actually interact with your customers. It’s the whole interaction being expand so how quickly customers can interact with your website and how snappy it is. So that’s what the ANP, you know, mainly measures. So it starts here, you know, Aurier and NOP draws different devices. I have all the information now to identify areas that some of the components are lagging in performance or, or or are likely to be perfectly optimized. The this moment again. So both experimentation and real user monitoring are are both provide like you know, real good data insights experimentation provides database insights for making informed decisions about content optimization marketing strategies, and leads to improved user experience, while the real user monitoring constantly gives you feedback around performance as to how your customers are experiencing the website, which is again crucial to your conversion process. You absolutely don’t want any friction in the process to ensure, you know, the customers are having a really good experience on your website. So so we’ve covered, you know, the two main pillars around high impact experiences and extreme content. Lastly, that the third main pillar is all about rapid development. So traditional approaches, I usually follow a linear approach, which means from design to delivery. It can take weeks, if not months, for the whole process to complete or even for the content or even for your matchdays to see something being built. While delivery services gives marketers the choice to to create the content that they want first. So it’s always a content first approach. So you create your content that you want to take to market, and then then come the designers and the developers who basically all they do is like decorate the content and then you can basically launch in, iterate on those experiences. So all your components are purely require CSS and just JavaScript. So that way it just, you know, and it’s more fundamental and foundational and you’ve got that sort of skill available quite easily. And every, it’s a foundational skill for every web. Dolapo So it’s not a problem anymore in terms of like, you know, finding skillset to run new platforms. Haynes is a great example, and so Haynes is already taking advantage of edge delivery services with their Maidenform website. They have I’ve seen incredible results. They have a little score of overnight defy across all their pages, and it’s quite easily the fastest website in the world since they moved onto its delivery services. They’ve seen of forex and forex, you know, improvement in their page load time and organic traffic has doubled, you know, since they launched on edge services. So again, going back to the key three pillars, the keys to success are make your make high impact experiences with a lighter sport off hundred empower everyone within the organization to create content and finally, speed up development by making the big simple. This is just the beginning. The future holds exciting possibilities and I can’t wait to see what we can achieve together. Thank you so I put together a list of links where you can find more information in terms of like, you know, building some of these experiences yourself and some boilerplate commerce experiences that you can also start with. In my experience, it usually takes like less than 15 to 20 minutes to actually set up your environment and get a feel for it. So yeah, I’m Corey Jolly. I’m more than happy to answer any questions and very thanks again. That was great. Yeah, there is a question. It says for an existing website. Do we copy the structure of an existing page onto a word doc? Just not too sure or how clear and the word doc marries up with the page and knows which section to update. Okay, so we have a like a like a site importer tool which can maybe help you of the with the migration policies. Each section of the each section of the page like you know if you think about the, the banner, the the teasers or the product list they all relate to a table within the word document. So our table has, as you have seen, as part of the demos as well. So every table has a title as part of it. So the title determines, you know, what that particular blocks and what’s the code that it has to sort of use to render that experience. So yeah, it’s, it’s quite straightforward. I mean, once you sort of like, you know, migrate your content over and then and show that properly mapped to the right rendering components, then the content of the component rendering blocks. Thanks game. Any, any, anything else. That’s it for the moment. We might give everyone just a minute to see if there’s any further questions. Actually there is another question. Could you also. Clarify. How well AM works with an existing website with thousands of SKUs? So So yeah. So there are obviously a number of customers, you know, who use, who use Adobe Experience Manager along with Commerce as well. So is there a specific challenge that you have that that you want to sort of like, you know, maybe, you know, call out? I mean, overall, I’ve never come across any challenges as such that a specific area that you want to sort of like, you know, pick big with. So I am natively, you know, as I as I showed you, you know, through the through the integration can, you know, connect with commerce and, you know, based on the different product categories, you can, you know, build out your listing pages and so on, so forth. Again, it’s all completely API based. And I mean in terms of connecting from a delivery services to to commerce, it’s a very I’m just thinking how easy it would be to import existing configurations. So as I showed you, I mean, what I showed you is again, like, you know, just, just the beginning, right? So it establishes the Excel sheet that I showed you, captures all the key value pairs in terms of establishing connection with the or with the ecommerce engine. And from that point onwards, you know, you can constantly, you know, bring forward any other configurations that might relate to any integrations and things like that to further enhance. But you know, what I showed you is just the, just the beginning in terms of how you can establish that connectivity between these two different systems. Um, Okay. Moving on to the next one, could you suggest tools for website performance testing and, and monitoring? So like, like when it comes to edge delivery services, Lighthouse Code is, is something that we use as a, as a key. For example, anytime you do your core development, we ensure all the code is compliant and it wouldn’t sort of, you know, impact your SEO or performance in any way. So we, we, we perform a test called the experience audit to ensure, you know, it, it meets some of those guidelines before we you know then let them you know get deployed to production instances. But again like when it comes to performance testing that like obviously a number of tools like like you know, meter and you know others as well in order to step us say but the other like number of tools out there in the market which could be used for testing like Jamie to load run us on support everything else. Yes this is available for Magento users as well. Yeah. As you mentioned, I’m able to split the test content with control and do addition. Is it possible to test to prove to any which. So yeah it is available for you know your product pages as well so I took you through a content page but yeah you can a similar approach for your product page as well because the product page again has your commas drop ins. But towards the end every page has a metadata block. So which allows you to then, you know, put your different challenging variations and you know, accordingly split traffic and tons of what But yeah, it’s possible any of the questions in. Like there might be a rep can. Oh that’s another. One we. Could use a just a tool for product search in search bar and that’s from a search perspective like commerce provides an eBay search is I mean Scott the only way I can talk to some of the search capabilities in there. So life search. So life search is one of our search capabilities that’s available as part of your license and has the ability to be able to do, obviously, you know, predictive search. It has the ability to be able to make, you know, filter suggestions. You have the ability to be able to create facets that you can then use search components in different parts of the site. And search is one of those dropping components for EDGE. That is, it’s actually available to certain buyer at the moment. Sexy, available as a dropping component, I think from early next month. I think yeah, from from a from a content perspective, you know, there’s always the option of using third party search engines. Elasticsearch comes to mind again. You have the choice to use many of those as well. That’s available in the cloud market. Pick them up there can okay All right a big thank you to Cam for for joining us today ta ta talk you through it Hopefully you’re as excited as we are and you’re keen to go and pilot it. Obviously, this you know, sandboxes are ready to go. Utilize that and get up and running. We’re running beta programs at the moment. If you’re interested, please contact us. But like I said, it’s yeah, I think we’re almost three divided program. We had lots of responses from customers to test it out. Usually once we get to, you know, over sort of ten, 20 customers on data, it becomes gray. And so, you know, we encourage you to just start to leverage this technology because it delivers, you know, amazing performance as well as delivering you some, you know, benefits from search engine optimization. But also it increases the traffic from, you know, it being better indexed within search engines. So a fantastic technology. We’re currently to start using it. So that’s a wrap for us from the Commerce webinar for this month. Next month, we’re going to have Sean McBride, who’s my peer based out of the UK, and Sean’s going to be talking about generative AI. We have a new integration with AM Asset, so a digital asset management solution. And Sean is going to be talking about, you know, what does that mean for commerce users, how to be able to leverage this integration between the two technologies. How do you utilize the amazing generative AI capability that Adobe has produced throughout that very quickly iterate and create assets that you can then use within your commerce instance? So please look out for the invite and then registration for that. We’d love to see you again then. And so with that, that’s a frosty Again, thank you to Cam and Dominic can tell you the team helping behind the scenes and we’ll see you next month