Blog posts by AllThingsOpti2025-05-30T14:46:33.0000000Zhttps://world.optimizely.com/blogs/allthingsopti/Optimizely WorldA day in the life of an Optimizely Developer - How Optimizely Opal AI transforms marketing operations with infinite scale<p class="whitespace-normal break-words">In May 2025, Optimizely revolutionized its AI capabilities with the next evolution of Opal, delivering what the company calls an "infinitely scalable workforce" for marketing teams. This isn't just another AI tool—it's the industry's first AI assistant built from the ground up specifically for marketing.</p>
<p class="whitespace-normal break-words">The significance extends beyond impressive metrics. As businesses face mounting pressure to deliver more content, run more experiments, and personalize more experiences with flat or shrinking budgets, Opal AI represents a fundamental shift in how marketing operations scale.</p>
<p class="whitespace-normal break-words">What makes Opal particularly compelling is its deep integration across the entire Optimizely One platform—from content management to experimentation to personalization. Unlike standalone AI tools that require complex integrations, Opal works seamlessly within existing marketing workflows, powered by Google's advanced Gemini models and backed by Optimizely's decade of domain expertise. For business leaders evaluating AI investments, understanding Opal's comprehensive capabilities and proven ROI becomes essential for competitive positioning in an increasingly AI-driven market.</p>
<h2 class="text-xl font-bold text-text-100 mt-1 -mb-0.5">The evolution from AI features to agentic workflows</h2>
<p class="whitespace-normal break-words">Traditional marketing AI tools typically offer isolated features—generate a blog post here, optimize an email subject line there. Opal fundamentally reimagines this approach through what Optimizely calls "agentic AI," where specialized AI agents work together to complete complex, multi-step marketing workflows.</p>
<p class="whitespace-normal break-words">Consider a typical product launch campaign. Previously, teams would spend weeks coordinating between content creators, campaign managers, and analysts. With Opal's agentic workflows, <strong>specialized agents handle distinct tasks simultaneously</strong>: one agent develops the campaign brief based on brand guidelines and past performance data, another creates multi-channel content variations, while a third sets up experimentation frameworks to test messaging effectiveness. These agents don't work in isolation—they share context and coordinate efforts, much like a well-orchestrated human team.</p>
<p class="whitespace-normal break-words">The platform's <strong>persistent chat interface</strong> maintains conversation history across all interactions, ensuring continuity as teams move between tasks. This contextual awareness proves particularly valuable when dealing with complex campaigns that evolve over time. Marketing teams report that Opal remembers previous decisions, brand preferences, and performance insights, eliminating the need to repeatedly provide the same information.</p>
<p class="whitespace-normal break-words">What truly distinguishes Opal is its <strong>brand-aware intelligence</strong>. The system ingests company-specific data including brand guidelines, visual assets, historical campaign performance, and customer insights. This deep contextual understanding means generated content aligns with brand voice without constant human oversight.</p>
<h2 class="text-xl font-bold text-text-100 mt-1 -mb-0.5">How specialized AI agents revolutionize marketing workflows</h2>
<p class="whitespace-normal break-words">The technical architecture behind Opal's success centers on its specialized agent system. Rather than relying on a single, general-purpose AI, Opal deploys <strong>purpose-built agents</strong> for specific marketing functions. This specialization enables superior performance compared to generic AI tools.</p>
<p class="whitespace-normal break-words">The <strong>Content Creation Agent</strong> understands nuanced brand voice and can generate everything from social media posts to long-form thought leadership articles. It doesn't just write—it strategizes, suggesting content angles based on trending topics and historical performance data. Marketing teams report that this agent reduces brief-to-publish time from days to hours.</p>
<p class="whitespace-normal break-words">The <strong>Experimentation Agent</strong> transforms how teams approach testing. It analyzes past experiments to suggest hypotheses, automatically creates test variations, and provides real-time insights as data accumulates. One particularly powerful feature is its ability to <strong>dynamically allocate traffic</strong> to winning variations, maximizing the value of every visitor. Companies using this agent report running 3-4x more experiments with the same team resources.</p>
<p class="whitespace-normal break-words">The <strong>Campaign Orchestration Agent</strong> manages complex, multi-channel campaigns from inception to completion. It coordinates between different marketing channels, ensures consistent messaging, and automatically adjusts tactics based on performance data. This agent essentially functions as an AI-powered campaign manager that never sleeps.</p>
<p class="whitespace-normal break-words">The <strong>Analytics Agent</strong> democratizes data insights across the organization. Team members can ask questions in natural language—"What drove last quarter's conversion spike?" or "Which content themes resonate with enterprise buyers?"—and receive instant, actionable answers. This eliminates the bottleneck of waiting for analyst resources and enables data-driven decision-making at every level.</p>
<p class="whitespace-normal break-words">These agents work together through Opal's <strong>agentic workflow</strong> system. For instance, when launching a new product feature, the Content Creation Agent might develop announcement materials while the Experimentation Agent simultaneously sets up A/B tests for different messaging approaches. The Campaign Orchestration Agent coordinates the rollout across channels, and the Analytics Agent monitors performance in real-time, feeding insights back to optimize ongoing efforts.</p>
<h2 class="text-xl font-bold text-text-100 mt-1 -mb-0.5">Implementation strategies for maximum ROI</h2>
<p class="whitespace-normal break-words">Organizations achieving the highest returns from Opal follow a structured implementation approach that balances quick wins with long-term transformation. The most successful deployments begin with focused pilot programs before expanding to enterprise-wide adoption.</p>
<p class="whitespace-normal break-words">Critical success factors include <strong>executive sponsorship</strong> to drive adoption, <strong>clear use case prioritization</strong> to demonstrate value quickly, and <strong>ongoing optimization</strong> of agent instructions based on performance. Organizations that treat Opal as a strategic platform rather than a tactical tool report significantly better outcomes.</p>
<p class="whitespace-normal break-words">Common implementation challenges include initial resistance from team members concerned about AI replacing their roles. Successful organizations address this by positioning Opal as an enhancement to human creativity rather than a replacement.</p>
<h2 class="text-xl font-bold text-text-100 mt-1 -mb-0.5">Competitive advantages in an AI-driven market</h2>
<p class="whitespace-normal break-words">Optimizely's market position reflects both its technological capabilities and strategic vision. The company holds leadership positions in multiple 2025 Gartner Magic Quadrants, including <strong>eight consecutive years</strong> as a leader in Content Marketing Platforms. This sustained recognition indicates not just current capabilities but consistent innovation over time.</p>
<p class="whitespace-normal break-words">Compared to traditional marketing platforms adding AI features as an afterthought, Opal's ground-up AI design provides distinct advantages. The platform's <strong>context windows</strong>—its ability to consider vast amounts of relevant information when generating content or making recommendations—exceed most competitors. This translates to more nuanced, accurate outputs that require less human editing.</p>
<p class="whitespace-normal break-words">Against pure-play AI writing tools, Opal's integration advantage becomes clear. While standalone tools might generate decent content, they lack the connectivity to experimentation data, customer insights, and performance metrics that make Opal's outputs strategically valuable. A blog post created by Opal doesn't just read well—it's optimized based on what has actually driven conversions for that specific business.</p>
<p class="whitespace-normal break-words">The platform's <strong>credit-based pricing model</strong>, introduced in May 2025, provides cost predictability while allowing organizations to scale usage based on need. This approach proves more economical than hiring additional staff or engaging agencies for routine content creation and campaign management tasks.</p>
<p class="whitespace-normal break-words">Perhaps most importantly, Opal's position within the broader Optimizely One ecosystem creates compounding value. Organizations using Opal alongside Optimizely's experimentation, personalization, and content management capabilities report synergies that amplify ROI. For instance, content created by Opal can be automatically tested through the experimentation platform, with winning variations feeding back to improve future AI outputs.</p>
<h2 class="text-xl font-bold text-text-100 mt-1 -mb-0.5">Future-proofing marketing operations</h2>
<p class="whitespace-normal break-words">The marketing technology landscape continues evolving rapidly, with AI capabilities advancing at an unprecedented pace. Optimizely's roadmap for Opal suggests several developments that will further transform marketing operations.</p>
<p class="whitespace-normal break-words"><strong>Enhanced personalization capabilities</strong> will enable Opal to create individualized content at massive scale. Rather than segments, marketers will target individuals with AI-generated content tailored to specific preferences, behaviors, and contexts.</p>
<p class="whitespace-normal break-words"><strong>Multimodal content generation</strong> represents another frontier. Future Opal versions will seamlessly create and optimize visual content, videos, and interactive experiences, not just text. This expansion addresses the growing importance of visual storytelling in modern marketing.</p>
<p class="whitespace-normal break-words">The platform's <strong>predictive capabilities</strong> will also expand, moving beyond analyzing past performance to forecasting future outcomes. Marketers will receive AI-powered recommendations about which campaigns to run, when to launch them, and how to allocate budgets for maximum impact.</p>
<p class="whitespace-normal break-words">Industry trends suggest that by 2027, AI-powered marketing platforms like Opal will handle the majority of routine marketing tasks autonomously. Organizations building expertise with these platforms today position themselves for significant competitive advantages as capabilities expand.</p>
<h2 class="text-xl font-bold text-text-100 mt-1 -mb-0.5">Making the business case for Opal AI</h2>
<p class="whitespace-normal break-words">For executives evaluating Opal AI, the business case centers on three compelling factors: <strong>proven ROI</strong>, <strong>scalability without headcount growth</strong>, and <strong>competitive differentiation</strong>. The platform's track record of delivering increased ROI provides confidence in financial returns, while its ability to scale marketing output without proportional team growth addresses a critical business challenge.</p>
<p class="whitespace-normal break-words">The competitive landscape increasingly rewards organizations that can produce more content, run more experiments, and deliver more personalized experiences. Opal enables this at a scale impossible with human teams alone.</p>
<p class="whitespace-normal break-words">Risk mitigation also factors into the business case. With SOC 2 compliance and enterprise-grade security, Opal meets the requirements of even highly regulated industries. The platform's audit trails and governance features ensure AI usage remains controlled and accountable.</p>
<p class="whitespace-normal break-words">For organizations already using Optimizely products, Opal adoption requires minimal additional investment while multiplying the value of existing tools. For those new to Optimizely, the integrated platform approach eliminates the complexity of connecting multiple point solutions.</p>
<h2 class="text-xl font-bold text-text-100 mt-1 -mb-0.5">Transforming marketing's future today</h2>
<p class="whitespace-normal break-words">Optimizely Opal AI represents more than an incremental improvement in marketing technology—it's a fundamental reimagining of how marketing teams operate. By combining specialized AI agents, deep platform integration, and proven business results, Opal delivers on the promise of AI-powered transformation.</p>
<p class="whitespace-normal break-words">Organizations implementing Opal today gain immediate efficiency benefits while building capabilities that will become essential for future competitiveness. As marketing continues its evolution toward AI-augmented operations, early adopters of comprehensive platforms like Opal position themselves to lead rather than follow industry transformation.</p>
<p class="whitespace-normal break-words">The question for business leaders isn't whether to adopt AI in marketing—it's how quickly they can implement solutions that deliver measurable value. With its proven ROI, enterprise readiness, and continuous innovation, Optimizely Opal AI provides a clear path forward for organizations ready to transform their marketing operations through the power of specialized, integrated AI.</p>2025-05-30T14:46:33.0000000ZBlog postA day in the life of an Optimizely Developer - Creating a Cloudflare Turnstile Form Element Block<p>Hello and welcome to another installment of a day in the life of an Optimizely developer. Today I am going to show how to create a Cloudflare Turnstile form element block for use within Optimizely Forms.</p>
<p>Cloudflare Turnstile is an alternative to traditional CAPTCHA systems, providing a user-friendly way to prevent spam and abuse on your website. Integrating Turnstile into Optimizely CMS allows you to enhance form security without compromising user experience.</p>
<p><strong>Prerequisites</strong></p>
<ul>
<li><strong>Cloudflare Account</strong>: Ensure you have a Cloudflare account and have registered your site to obtain the sitekey and secret key - <a href="https://developers.cloudflare.com/turnstile/get-started/">https://developers.cloudflare.com/turnstile/get-started/</a> </li>
<li><strong>Optimizely CMS Setup</strong>: Make sure your Optimizely CMS environment is set up and ready for development.</li>
</ul>
<p>The first task is to create a new Element Block, ensuring that you inherit from ValidatableElementBlockBase, this allows you register a validator against the element.</p>
<p><strong>Turnstile Element Block</strong></p>
<pre class="language-csharp">///
/// Represents a Turnstile element block for form UI. It provides extra resources, specifically a script for Cloudflare
/// Turnstile.
///
[ContentType(
GUID = "{E426413A-1B5D-4353-B715-871F09D556C3}",
DisplayName = "Turnstile",
GroupName = ConstantsFormsUI.FormElementGroup,
Order = 2230)]
[ImageUrl("~/img/cloudflare-turnstile-logo.png")]
public class TurnstileElementBlock : ValidatableElementBlockBase, IExcludeInSubmission, IViewModeInvisibleElement, IElementRequireClientResources
{
private static readonly ILogger _logger = LogManager.GetLogger(typeof(RecaptchaElementBlock));
private Injected _config;
[Display(GroupName = SystemTabNames.Content, Order = -5000)]
[ScaffoldColumn(false)]
public override string Validators
{
get
{
var turnstileValidator = typeof(TurnstileValidator).FullName;
var validators = this.GetPropertyValue(content => content.Validators);
return string.IsNullOrWhiteSpace(validators) ? turnstileValidator : string.Concat(validators, "|||", turnstileValidator);
}
set
{
this.SetPropertyValue(content => content.Validators, value);
}
}
public override object GetSubmittedValue()
{
var httpContext = ServiceLocator.Current.GetInstance();
return httpContext.HttpContext.Request.Method == "POST" ? httpContext.HttpContext.Request.Form["turnstile-response"] : httpContext.HttpContext.Request.Query["turnstile-response"];
}
[Ignore]
public override string Label
{
get => base.Label;
set => base.Label = value;
}
[Ignore]
public override string Description
{
get => base.Description;
set => base.Description = value;
}
///
/// The site key for the Turnstile element.
///
[Display(GroupName = SystemTabNames.Content, Order = -3500)]
public virtual string SiteKey
{
get
{
var siteKey = this.GetPropertyValue(content => content.SiteKey);
if (string.IsNullOrWhiteSpace(siteKey))
{
try
{
siteKey = _config.Service.TurnstileKey?.SiteKey;
}
catch (ConfigurationErrorsException ex)
{
_logger.Warning("Cannot get TurnstileSiteKey from app settings.", ex);
}
}
return siteKey;
}
set
{
this.SetPropertyValue(content => content.SiteKey, value);
}
}
///
/// The shared key between the site and Turnstile.
///
[Display(GroupName = SystemTabNames.Content, Order = -3400)]
public virtual string SecretKey
{
get
{
var secretKey = this.GetPropertyValue(content => content.SecretKey);
if (string.IsNullOrWhiteSpace(secretKey))
{
try
{
secretKey = _config.Service.TurnstileKey?.SecretKey;
}
catch (ConfigurationErrorsException ex)
{
_logger.Warning("Cannot get TurnstileSecretKey from app settings.", ex);
}
}
return secretKey;
}
set
{
this.SetPropertyValue(content => content.SecretKey, value);
}
}
public IEnumerable> GetExtraResources()
{
return new List>() {
new("script", "https://challenges.cloudflare.com/turnstile/v0/api.js")
};
}
}
</pre>
<p>The next step is to create a validator class that needs to inherit from InternalElementValidatorBase, it is this validator that takes the token generated by the Turnstile element, and performs the call to the Turnstile siteverify endpoint, this is a crucial step as without it you can not confirm if the generated token has successfully verified the site.</p>
<p><strong>Turnstile Validator</strong></p>
<pre class="language-csharp">public class TurnstileValidator : InternalElementValidatorBase
{
private const string TurnstileVerifyBaseUrl = "https://challenges.cloudflare.com";
public override bool? Validate(IElementValidatable targetElement)
{
var submittedValue = targetElement.GetSubmittedValue().ToString();
if (string.IsNullOrWhiteSpace(submittedValue))
{
return false;
}
var turnstileElement = targetElement as TurnstileElementBlock;
if (turnstileElement == null)
{
return false;
}
var client = new HttpClient();
var formData = new Dictionary
{
{ "secret", "<your secret key>" },
{ "response", submittedValue }
};
var content = new FormUrlEncodedContent(formData);
var postTask = client.PostAsync($"{TurnstileVerifyBaseUrl}/turnstile/v0/siteverify", content).Result;
var result = postTask.Content.ReadAsStringAsync().Result;
var resultObject = JsonSerializer.Deserialize(result);
return resultObject.GetProperty("success").GetBoolean();
}
}</pre>
<p>The following class allows the Site key and Secret key to be retrieved from config, and is injected into the TurnstileElementBlock whereby the associated Site Key and Secret Key properties are set to the values stored in config.</p>
<p><strong>Turnstile API Key Options</strong></p>
<pre class="language-csharp">[Options(ConfigurationSection = "Turnstile")]
public class TurnstileApiKeyOptions
{
public TurnstileKey? TurnstileKey { get; set; }
}
public class TurnstileKey
{
public string? SiteKey { get; set; }
public string? SecretKey { get; set; }
}</pre>
<p>The following configuration needs to be added to your appsettings.json file which specifies your Turnstile site key and secret key.</p>
<p><strong>Appsettings Configuration</strong></p>
<p><strong><img src="/link/c4ddbd66988241a6b5de7127853e081a.aspx" /></strong></p>
<p>Finally you need to create a new CSHTML file within the "Views/Shared/ElementBlocks" folder naming the file the same name as your element block (in the above case it would be named 'TurnstileElementBlock.cshtml')</p>
<p>You will notice that the file contains a div which is where the Turnstile component gets injected to, this also has a sitekey data attribute which needs to be set to the site key specified in the block, there is also a callback data attribute in this case named 'javascriptCallback' which calls a Javascript function passing in the token, the function then sets the value of a hidden field to the token passed back.</p>
<p>CSHTML File</p>
<p><img src="/link/5949fbea1f604ecea14b3c52699aae8e.aspx" /></p>
<p>Once all of the above has been implemented, when you add the new element block to an Optimizely form, you will see the Turnstile element block appears within the form. </p>
<p><img src="/link/a39a734a588a43bf80900b20bb2d66c5.aspx" /></p>
<p>On submission of the form, the validator method will be called and the generated token verified, if the token is verified then the form submits successfully, if not verified then form submission will be unsuccessful.</p>2025-03-24T12:55:54.0000000ZBlog postA day in the life of an Optimizely Developer - London Meetup 2024<p><span>Hello and welcome to another instalment of A Day In The Life Of An Optimizely Developer. Last night (11th July 2024) I was excited to have attended the 2024 London Meetup and in this blog post I will give an overview of the evening and what my learnings and main takeaways were. The meetup was kindly organised by both Niteco and Netcel.</span></p>
<h2>The Venue</h2>
<p>The location of the London meetup was The Lightwell situated on Worship Street, London. I was very impressed by the venue, in terms of facilities and comfort. I arrived at 5:45 allowing 45 minutes for networking before the talks began at 6.30pm.<br /><br /></p>
<figure class="image"><img src="https://cdn.prod.website-files.com/5d79ea1cef0e0f787ba4e1a1/651c29692699bcc1af6e595b_Event_space_TV_view_side.webp" width="863" height="575" style="display: block; margin-left: auto; margin-right: auto;" />
<figcaption>The Lightwell venue</figcaption>
</figure>
<p><br />The networking for the area took place in the the same room as the talks and was a perfect and relaxing area to chat with the attendees and speakers both prior to the presentations and during the mid-point break and after the presentations (also helped by both the open bar and food).</p>
<h2>The Talks</h2>
<p><span>The meetup consisted of seven talks which were both very informative and inspirational on a number of different topics.</span></p>
<figure class="image"><img src="/link/fb69dd3b332542189d3be1a2fa61aa90.aspx" alt="" style="width: 862px; height: 647px;" />
<figcaption>The evenings agenda</figcaption>
</figure>
<h2>Scott Reed & Jacob Pretorius (Niteco) - Tips and Tricks for CMS12/Commerce 14 Upgrade</h2>
<p>Scott and Jacob opened up the evening with a talk about upgrading from CMS11/Commerce 13 to CMS12/Commerce 14. </p>
<figure class="image"><img src="/link/ebcfeb4644934168abff4cd172f65e03.aspx" width="855" alt="" height="641" />
<figcaption>Scott and Jacob</figcaption>
</figure>
<p><br />The talk started off with some slides that highlighted the performance benefits of upgrading to CMS12/Commerce 13 which is of no surprise considering that they both run on .Net core which is well known for it's performance (<a href="https://devblogs.microsoft.com/dotnet/performance-improvements-in-aspnet-core-8/">https://devblogs.microsoft.com/dotnet/performance-improvements-in-aspnet-core-8/</a>). It was also noted that when running CMS12/Commerce 13 on DXP this is a revised infrastructure that runs as containers on Linux.</p>
<p>Scott and Jacob then went on to provide a list of steps that they would recommend are followed when performing an upgrade and included:</p>
<ul>
<li>Planning and discovery - includes tasks such as reviewing the existing codebase, doing audits of existing plugins, breaking changes, etc.</li>
<li>Upgrade - this is the actual process of upgrading and includes tasks such as running the upgrade assistant, executing code, analysing and updating packages, etc.</li>
<li>QA / Stabilisation - this task includes execution of test plans, fixing any bugs that are found, etc.</li>
<li>UAT/NFR/Prod Prep - includes tasks such as performing a demo to the client, end to end integration testing, etc.</li>
<li>Rollout - this includes tasks such as performing the migration within DXP, finalising the production setup, etc.</li>
<li>Hypercare - this final task happens after go-live and includes fixing any critical bugs/incidents, etc.</li>
</ul>
<p>So you may ask yourself, is the effort worth it? <span>Absolutely.</span><strong><span> </span></strong><span>Whilst upgrading from Optimizely CMS 11 to CMS 12 will require time, effort and budget, it is a strategic move that can significantly benefit your organisation. From enhanced performance, security, and content personalisation, along with improved user experience, and mobile-friendliness, Optimizely CMS 12 brings many advantages drive competitive advantage in the digital landscape.</span></p>
<p><img src="/link/761a8c3983a34b95a58f7cead35c5290.aspx" width="1488" alt="" height="1116" style="width: 853px; height: 639px;" /></p>
<p>The final takeaway from this talk was to highlight that you should not agree to a fixed deadline when performing an upgrade, this is because an upgrade can be highly complex depending on the complexity of the solution being upgraded, and in my own personal experience there are often many skeletons in the closet that become apparent.</p>
<h2>Cindy Gilbertson (Optimizely) - Get started with Visual Builder</h2>
<p>The second talk was done by Optimizely's own Cindy Gilbertson and was a talk and demonstration of the excellent Visual Builder which is described by Optimizely as a standalone "visual experience builder". The talk was done in conjunction with a demo of Visual Builder showing how easy it is to setup both reusable components and pages as described below:</p>
<p><img src="/link/6581045036524b0d80c59763348879a2.aspx" alt="SaaS CMS | Optimizely Developer Community" /></p>
<p>Visual builder comes in two forms, namely PaaS (Platform as a Service) and SaaS (Software as a Service) versions, the PaaS version is more customisable than the SaaS version and runs on the yet to be released CMS13. The SaaS version utilises Opti Graph to allow content to be queried and returned (it also worth noting that Opti Graph can also be installed into and utilised within the PaaS version)</p>
<p>The whole concept of building content is via the Outline area, where you add sections, and to the sections you add rows and columns. Within these rows and columns you can then add elements which are essentially the fields where content is added, for example rich text, headings, images, buttons, etc. Both sections and experiences can be saved as blueprints, this essentially makes them available for re-use and they appear as options when you next try to add a new section or page.</p>
<p>Cindy was asked what is missing from Visual Builder that she would love to see in the product going forwards, and this turned out to be having more granular control over the permissions as well as adding integration for blocks, which currently do not show up within Visual Builder.</p>
<p>The final takeaway for me was that Optimizely are planning to move away from the DOJO interface over time.</p>
<h2>Minesh Shah (Netcel) - Guide to SaaS CMS and Hybrid Headless</h2>
<p>Minesh Shah opened up the fourth talk of the evening with a presentation on how to setup SaaS CMS and Visual Builder running on Vercel.</p>
<figure class="image"><img src="/link/5a18404f4e894700a84a32bc1fa37de8.aspx" width="832" alt="" height="624" style="display: block; margin-left: auto; margin-right: auto;" />
<figcaption>Minesh Shah</figcaption>
</figure>
<p><br />This talk consisted of a demo on how quick it is to create a site utilising the example Mosey Bank github repo (<a href="https://github.com/episerver/cms-visual-builder-vercel-beta">https://github.com/episerver/cms-visual-builder-vercel-beta</a>). Minesh ran through the steps on retrieving the necessary configuration keys and secrets from SaaS CMS and then adding these into the required places, as well as performing the steps to get this all built and deployed to Vercel.</p>
<p>I was impressed on how quickly Minesh got a demo site created and how it was up and running on Vercel within a matter of minutes.</p>
<h2>Mark Stott (Netcel) - Creating AddOns for PaaS CMS</h2>
<p>After the break, we moved onto the fourth talk of the evening that was presented by Mark Stott. This talk was all about how to go about creating AddOns within PaaS CMS.</p>
<figure class="image"><img src="/link/b745a66c09904dfa952ab48bdeba9d3d.aspx" width="1488" alt="" height="1116" style="width: 824px; height: 618px; display: block; margin-left: auto; margin-right: auto;" />
<figcaption>Mark Stott</figcaption>
</figure>
<p><br />Mark started off by highlighting some important considerations to keep in mind concerning Optimizely add-ons and included:</p>
<ol>
<li>Have a great idea</li>
<li>Be passionate about your plugin</li>
<li>Be prepared to spend a lot of time on your plugin</li>
</ol>
<p>He then showed some statistics on the two add-ons that he created and actively works on during his spare time, these add-ons are as follows along with the Github links:</p>
<ul>
<li>Stott.Optimizely.RobotsHandler - <a href="https://github.com/GeekInTheNorth/Stott.Optimizely.RobotsHandler">https://github.com/GeekInTheNorth/Stott.Optimizely.RobotsHandler</a> </li>
<li>Stott.Security.Optimizely - <a href="https://github.com/GeekInTheNorth/Stott.Security.Optimizely">https://github.com/GeekInTheNorth/Stott.Security.Optimizely</a> </li>
</ul>
<p>Mark then went on to provide some examples of how best to build add-ons for Optimizely, along with some tips and tricks he found during the time of creating his own add-ons. This covered off topics such as:</p>
<ul>
<li>Utilising Razor class libraries (<a href="https://learn.microsoft.com/en-us/aspnet/core/razor-pages/ui-class?view=aspnetcore-8.0&tabs=visual-studio">https://learn.microsoft.com/en-us/aspnet/core/razor-pages/ui-class?view=aspnetcore-8.0&tabs=visual-studio</a>) to ensure all of the add-on files are kept together.</li>
<li>Having a separate UI builder folder.</li>
<li>Ensuring that you provide a sample project within your repository so that the add-on can be easily tested.</li>
<li>The use of menu providers to place your add-on in the correct location of the CMS, e.g. in the add-ons section, ability to add as a gadget, etc.</li>
</ul>
<h2>Anil Patel (Knight Frank) - Azure AI Speech Integration with Optimizely CMS</h2>
<p>The fifth talk of the evening was presented by Anil Patel and covered how the Azure AI Speech service can be utilised within the Optimizely CMS interface.</p>
<figure class="image"><img src="/link/f3956cac94a54c909c95df841e566a59.aspx" width="1488" alt="" height="1116" style="width: 822px; height: 616px; display: block; margin-left: auto; margin-right: auto;" />
<figcaption>Anil Patel</figcaption>
</figure>
<p><br />Anil provided three examples of how Azure AI Speech can be utilised and this included demos of:</p>
<h3>Text to speech</h3>
<p>Anil started off with a demo that showed how text could be converted to speech. He took some text and pasted it into a text area and then published the page. After a few seconds an audio file appeared in the media section, he dropped this into a content area and upon viewing the page an audio file appeared which when played was a direct representation of the text he had used just a few seconds ago. It was also worth noting the breadth of voices that could be used to generate the speech.</p>
<h3>Speech to text</h3>
<p>This second demo was the direct opposite of the first demo, and involved dropping an audio file into a folder, which after a few seconds generated a direct text representation of the speech that existed within the audio file.</p>
<h3>Speech to text translation</h3>
<p>In this demo, Anil showed us how he could utilise the speech to text translation feature. He took an audio file, dropped it into a folder and selected a language, after a short while and upon refreshing the page, a text area was filled with the translation of the words that existed within the uploaded audio file.</p>
<p>Overall it was great to see examples of how AI can be put to work in some great use cases, and it has certainly opened my eyes more to the possibilities that are available with AI, even given the current negativity of AI as a whole.</p>
<h2>Tom Bramley (Optimizely) - Opal in PaaS Commerce + New Stuff</h2>
<p>Optimizely's own Tom Bramley opened up the penultimate talk of the evening, this covered a demo of Opal within PaaS Commerce along with an overview of the some new stuff within Commerce Connect (formerly Customized Commerce) as well as the Q3 roadmap.</p>
<figure class="image"><img src="https://www.epinova.no/siteassets/epinova.no/bilder/artikkelbilder/optimizely-composable-commerce-concept/" width="811" alt="Concept architecture of Optimizely Composable Commerce for SaaS Core and PaaS Core" height="475" style="display: block; margin-left: auto; margin-right: auto;" />
<figcaption>Composable Modules</figcaption>
</figure>
<p><br />Tom started off by highlighting that Commerce Connect is the new name for Customized Commerce, and also highlighed (see image above) how composable modules are being created that can be utilised by both Commerce Connect and Configured Commerce.</p>
<p>Tom then went on to provide a demo of utilising Opal AI for the product description, the demo took a current product description which was pasted into a field, upon clicking a button Opal AI was fired up and then based on a prompt created a revised product description for the product detail entered. I was impressed by the results and speed at which the product description was generated.</p>
<p>Other new features that Tom highlighted were either already built or soon to be coming were as follows:</p>
<ul>
<li>Providing the ability to Import/Export the product catalog directly via UI</li>
<li>Opti Graph for commerce</li>
<li>A tutorial PLP build</li>
<li>Newly reviewed and refreshed customizable views</li>
</ul>
<figure class="image"><img src="/link/56625944d25e4309af8c38073021665f.aspx" width="820" alt="" height="615" />
<figcaption>Q3 Roadmap</figcaption>
</figure>
<p><br />Tom finished off his presentation by running through the roadmap for Q3 (see image above) and highlighted the items that were committed (definitely being built), planned (will be built) and considered (highly likely to be built). I was pleased to see the breadth of features that were being built/planned to be built and am excited to try these features out when they are ultimately released.</p>
<h2>Dom Sipowicz (Vercel) - Implementing Optimizely flags through Vercel</h2>
<p>Dom Sipowicz closed off the meetups presentations with a very insightful look at how Optimizely Flags can be utilised within Vercel. </p>
<figure class="image"><img src="https://assets.vercel.com/image/upload/contentful/image/e5382hct74si/6vjsh6ZKLUSewLoNevxgOZ/44c97f57e5fbfa61f2f9e21deb232169/Toolbar_in_Production.jpg" width="748" alt="Use the Vercel Toolbar in Production with the Chrome Extension or the toolbar menu – Vercel" height="421" />
<figcaption>Vercel Toolbar</figcaption>
</figure>
<p><br />A demonstration was done which showed how the Vercel Toolbar (see above) could be used to quickly enable/disable feature flags that existed within Optimizely feature experimentation, with the changes appearing on the fly.</p>
<p>Ultimately, I was very impressed by the sheer number of feature flags that were supported with no apparent slowdown on the sample site that was being demonstrated.</p>
<h2>Main Takeaways and Learnings</h2>
<p>All in all the meetup was very insightful and gave me a lot of food for thought in terms of how we could utilise some of these practices and technologies in the Optimizely builds we do at<span> </span><a href="/www.26-dx.com">26<span> DX</span></a>- the main points that I took away from this event are as follows:</p>
<ul>
<li>Performing an upgrade to CMS12/Commerce 13 can be very time consuming dependent on the complexity of the project, and when planning an upgrade never agree to a fixed deadline.</li>
<li>Visual Builder is a great tool for marketers to create reusable components and pages. I was impressed to see how <span>Visual Builder provides a user-friendly, standalone tool for content creation within Optimizely's evolving SaaS and headless initiative.</span></li>
<li>The seamless integration with Vercel and Optimizely SaaS and how fast it is to get a sample website up and running and how fast these websites run when hosted on Vercel.</li>
<li>There are many ways in which Optimizely add-ons can be created and added to the Optimizely CMS interface, and I was intrigued to see how Razor Class libraries can be utilised when building an add-on. This talk has certainly increased my drive to create my first add-on.</li>
<li>I was impressed to see how feature flags can be utilised in conjunction with Vercel to provide a blazingly fast way of performing tests within your applications.</li>
</ul>
<h2>References</h2>
<p>Below are a list of links to further information on areas of the talks by all seven speakers.</p>
<h3>SaaS / Visual Builder</h3>
<p><a href="https://docs.developers.optimizely.com/content-management-system/v1.0.0-CMS-SaaS/docs/overview-of-cms-saas">https://docs.developers.optimizely.com/content-management-system/v1.0.0-CMS-SaaS/docs/overview-of-cms-saas</a> <br /><a href="https://docs.developers.optimizely.com/content-management-system/v1.0.0-CMS-SaaS/docs/demo-site-with-cms-saas-and-vercel">https://docs.developers.optimizely.com/content-management-system/v1.0.0-CMS-SaaS/docs/demo-site-with-cms-saas-and-vercel</a><br /><a href="https://docs.developers.optimizely.com/content-management-system/v1.0.0-CMS-SaaS/docs/create-a-demo-site-using-cms-saas-and-netlify">https://docs.developers.optimizely.com/content-management-system/v1.0.0-CMS-SaaS/docs/create-a-demo-site-using-cms-saas-and-netlify</a> <br /><a href="https://docs.developers.optimizely.com/content-management-system/v1.0.0-CMS-SaaS/docs/visual-builder">https://docs.developers.optimizely.com/content-management-system/v1.0.0-CMS-SaaS/docs/visual-builder</a> </p>
<h3>Vercel</h3>
<p><a href="https://vercel.com/templates/next.js/feature-flag-optimizely">https://vercel.com/templates/next.js/feature-flag-optimizely</a> <br /><a href="https://github.com/episerver/cms-visual-builder-vercel-beta/">https://github.com/episerver/cms-visual-builder-vercel-beta/</a> <br /><a href="https://github.com/episerver/cms-visual-builder-hello-world">https://github.com/episerver/cms-visual-builder-hello-world</a> <br /><a href="https://vercel.com/docs/workflow-collaboration/vercel-toolbar">https://vercel.com/docs/workflow-collaboration/vercel-toolbar</a> <br /><a href="https://www.optimizely.com/apps/vercel/">https://www.optimizely.com/apps/vercel/</a> </p>
<h3>Commerce Connect / Configured Commerce / Composable Modules</h3>
<p><a href="https://www.optimizely.com/product-updates/commerce-connect/">https://www.optimizely.com/product-updates/commerce-connect/</a> <br /><a href="https://www.optimizely.com/products/content-management/commerce-connect/">https://www.optimizely.com/products/content-management/commerce-connect/</a> <br /><a href="https://www.optimizely.com/products/configured-commerce/">https://www.optimizely.com/products/configured-commerce/</a> </p>
<h3>CMS12 / Commerce 13 Upgrade</h3>
<p><a href="https://docs.developers.optimizely.com/content-management-system/docs/why-upgrade-to-content-cloud-cms-12">https://docs.developers.optimizely.com/content-management-system/docs/why-upgrade-to-content-cloud-cms-12</a> <br /><a href="https://docs.developers.optimizely.com/content-management-system/docs/upgrading-to-content-cloud-cms-12">https://docs.developers.optimizely.com/content-management-system/docs/upgrading-to-content-cloud-cms-12</a> <br /><a href="https://docs.developers.optimizely.com/content-management-system/docs/upgrade-assistant">https://docs.developers.optimizely.com/content-management-system/docs/upgrade-assistant</a> <br /><a href="https://www.jondjones.com/learn-optimizely/cms/optimizely-cms-upgrading-guide-learn-how-to-convert-your-project-from-net-to-net-core/">https://www.jondjones.com/learn-optimizely/cms/optimizely-cms-upgrading-guide-learn-how-to-convert-your-project-from-net-to-net-core/</a> </p>
<h3>Plugin Creation</h3>
<p><a href="https://docs.developers.optimizely.com/content-management-system/docs/developing-add-ons">https://docs.developers.optimizely.com/content-management-system/docs/developing-add-ons</a> <br /><a href="https://www.getadigital.com/blog/optimizely-12-ui-plugin">https://www.getadigital.com/blog/optimizely-12-ui-plugin</a> </p>
<h3>Azure AI</h3>
<p><a href="https://azure.microsoft.com/en-gb/products/ai-services/">https://azure.microsoft.com/en-gb/products/ai-services/</a> <br /><a href="https://azure.microsoft.com/en-us/products/ai-services/speech-to-text">https://azure.microsoft.com/en-us/products/ai-services/speech-to-text</a> <br /><a href="https://azure.microsoft.com/en-gb/products/ai-services/text-to-speech">https://azure.microsoft.com/en-gb/products/ai-services/text-to-speech</a> <br /><a href="https://azure.microsoft.com/en-gb/products/ai-services/ai-translator">https://azure.microsoft.com/en-gb/products/ai-services/ai-translator</a> </p>
<div class="author__image col-sm-5"><img src="https://assets-eu-01.kc-usercontent.com/1e387446-ba57-010e-8dbf-944631f19d11/d003b6bf-e48d-43b5-ae36-ace9342bcecb/GrahamCarr_680x454.jpg?w=500&h=1000&auto=format" /></div>
<div class="author__content col-sm-7 keep-margin-bottom">
<h2>Graham Carr, Lead .NET Developer</h2>
<div class="rich-text aos-init aos-animate">
<p>I am an experienced Lead .Net Developer with over 25 years’ experience in a wide range of products and technologies. I have helped companies deliver their digital vision from concept all the way through to delivery. I have a particular passion for DXPs (Digital Experience Platforms) and am a certified developer for products such as Optimizely, Umbraco, Kontent.ai and more.</p>
</div>
</div>2024-07-16T14:49:30.0000000ZBlog postA day in the life of an Optimizely Developer - Introduction to Optimizely SaaS Core<h2>What is SaaS Core</h2>
<p>Optimizely SaaS Core is a cloud-based, headless, and API-first version of the Optimizely CMS (Content Management System) and Commerce platform. Unlike traditional platforms, SaaS Core provides customers with a complete package - both the operating environment and the application itself - without the need for extensive coding or technical expertise.</p>
<p><img src="/link/ee2489cbd3704af1ae443bca248d5d0e.aspx" width="1119" height="409" /></p>
<h2>The Challenge: Complexity in Composability</h2>
<p>Composability has traditionally meant complexity, especially for marketers. As businesses strive to build custom tech stacks tailored to their unique needs, marketers often find themselves navigating intricate systems designed primarily for developers.</p>
<h2>Key Features of SaaS Core</h2>
<ul>
<li>Low-Code/No-Code Development: One of the most attractive features of SaaS Core is its no-code approach to template building. Users can define content types, specify properties, and configure data types all through a user-friendly web interface, eliminating the reliance on developers for “basic” site customisation.</li>
<li>Always Updated: Optimizely takes care of infrastructure, monitoring, security, and upgrades to core components. This ensures that users benefit from the latest features and improvements without the hassle of planning or executing upgrades.</li>
<li>Headless Architecture: SaaS Core adopts a headless approach, storing content in a presentation-agnostic format accessible via APIs. This allows for greater flexibility in creating custom front-end experiences across various digital channels.</li>
<li>Low-Code Integrations: Pre-built integrations ("connectors") simplify data exchange between CMS/Commerce and other systems. Customers can set up integrations with just a few clicks, reducing as much dependency on custom development.</li>
</ul>
<h2>How does Optimizely SaaS Core differ from PaaS Core</h2>
<p>Whilst both products are built on the same foundational CMS they do differ in several different ways. SaaS Core is headless, versionless and composable whilst PaaS Core is highly configurable and customisable.</p>
<table>
<tbody>
<tr>
<td>
<p><strong>SaaS Core</strong></p>
</td>
<td>
<p><strong>PaaS Core</strong></p>
</td>
</tr>
<tr>
<td>
<p>Automatic and versionless updates</p>
</td>
<td>
<p>Partner managed updates</p>
</td>
</tr>
<tr>
<td>
<p>API-First approach</p>
</td>
<td>
<p>Supports hybrid, headless or coupled</p>
</td>
</tr>
<tr>
<td>
<p>Do not need to worry about installation</p>
</td>
<td>
<p>Partner managed installation</p>
</td>
</tr>
<tr>
<td>
<p>JS Frameworks and No .Net Core</p>
</td>
<td>
<p>JS Frameworks and/or .Net Core</p>
</td>
</tr>
<tr>
<td>
<p>No-coding approach</p>
</td>
<td>
<p>Ability to modify code for extensibility</p>
</td>
</tr>
<tr>
<td>
<p>No add-ons at this current time</p>
</td>
<td>
<p>Customisations can be done via add-ons</p>
</td>
</tr>
</tbody>
</table>
<p> <img src="/link/e6dc146552224709bde9fde70a51a806.aspx" width="1056" height="494" /></p>
<h2>Related Technologies</h2>
<h3>Optimizely Graph</h3>
<p>Optimizely Graph is a SaaS service built on GraphQL, designed to transform how users query and deliver content. Here is a summary of its key features and benefits:</p>
<ul>
<li>GraphQL: Optimizely Graph leverages GraphQL, an open-source data query language, to generate unique schemas for each site, enabling efficient content querying.</li>
<li>Semantic Search: Utilises AI for semantic search, understanding contextual meaning behind keywords to deliver more accurate results, such as recognising "The Windy City" as Chicago.</li>
<li>External Data Integration: Allows querying of both CMS and external data sources, enabling data linkage across multiple sources via a single endpoint.</li>
</ul>
<h4>How It Works:</h4>
<ul>
<li>Content Sync: As content is published in the CMS, the GraphQL API dynamically generates schemas based on synchronised content, ensuring performance through Cloudflare CDN edge nodes.</li>
<li>External Data Integration: Define content types via API, sync data in JSONL format, and push it to Graph via API for seamless integration and querying.</li>
<li>Querying and Search: Access an interactive GraphQL page to build custom queries within the CMS, perform standard or semantic searches on properties defined as "searchable."</li>
</ul>
<p><img src="/link/94147011306149f8b621b6d50f7afbb8.aspx" width="1127" height="544" /></p>
<h3>Visual Builder</h3>
<p>Optimizely's new feature, Visual Builder, is described by Optimizely as a standalone "visual experience builder" designed to empower content creators with an intuitive editing interface. Here's a summary of its key points:</p>
<ul>
<li><strong>Purpose</strong>: Visual Builder enhances content composition by providing a streamlined interface focused on assembling content blocks and enabling easy previewing before publishing.</li>
<li><strong>Key Features</strong>:
<ul>
<li>Improved visual aesthetics emphasising content composition without CMS scaffolding.</li>
<li>Template creation without coding.</li>
<li>Integration with Optimizely Graph for content manipulation.</li>
</ul>
</li>
<li><strong>Base</strong>: Visual Builder is ideal for Optimizely SaaS users who prefer a decoupled approach to content creation, allowing flexibility in editing interfaces and adaptation to various digital channels.</li>
<li><strong>Positioning</strong>: Positioned as the primary visual content composer within Optimizely SaaS, Visual Builder offers flexibility for content management independent of presentation layers.</li>
<li><strong>Integration</strong>: Works in tandem with Optimizely Graph's APIs, transforming Optimizely SaaS into a headless CMS for composing, modifying, and distributing content.</li>
<li><strong>Availability</strong>: Expected to launch in H1 2024, Visual Builder will likely be a cloud-based add-on service integrated with both CMS and CMP content composition.</li>
</ul>
<p>Visual Builder provides a user-friendly, standalone tool for content creation within Optimizely's evolving SaaS and headless initiative, offering enhanced flexibility and control over content management and distribution.</p>
<h2>Who Should Consider SaaS Core</h2>
<p>Optimizely SaaS Core is ideal for:</p>
<ul>
<li>Composable Flexibility: Organisations seeking a flexible CMS/Commerce platform that allows for component-based customisation.</li>
<li>Time-to-Market: Businesses requiring rapid deployment of simple campaign sites, pop-up stores, or event websites.</li>
<li>Structured Data Management: Those looking to store content in a clean, structured format for seamless synchronisation across digital channels.</li>
<li>Frontend Freedom: Developers wanting to create custom frontends using preferred frameworks, independent of traditional WYSIWYG editors.</li>
</ul>
<h2>Do I Still Need an Optimizely Partner?</h2>
<p>While SaaS Core reduces the technical complexity associated with template development and setup, partnering with Optimizely experts like <a href="https://www.26-dx.com">26 DX</a> remains valuable. An experienced partner can optimise platform setup, streamline integrations, and provide strategic guidance to maximise ROI.</p>
<p>In conclusion, Optimizely SaaS Core represents a major step towards democratising web development, empowering businesses to create, manage, and optimise digital experiences with unparalleled ease and flexibility.</p>
<h3>References<em><br /></em><em></em></h3>
<div class="author__image col-sm-5"><img src="https://assets-eu-01.kc-usercontent.com/1e387446-ba57-010e-8dbf-944631f19d11/d003b6bf-e48d-43b5-ae36-ace9342bcecb/GrahamCarr_680x454.jpg?w=500&h=1000&auto=format" /></div>
<div class="author__content col-sm-7 keep-margin-bottom">
<h2>Graham Carr, Lead .NET Developer</h2>
<div class="rich-text aos-init aos-animate">
<p>I am an experienced Lead .Net Developer with over 28 years’ experience in a wide range of products and technologies. I have helped companies deliver their digital vision from concept all the way through to delivery. I have a particular passion for DXPs (Digital Experience Platforms) and am a certified developer for products such as Optimizely, Umbraco, Kontent.ai and more.</p>
</div>
</div>2024-06-04T12:33:43.0000000ZBlog postA day in the life of an Optimizely Developer - Enabling Opti ID within your application<p>Hello and welcome to another instalment of A Day In The Life Of An Optimizely developer, in this blog post I will provide details on Optimizely's Opti ID, what it is and how it can easily be enabled within your website.</p>
<h2>What is Opti ID</h2>
<p>Opti ID offers a centralised login experience, allowing seamless switching between Optimizely products with just one authentication using Okta, Entra ID, or a local login. It also enables centralised user management using the Opti ID Admin Centre.</p>
<p>Opti ID provides the following benefits:</p>
<ul>
<li><strong>Centralized Login with SSO</strong>: Enjoy single sign-on (SSO) with support for multi-factor authentication (MFA) using your preferred MFA setup and active directory authentication provider.</li>
<li><strong>Application Switching</strong>: Switch between applications without needing to re-authenticate.</li>
<li><strong>User Administration</strong>: Easily manage Opti ID users, groups, and roles from a centralized location.</li>
<li><strong>Account and User Dashboard</strong>: Access comprehensive usage and billing information through a centralized dashboard.</li>
</ul>
<p>Businesses investing in marketing technology often face challenges in balancing flexibility and composability within their tech stacks while managing multiple solutions from different providers. Analysts highlight the financial and administrative burdens associated with maintaining diverse best-of-breed point solutions.</p>
<p>Optimizely addresses these challenges by simplifying the adoption and management of digital experience solutions. Whether you choose a single Optimizely product or the entire suite, you gain access to a cohesive solution that can be conveniently accessed and utilized from a unified platform.</p>
<h2>How to enable Opti ID</h2>
<p>There are a couple of ways of enabling Opti ID within your website, either by SAML or OIDC. I decided to go down the OIDC route so this is what will be covered, however the references section further down provides some links to useful articles on enabling Opti ID.</p>
<h3>Install Nuget Package</h3>
<p>The first step is to ensure that the following Nuget package is installed in your web project:</p>
<p><img src="/link/3cb7330112864f60ae51c3b01611299c.aspx" /></p>
<h3>Update Startup.cs</h3>
<p>You now need to add the following line of code to your Startup.cs class in the ConfigureServices method:</p>
<pre class="language-csharp"><code>services.AddOptimizelyIdentity(useAsDefault: true);</code></pre>
<p>You need to ensure at this point that if you are not using ASP.Net Identity then you need to remove any code references to:</p>
<pre class="language-csharp"><code>services.AddCmsAspNetIdentity<TUser>()</code></pre>
<h3>Running Opti ID locally</h3>
<p>To ensure that you can run Opti ID locally you need to first of all add the following to your appsettings.json file within the Episerver / CMS section (it is worth noting that these values get added automatically when you deploy your website to DXP):</p>
<pre class="language-javascript"><code> "OptimizelyIdentity": {
"InstanceId": "xxx",
"ClientId": "xxx",
"ClientSecret": "xxx"
},</code></pre>
<p>To get the values for InstanceId, ClientId and ClientSecret, you need to head over to PaaSPortal (<a href="https://paasportal.episerver.net">https://paasportal.episerver.net</a>) and go into the API tab of the correct organisation. You will see a section detailing Opti ID dev key, these are the values that you need to put into your appsettings.json.</p>
<p><img src="/link/52d6372ba06e43df9de1649dbab600e1.aspx" /></p>
<p>Then that is all that is required from a coding perspective, the next step goes beyond the detail of this article however the references section provides links to detail on how you configure Entra or Okta to allow authentication, authorisation and synchronisation of users and groups.</p>
<p>In conclusion, Opti ID is a great solution for organisations who have multiple Optimizely products that they want to be able to access via an integrated SSO solution.</p>
<h3>References<em><br /></em><em></em></h3>
<p><a href="https://support.optimizely.com/hc/en-us/articles/18127857412493-Install-Opti-ID-for-CMS">https://support.optimizely.com/hc/en-us/articles/18127857412493-Install-Opti-ID-for-CMS</a> <br /><a href="https://support.optimizely.com/hc/en-us/articles/18129917620109-Configure-SSO-with-Opti-ID-using-SAML">https://support.optimizely.com/hc/en-us/articles/18129917620109-Configure-SSO-with-Opti-ID-using-SAML</a> <br /><a href="https://support.optimizely.com/hc/en-us/articles/18129890210573-Configure-SSO-with-Opti-ID-using-OIDC">https://support.optimizely.com/hc/en-us/articles/18129890210573-Configure-SSO-with-Opti-ID-using-OIDC</a><br /><a href="https://support.optimizely.com/hc/en-us/articles/17917477783181-Sync-groups-from-your-SSO-provider">https://support.optimizely.com/hc/en-us/articles/17917477783181-Sync-groups-from-your-SSO-provider</a> </p>
<div class="author__image col-sm-5"><img src="https://assets-eu-01.kc-usercontent.com/1e387446-ba57-010e-8dbf-944631f19d11/d003b6bf-e48d-43b5-ae36-ace9342bcecb/GrahamCarr_680x454.jpg?w=500&h=1000&auto=format" /></div>
<div class="author__content col-sm-7 keep-margin-bottom">
<h2>Graham Carr, Lead .NET Developer</h2>
<div class="rich-text aos-init aos-animate">
<p>I am an experienced Lead .Net Developer with over 25 years’ experience in a wide range of products and technologies. I have helped companies deliver their digital vision from concept all the way through to delivery. I have a particular passion for DXPs (Digital Experience Platforms) and am a certified developer for products such as Optimizely, Umbraco, Kontent.ai and more.</p>
</div>
</div>2024-05-09T08:40:48.0000000ZBlog postA day in the life of an Optimizely Developer - Creating an AI powered conversational robot that utilises Semantic Search in Optimizely Graph<h2>Overview</h2>
<p>Hello and welcome to another installment of A Day In The Life Of An Optimizely Developer!<br /><br />In this blog post I will be covering an exciting POC that I recently undertook for one of our clients. The ask was to create a POC of an AI powered chatbot that followed the RAG model utilising Optimizely Graph and Semantic Search for retrieving related content that the chatbot can use as a context to be able to <span>enhance the quality and relevance of its generated responses.</span></p>
<h2>What is RAG?</h2>
<p><span>The term RAG stands for Retrieval-Augmented Generation model and is a type of architecture used in natural language processing (NLP) and machine learning. </span></p>
<p>In simple terms:</p>
<ol>
<li>
<p><strong>Retrieval:</strong></p>
<ul>
<li>This part involves fetching information from a pre-existing set of data or knowledge. It might retrieve relevant text passages or documents based on a given input or query.</li>
</ul>
</li>
<li>
<p><strong>Augmented Generation:</strong></p>
<ul>
<li>The system then uses this retrieved information to enhance or "augment" its ability to generate new, contextually relevant content. This content can be in the form of text, responses, or any other linguistic output.</li>
</ul>
</li>
</ol>
<p>In the context of language models, this combination is often employed to improve the model's ability to generate more accurate and contextually appropriate responses by leveraging information from a broader knowledge base.</p>
<p>For instance, if you ask a question, the model might retrieve relevant information from a database or existing text and use that information to generate a more informed and accurate response. This approach aims to enhance the overall performance of the system by leveraging both pre-existing knowledge and the model's generative capabilities.</p>
<h2>Process Flow</h2>
<p>The following is a high-level overview of the process flow from the moment the user enters a search query.</p>
<p><img src="/link/ab90f983e01a449696c8ca955453106b.aspx" width="353" alt="" height="506" /></p>
<ol>
<li>Users enters prompt.</li>
<li>Prompt used to search website (Semantic search within Optimizely Graph used for this).</li>
<li>Content components extracted from the returned search data.</li>
<li>Embeddings created from the content components, these are saved to a persistent data source.</li>
<li>Prompt created and context created containing embeddings, these are fed into LLM with a strong anti-hallucination bias.</li>
<li>Show answer generated by LLM with links to citations.</li>
</ol>
<h2>Semantic Search within Optimizely Graph</h2>
<p><span>Semantic search is an advanced search technique that goes beyond traditional keyword-based search to understand the meaning of words and the context in which they are used. Instead of simply matching search queries with keywords, semantic search aims to comprehend the intent and the context of the user's query to provide more accurate and relevant results. </span></p>
<p>To be able to perform semantic searches within Optimizely Graph, a number of pre-requisite steps need to be carried out to enable Graph.</p>
<ul>
<li>Enable the Graph service within PaaSPortal - when you enable the service be aware that although you have enabled a free trial, it cannot be used for live traffic and a subscription needs to be purchased when using in a production environment.<br /><br /><img src="/link/a65a33d9188a4b7fa5e81732e5c5d14e.aspx" /><br /><br /></li>
<li>The next step is to i<span>nstall </span><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">Optimizely.ContentGraph.CMS</span></code><span> in your Optimizely Content Management System (CMS) site to synchronize content types and content. In Visual Studio, go to </span><strong>Tools</strong><span> > </span><strong>Nuget Package Manager</strong><span> > </span><strong>Package Manager Console</strong><span>. At the console, enter </span><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">install-package Optimizely.ContentGraph.Cms</span></code><span>.<br /><br /></span></li>
<li><span>You now need to add some new configuration to your appsettings.json file:<br /></span>
<pre class="language-javascript"><code>"Optimizely": {
"ContentGraph": {
"GatewayAddress": "",
"AppKey": "",
"Secret": "",
"SingleKey": "",
"AllowSendingLog": "true"
}
}</code></pre>
<br />
<ul>
<li><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">GatewayAddress</span></code><span> </span>– URL for the API Gateway. This value should be set to<span> </span><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">https://cg.optimizely.com</span></code><span> </span>for all production environments.</li>
<li><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">AppKey</span></code><span> </span>– Available via the Content Graph Service Configurations area of PaaSPortal</li>
<li><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">Secret</span></code><span> </span>– Available via the Content Graph Service Configurations area of PaaSPortal</li>
<li><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">SingleKey</span></code><span> </span>– Available via the Content Graph Service Configurations area of PaaSPortal</li>
<li><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">AllowSendingLog</span></code><span> </span>– Flag that allows sending errors and warnings to the API Gateway. This data helps the support team investigate when something goes wrong. Defaults to<span> </span><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">true</span></code>.<br /><br /></li>
</ul>
</li>
<li><span>Next, if you do not use Content Delivery API in your CMS site yet, add the following in the </span><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">ConfigureServices(IServiceCollection services)</span></code><span> method of </span><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">Startup.cs</span></code><span>. Optimizely Graph depends on Content Delivery API, this is the minimum configuration.<br /><br /></span>
<pre class="language-csharp"><code>services.ConfigureContentApiOptions(o =>
{
o.IncludeInternalContentRoots = true;
o.IncludeSiteHosts = true;
//o.EnablePreviewFeatures = true;// optional
});
services.AddContentDeliveryApi(); // required, for further configurations, see https://docs.developers.optimizely.com/content-cloud/v1.5.0-content-delivery-api/docs/configuration
services.AddContentGraph();
//the following is obsolete and is kept for compatibility for now
//services.AddContentGraph(_configuration);</code></pre>
</li>
<li>The final step is to enable synchronisation, there are two types of synchronisation available, the first is event-driven synchronisation, by default The GraphQL schema <span>stays up-to-date with changes to your site anytime someone edits a content type or one of its properties. The job also synchronizes content to the service any time content is created, updated, or deleted. The second type of synchronisation is via a scheduled job called "Optimizely Content Graph Synchronisation", normally this would only be run if you have an existing site with pre-existing content that needs to be synchronised.</span></li>
</ul>
<p>Now that you have Graph enabled andf content synchronised you are now in a position to start doing semantic searches. You can easily perform semantic searches<span> by changing the value of </span><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">_ranking</span></code><span> in the OrderBy</span><span> to </span><code class="rdmd-code lang- theme-light"><span class="cm-s-neo">SEMANTIC</span></code> (by default the _ranking field is set to <code class="rdmd-code lang- theme-light"><span class="cm-s-neo">RELEVANCE</span></code>). In the query shown below, we are performing a semantic search for SitePageData content types where the _fulltext field contains the 'search query' specified in the $searchQuery parameter. The data returned is the total number of matching items, and then for each item the name and _fulltext field contents are returned.</p>
<pre class="language-javascript"><code>query SemanticSearch($searchQuery: String)
{
SitePageData(
orderBy: { _ranking: SEMANTIC }
where: { _fulltext: { contains: $searchQuery }})
{
total
items {
Name
_fulltext
}
}
}</code></pre>
<p>An example of how the data is retured is shown below:</p>
<pre class="language-javascript"><code>{
"data": {
"SitePageData": {
"total": 2,
"items": [
{
"Name": "Lorem ipsum dolores sit amet.",
"_fulltext": [
"Lorem ipsum dolores sit amet.",
"<p><strong>Lorem ipsum dolor</strong><em> sit amet consectetur</em> <span style=\"text-decoration: underline;\">adipiscing</span>, <sup>elit</sup> <sub>sollicitudin</sub></p>\n<p>vivamus congue gravida nunc semper, justo imperdiet interdum litora at. Faucibus integer porttitor odio lacus libero id habitasse vel, mollis fermentum luctus diam parturient eros orci hendrerit, per metus sodales magnis placerat varius lectus. Ultrices scelerisque etiam dapibus in, tincidunt non.</p>"
]
},
{
"Name": "Fly me home, kid",
"_fulltext": [
"Fly me home, kid.",
"<p>Kid, I've flown from one side of this galaxy to the other. I've seen a lot of strange stuff, but I've never seen anything to make me believe there's one all-powerful Force controlling everything. There's no mystical energy field that controls my destiny. It's all a lot of simple tricks and nonsense. I'm surprised you had the courage to take the responsibility yourself.</p>"
]
}
}
}
}</code></pre>
<p>The full code snippet for performing a semantic search against Graph in C# is shown below. This is utilising a NuGet package called <span style="background-color: #4099ff;">GraphQL.Client</span> and to ensure that content is serialized correctly you also need to install the related NuGet package called <code class="rdmd-code lang- theme-light"><span class="cm-s-neo">GraphQL.Client.Serializer.Newtonsoft</span></code>.</p>
<pre class="language-csharp"><code> public async Task<GraphQLResponse<Rootobject>> PerformSemanticSearch(GetChatbotQuery query)
{
// Create the GraphQL query using a variable for the search query
var contentRequest = new GraphQLRequest
{
Query = """
query SemanticSearch($searchQuery: String)
{
SitePageData(
orderBy: { _ranking: SEMANTIC }
where: { _fulltext: { contains: $searchQuery }})
{
total
items {
Name
_fulltext
}
}
}
""",
OperationName = "SemanticSearch",
Variables = new
{
searchQuery = query.Query
}
};
// Create an instance of the GraphQL client - endpoint hard-coded for this POC
var graphQlClient = new GraphQLHttpClient("https://cg.optimizely.com/content/v2?auth=<simplekey>", new NewtonsoftJsonSerializer());
// The response returned from the GraphQL query
var graphQlResponse = await graphQlClient.SendQueryAsync<Rootobject>(contentRequest, new CancellationToken());
return graphQlResponse;
}</code></pre>
<h2>OpenAI</h2>
<p>The next step in the process is to utilise whichever LLM you wish to use, this could be OpenAI, Azure OpenAI, etc, and for the purposes of this POC I chose to utilise OpenAI and more specifically the GPT-3.5 Turbo model.</p>
<h3>What is an LLM </h3>
<p>A Large Language Model (LLM) is a type of artificial intelligence model designed to understand and generate human-like language on a large scale. These models are typically based on deep learning architectures, specifically transformer architectures, and are trained on massive datasets containing a diverse range of textual information.</p>
<p>Key characteristics of Large Language Models include:</p>
<ol>
<li>
<p><strong>Scale of Data:</strong></p>
<ul>
<li>LLMs are trained on vast amounts of text data from diverse sources such as books, articles, websites, and more. This extensive training data helps the model learn the nuances of language and develop a broad understanding of various topics.</li>
</ul>
</li>
<li>
<p><strong>Transformer Architecture:</strong></p>
<ul>
<li>Most LLMs are built on transformer architectures. Transformers are neural network architectures that have proven highly effective for processing sequential data, making them well-suited for natural language processing tasks.</li>
</ul>
</li>
<li>
<p><strong>Pre-training and Fine-tuning:</strong></p>
<ul>
<li>LLMs typically undergo a two-step training process. First, they are pre-trained on a large corpus of text data in an unsupervised manner, learning the statistical patterns and structures of language. After pre-training, the models can be fine-tuned on specific tasks with smaller, task-specific datasets.</li>
</ul>
</li>
<li>
<p><strong>Versatility in Language Tasks:</strong></p>
<ul>
<li>Large Language Models exhibit versatility in performing various language-related tasks, including text generation, completion, summarization, translation, sentiment analysis, question answering, and more. This versatility is a result of the broad and deep knowledge acquired during pre-training.</li>
</ul>
</li>
<li>
<p><strong>Contextual Understanding:</strong></p>
<ul>
<li>LLMs excel in understanding the context in which words and phrases are used. They can generate contextually relevant responses by considering the entire context of a given input sequence, allowing them to produce more coherent and meaningful outputs.</li>
</ul>
</li>
<li>
<p><strong>GPT-3 Example:</strong></p>
<ul>
<li>One prominent example of a Large Language Model is GPT-3 (Generative Pre-trained Transformer 3), developed by OpenAI. GPT-3 is known for its impressive language capabilities, with 175 billion parameters, making it one of the largest language models created.</li>
</ul>
</li>
</ol>
<p>Below is a snippet of code that performs the following:</p>
<ol>
<li>The NuGet package called "Betalgo.OpenAI.GPT3" has been utilised in this POC, this package is deprecated in favour of "Betalgo.OpenAI" however for the purposes of a POC I was happy to utilise this package. Using this package we create an instance of an OpenAPI service client, passing in the OpenAI key taken from the OpenAI account settings.</li>
<li>The search results returned from the semantic search are processed and saved as rows in a CSV file</li>
<li>The contents of the CSV file are read, tokenized and returned as a DataFrame.</li>
<li>OpenAI embeddings are then created from the passed in DataFrame and these are then saved to a separate CSV file.</li>
<li>Finally the Completion API is called (this API is deprecated and the Chat Completion API should now be used, but for the purposes of the POC I was fine with this) which utilises the initial search query, a prompt and the created embeddings to come up with an answer that relates to the user's initial intent.</li>
</ol>
<pre class="language-csharp"><code> // Create OpenAI client (key should be put in config, but fine for POC)
var openAiService = new OpenAIService(new OpenAiOptions()
{
ApiKey = "<openai-key>"
});
// Process the search results, then tokenize the results and finally created embeddings which are saved to a file
SearchResultsProcessor.ProcessSearchResults(semanticSearchResults.Data);
var dataFrame = TextTokenizer.TokenizeTextFile();
await TextEmbedding.CreateEmbeddings(openAiService, dataFrame, "blahblah.com", 100, 150_000);
// Perform chat completion
var answer = await TextAnswers.AnswerQuestion(openAiService, "blahblah.com", request.Query);</code></pre>
<h3>Embeddings</h3>
<p>Embeddings refer to the numerical representations of words, phrases, or sentences that are learned during the training of the model. These embeddings encode semantic information about the language and enable the model to understand the relationships between different words and the context in which they appear.</p>
<p>Here's a breakdown of how embeddings work in the context of large language models:</p>
<ol>
<li>
<p><strong>Word Embeddings:</strong></p>
<ul>
<li>For individual words, embeddings are vectors in a high-dimensional space. Each word is mapped to a unique vector, and the position of the vector captures information about the word's meaning. Word embeddings are learned during the pretraining phase of the language model.</li>
</ul>
</li>
<li>
<p><strong>Contextual Embeddings:</strong></p>
<ul>
<li>In large language models like GPT (Generative Pre-trained Transformer), the embeddings are contextual, meaning they take into account the surrounding words in a sentence. The model captures not only the meaning of a word but also how its meaning changes based on the context it appears in. This helps the model generate more contextually relevant responses.</li>
</ul>
</li>
<li>
<p><strong>Training Process:</strong></p>
<ul>
<li>During the training process, the language model is exposed to a vast amount of text data. It learns to predict the next word in a sequence or fill in missing words based on the context. This process allows the model to develop embeddings that capture the statistical patterns and semantic relationships present in the training data.</li>
</ul>
</li>
<li>
<p><strong>Vector Space Representation:</strong></p>
<ul>
<li>The embeddings result in a vector space where words with similar meanings are closer together in the space. This vector space representation enables the model to perform tasks like language understanding, completion, and generation by manipulating these vectors.</li>
</ul>
</li>
<li>
<p><strong>Transfer Learning:</strong></p>
<ul>
<li>Large language models are often pretrained on a general language understanding task. Once pretrained, they can be fine-tuned for specific tasks with smaller datasets. The embeddings learned during pretraining serve as a foundation of linguistic knowledge that the model can leverage for various downstream applications.</li>
</ul>
</li>
</ol>
<p>The following code snippet shows how the embeddings are created and then saved to a separate CSV file.</p>
<pre class="language-csharp"><code> public static async Task CreateEmbeddings(IOpenAIService openAiService, DataFrame df, string domain, int rpm, int tpm)
{
RateLimiter rpmLimiter = new SlidingWindowRateLimiter(
new SlidingWindowRateLimiterOptions()
{
Window = TimeSpan.FromMinutes(1),
SegmentsPerWindow = 6,
PermitLimit = rpm,
QueueLimit = 1,
QueueProcessingOrder = QueueProcessingOrder.OldestFirst,
AutoReplenishment = true
}
);
RateLimiter tpmLimiter = new TokenBucketRateLimiter(
new TokenBucketRateLimiterOptions()
{
ReplenishmentPeriod = TimeSpan.FromMinutes(1),
TokensPerPeriod = tpm,
TokenLimit = tpm,
QueueLimit = 1,
QueueProcessingOrder = QueueProcessingOrder.OldestFirst,
AutoReplenishment = true
}
);
var embeddings = new List<List<double>>();
for (long rowIndex = 0; rowIndex < df.Rows.Count; rowIndex++)
{
var row = df.Rows[rowIndex];
var text = row[df.Columns.IndexOf("text")].ToString();
var nTokens = int.Parse(row[df.Columns.IndexOf("n_tokens")].ToString() ?? string.Empty);
var leases = await Task.WhenAll(rpmLimiter.AcquireAsync(1).AsTask(), tpmLimiter.AcquireAsync(nTokens).AsTask());
if (!leases.All(l => l.IsAcquired))
{
Console.WriteLine("Failed to acquire the permits.");
return;
}
foreach (RateLimitLease lease in leases)
{
lease.Dispose();
}
var response = await openAiService.Embeddings.CreateEmbedding(new OpenAI.GPT3.ObjectModels.RequestModels.EmbeddingCreateRequest()
{
Input = text,
Model = "text-embedding-ada-002"
});
if ((response?.Data != null) && (response.Successful))
{
embeddings.Add(response.Data[0].Embedding);
}
else
{
Console.WriteLine(response?.Error?.Message);
return;
}
}
// Add the token counts to the DataFrame
var embeddingsColumn = new StringDataFrameColumn("embeddings", embeddings.Select(e => $"[{string.Join(",", e)}]"));
df.Columns.Add(embeddingsColumn);
DataFrame.SaveCsv(df, $"processed/{domain}/embeddings.csv");
}</code></pre>
<h3>Chat Completion</h3>
<p>The final part of the process is to perform the completion of the question that was asked and the snippet of code below shows how this can be achieved.</p>
<ol>
<li>First we create a context, this is an important part of the completion process as it reads in the initial embeddings, and also creates a new embedding based on the original search query, from this the calculations are performed for each embedding which at a high-level detail how close the embedding is to the original question embedding, these are all returned as an IEnumerable list of doubles.<br /><br /></li>
<li>A prompt is created which basically tells the LLM what to do. In the case of this POC the following prompt is created:<br /><br />
<pre class="language-markup"><code>Answer the question based on the context below and provide reference links, and if the question can't be answered based on the context, say \"I don't know\"\n\nContext: {context}\n\n---\n\nQuestion: {question}\nAnswer</code></pre>
<br />As you can see the context created in step 1 is added to the prompt along with the original question.<br /><br /></li>
<li>The OpenAI completion API endpoint is then called which returns a completion response and from this we retrieve the answer.</li>
</ol>
<pre class="language-csharp"><code> public static async Task<string> AnswerQuestion(
IOpenAIService openAiService,
string domain,
string? question,
string model = "text-davinci-003",
int maxLen = 1800,
string size = "ada",
bool debug = false,
int maxTokens = 150,
string? stopSequence = null)
{
if (question == null)
{
return string.Empty;
}
string context = await CreateContext(openAiService, question, GetEmbeddings(domain), maxLen, size);
if (debug)
{
Console.WriteLine("Context:\n" + context);
Console.WriteLine("\n\n");
}
try
{
var prompt = $"Answer the question based on the context below and provide reference links, and if the question can't be answered based on the context, say \"I don't know\"\n\nContext: {context}\n\n---\n\nQuestion: {question}\nAnswer:";
var completionRequest = new CompletionCreateRequest()
{
Prompt = prompt,
Temperature = 0,
MaxTokens = maxTokens,
TopP = 1,
FrequencyPenalty = 0,
PresencePenalty = 0,
StopAsList = stopSequence != null ? new[] { stopSequence } : null,
Model = model
};
var completionResponse = await openAiService.Completions.CreateCompletion(completionRequest);
return completionResponse.Choices[0].Text.Trim();
}
catch (Exception e)
{
Console.WriteLine(e);
return string.Empty;
}
}
private static async Task<string> CreateContext(IOpenAIService openAiService, string question, DataFrame df, int maxLen = 1800, string size = "ada")
{
List<List<double>> embeddings = df.Rows.Select(row => row[df.Columns.IndexOf("embeddings")].ToString().Trim('[', ']').Split(",").Select(double.Parse).ToList()).ToList();
var response = await openAiService.Embeddings.CreateEmbedding(new EmbeddingCreateRequest()
{
Input = question,
Model = "text-embedding-ada-002"
});
if (!response.Successful)
{
return string.Empty;
}
var qEmbeddings = response.Data[0].Embedding;
IEnumerable<double> distances = DistancesFromEmbeddings(qEmbeddings, embeddings);
var distancesColumn = new PrimitiveDataFrameColumn<double>("distances", distances);
df.Columns.Add(distancesColumn);
DataFrame sortedDf = df.OrderBy("distances");
List<string?> returns = new();
int curLen = 0;
foreach (DataFrameRow row in sortedDf.Rows)
{
curLen += int.Parse(row[df.Columns.IndexOf("n_tokens")].ToString() ?? string.Empty) + 4;
if (curLen > maxLen)
{
break;
}
returns.Add(row[df.Columns.IndexOf("text")].ToString());
}
return string.Join("\n\n###\n\n", returns);
}
private static IEnumerable<double> DistancesFromEmbeddings(IEnumerable<double> qEmbeddings, IEnumerable<IEnumerable<double>> embeddings, string distanceMetric = "cosine")
{
Vector<double> questionVector = Vector<double>.Build.DenseOfArray(qEmbeddings.ToArray());
int numEmbeddings = embeddings.Count();
double[] distances = new double[numEmbeddings];
int index = 0;
foreach (var embedding in embeddings)
{
double[] currentEmbedding = embedding.ToArray();
Vector<double> currentVector = Vector<double>.Build.DenseOfArray(currentEmbedding);
if (distanceMetric == "cosine")
{
double cosineDistance = 1 - (questionVector * currentVector) / (questionVector.L2Norm() * currentVector.L2Norm());
distances[index++] = cosineDistance;
}
else
{
throw new ArgumentException("Unsupported distance metric");
}
}
return distances;
}
private static DataFrame GetEmbeddings(string domain)
{
string csvFilePath = $"processed/{domain}/embeddings.csv";
DataFrame df = DataFrame.LoadCsv(csvFilePath);
return df;
}</code></pre>
<h2>Summary</h2>
<p>This is the first time I have really started to look into and explore the capabilities of AI and how it can be used in conjunction with the Optimizely suite of products. The pairing of Graph, Semantic Search and OpenAI means that you can easily create an AI powered conversational chatbot that will give real value to your customers and allow them to ask questions and get returned answers that are inline with what the user's intent was, there is a lot further that this approach can be taken but for the purposes of a POC I feel that the brief was fully realised.</p>
<h3>References<em><br /></em><em></em></h3>
<p><a href="https://cookbook.openai.com/">https://cookbook.openai.com/</a> <br /><a href="https://learn.microsoft.com/en-us/dotnet/azure/ai/get-started-app-chat-template?tabs=github-codespaces">https://learn.microsoft.com/en-us/dotnet/azure/ai/get-started-app-chat-template?tabs=github-codespaces</a> <br /><a href="https://docs.developers.optimizely.com/platform-optimizely/v1.4.0-optimizely-graph/docs/installation-and-configuration">https://docs.developers.optimizely.com/platform-optimizely/v1.4.0-optimizely-graph/docs/installation-and-configuration</a> <br /><a href="https://docs.developers.optimizely.com/platform-optimizely/v1.4.0-optimizely-graph/docs/event-driven-synchronization">https://docs.developers.optimizely.com/platform-optimizely/v1.4.0-optimizely-graph/docs/event-driven-synchronization</a> <br /><a href="https://docs.developers.optimizely.com/platform-optimizely/v1.4.0-optimizely-graph/docs/scheduled-synchronization">https://docs.developers.optimizely.com/platform-optimizely/v1.4.0-optimizely-graph/docs/scheduled-synchronization</a><br /><a href="https://docs.developers.optimizely.com/platform-optimizely/v1.4.0-optimizely-graph/docs/semantic-search">https://docs.developers.optimizely.com/platform-optimizely/v1.4.0-optimizely-graph/docs/semantic-search</a> <br /><a href="https://openai.com/">https://openai.com/</a> </p>
<div class="author__image col-sm-5"><img src="https://assets-eu-01.kc-usercontent.com/1e387446-ba57-010e-8dbf-944631f19d11/d003b6bf-e48d-43b5-ae36-ace9342bcecb/GrahamCarr_680x454.jpg?w=500&h=1000&auto=format" /></div>
<div class="author__content col-sm-7 keep-margin-bottom">
<h2>Graham Carr, Lead .NET Developer</h2>
<div class="rich-text aos-init aos-animate">
<p>I am an experienced Lead .Net Developer with over 25 years’ experience in a wide range of products and technologies. I have helped companies deliver their digital vision from concept all the way through to delivery. I have a particular passion for DXPs (Digital Experience Platforms) and am a certified developer for products such as Optimizely, Umbraco, Kontent.ai and more.</p>
</div>
</div>2024-01-01T21:26:23.0000000ZBlog postA day in the life of an Optimizely Developer - Optimizely CMS 12: The advantages and considerations when exploring an upgrade<div class="small blog-post__detail"><strong>GRAHAM CARR - LEAD .NET DEVELOPER, 28 Nov 2023</strong></div>
<div class="rich-text aos-init aos-animate">
<p><br />In 2022, Optimizely released CMS 12 as part of its ongoing evolution of the platform to help provide users with the best-in-class DXP tools. Compared with recent updates, the scale of changes is huge, meaning a more complex upgrade process. It's worth it, though!</p>
<p>Here I will talk you through the opportunities and benefits of CMS 12 and explore some of the key considerations around the upgrade process.</p>
<h2><strong>Why upgrade to CMS 12?</strong></h2>
<h4><strong>1. Performance and speed</strong></h4>
<p>Optimizely CMS 12 incorporates cutting edge technology which provides performance enhancements (up to 1,200% in certain areas) that result in faster website page load times. This not only improves the user experience but also contributes to better SEO rankings and increased conversion rates. Faster websites tend to have lower bounce rates, keeping visitors engaged with your content for longer periods.</p>
<h4><strong>2. Enhanced user experience</strong></h4>
<p>Optimizely CMS 12 enhances user experience and usability. The user interface has been refined to make it more intuitive and user-friendly. Content editors and administrators will appreciate the streamlined workflows and improved content management tools for faster content updates and improved overall productivity.</p>
<h4><strong>3. Easier integration</strong></h4>
<p>Optimizely CMS 12 offers seamless integration with third-party tools and services. This makes it easier to connect your CMS with other systems, such as marketing automation platforms, analytics tools, and ecommerce solutions. Integration capabilities can help streamline your digital marketing efforts and provide valuable insights into your website's performance.</p>
<h2><strong>What do I need to consider during the upgrade process?</strong></h2>
<p>Upgrading to CMS 12 isn’t a minor task. You’ll need careful planning, involving developers, testers, content creators, and the buy-in of key stakeholders, to deliver the upgrade successfully. Here are some factors you’ll need to consider:</p>
<ol>
<li><strong>Data migration:</strong><span> </span>Moving content, media files, and data from your existing CMS 11 install to the new CMS 12 can be complex. Some data structures and database schemas have changed, requiring careful planning and execution to ensure a smooth migration.</li>
<li><strong>Custom code and extensions</strong>: Optimizely CMS 11 was built on .Net Framework which has now been replaced in favour of .Net Core in Optimizely CMS 12, so if your current CMS implementation includes custom code or extensions, you’ll want to check that they are compatible with the new version to avoid any conflicts. If there are conflicts, you may need to redevelop or modify custom functionality.</li>
<li><strong>Template and theme compatibility:</strong><span> </span>CMS 12 may introduce changes to template structures and theming – so this is worth bearing in mind if you currently have customised templates or themes in CMS 11.</li>
<li><strong>Compatibility with add-ons:</strong><span> </span>If your website relies on various add-ons or plugins, you'll need to verify that these are compatible with CMS 12. Some add-ons may need to be updated or replaced with alternatives.</li>
<li><strong>Third-party integrations:</strong><span> </span>Any third-party integrations for analytics, ecommerce, marketing automation, or other services, will also need to be reviewed and verified for compatibility. Some integrations will likely need to be updated or reconfigured to work with CMS 12.</li>
<li><strong>Content revalidation:</strong><span> </span>Content that worked well in CMS 11 may require revalidation in CMS 12. Content elements, formatting, and layout may behave differently, necessitating manual adjustments to maintain the desired appearance and functionality.</li>
<li><strong>Training and familiarisation:</strong><span> </span>The user interface and workflow in CMS 12 is different from what your team is accustomed to in CMS 11. Training and familiarisation with the new CMS are essential to ensure your team can efficiently manage content and utilise exciting new features.</li>
<li><strong>Downtime and testing:<span> </span></strong>The upgrade process itself will require reworks and thorough testing to identify and resolve any issues that may arise during the process. This can be time-consuming but is essential to make sure the upgraded version is robust once its live.</li>
<li><strong>Budget and resources:</strong><span> </span>Upgrading will have a number of associated costs including development, testing, and potential downtime. You'll need to allocate resources and budget for the upgrade project accordingly.</li>
</ol>
<h2><strong>I’ve heard there are several different technical approaches. What are they?</strong></h2>
<p>As well as making sure the challenges are considered, it’s important the technical approach is decided on before you start. There are three clear options:</p>
<h4><strong>CMS 11 – CMS 12 direct upgrade</strong></h4>
<p>This involves running the Optimizely Upgrade Assistant on all the projects contained within the codebase. This approach will require a large amount of effort on re-factoring, fixing and testing to get the website upgraded to CMS 12.</p>
<h4><strong>CMS 12 - Vanilla install upgrade​</strong></h4>
<p>This approach starts with a brand-new CMS 12 installation. ​A ‘lift and shift’ of both the front-end and back-end functionality is then performed. This approach will still require re-factoring to be performed through the process especially when pulling back-end code over, to ensure that it is in alignment with Optimizely CMS 12.</p>
<h4><strong>CMS 12 - Website rebuild</strong></h4>
<p>According to research, the average lifespan of a website is 2 years and 7 months, so depending on the age and complexity of your website, upgrading to Optimizely CMS 12 might be the perfect opportunity to consider a full redesign and rebuild of your website.</p>
<p>If a full rebuild is not your chosen path, then I recommend a CMS 12 vanilla install upgrade. This method ensures that all of your website is migrated in the most efficient manner whilst at the same time leveraging the benefits of refactoring your code specifically for CMS 12 as you are going along.</p>
<h2><strong>Is the effort required worth it?</strong></h2>
<p>Absolutely.<strong><span> </span></strong>Whilst upgrading from Optimizely CMS 11 to CMS 12 will require time, effort and budget, it is a strategic move that can significantly benefit your organisation. From enhanced performance, security, and content personalisation, along with improved user experience, and mobile-friendliness, Optimizely CMS 12 brings many advantages drive competitive advantage in the digital landscape.</p>
<p>As technology continues to evolve, keeping your CMS up to date is essential for meeting the demands of your audience and achieving your marketing and business goals. I believe that making the transition to Optimizely CMS 12 will ultimately propel your digital presence to new heights. And the longer you delay essential updates, the more technical debt you’ll accumulate and the harder the process will get.<br /><br /></p>
<div class="author__image col-sm-5"><img src="https://assets-eu-01.kc-usercontent.com/1e387446-ba57-010e-8dbf-944631f19d11/d003b6bf-e48d-43b5-ae36-ace9342bcecb/GrahamCarr_680x454.jpg?w=500&h=1000&auto=format" /></div>
<div class="author__content col-sm-7 keep-margin-bottom">
<h2>Graham Carr, Lead .NET Developer</h2>
<div class="rich-text aos-init aos-animate">
<p>I am an experienced Lead .Net Developer with over 25 years’ experience in a wide range of products and technologies. I have helped companies deliver their digital vision from concept all the way through to delivery. I have a particular passion for DXPs (Digital Experience Platforms) and am a certified developer for products such as Optimizely, Umbraco, Kontent.ai and more.</p>
</div>
</div>
</div>2023-11-28T08:19:21.0000000ZBlog postA day in the life of an Optimizely Developer - OptiUKNorth Meetup January 2024<p>It's time for another UK North Optimizely meet up!<br /><br />After the success of the last one, Ibrar Hussain (26) and Paul Gruffydd (Kin + Carta) will be hosting again at the same venue - Everyman Cinema, Manchester (see some pics below!).<span class="white-space-pre"> </span><br /><br />This event will commence on the evening of January 11th 2024.<br /><br />📢 📢 CALL FOR SPEAKERS 📢 📢<span class="white-space-pre"> </span><br />If anybody is interested in speaking at the event (we should be able to fit around 4-5 talks in) then please DM Ibrar or Paul.<br /><br />We are really excited to push this forward so if you are interested in attending then please register via the following link - <a href="https://www.optimizely.com/local-dev-meetups">https://www.optimizely.com/local-dev-meetups</a> </p>
<h1><span>Optimizely #OptimizelyUKNorth<br /><br /><img src="/link/7876425badeb434d939f909398fab724.aspx" width="294" alt="" height="393" /> <img src="/link/af4e44867cf94375aa07ab4abfd7783c.aspx" width="295" alt="" height="393" /> </span></h1>
<h1><span><img src="/link/cadbd66550c4408a943e550d3499094b.aspx" width="522" alt="" height="392" /><br /><br /><img src="/link/2ffabb11cb87477a8a7fc6372cc61f7a.aspx" width="572" alt="" height="422" /> </span></h1>
<h1><span><img src="/link/0a1d4dfba7c64365b08c7e1dd60b03f8.aspx" width="563" alt="" height="422" /></span></h1>
<div class="author__image col-sm-5"><img src="https://assets-eu-01.kc-usercontent.com/1e387446-ba57-010e-8dbf-944631f19d11/d003b6bf-e48d-43b5-ae36-ace9342bcecb/GrahamCarr_680x454.jpg?w=500&h=1000&auto=format" /></div>
<div class="author__content col-sm-7 keep-margin-bottom">
<h2>Graham Carr, Lead .NET Developer</h2>
<div class="rich-text aos-init aos-animate">
<p>I am an experienced Lead .Net Developer with over 25 years’ experience in a wide range of products and technologies. I have helped companies deliver their digital vision from concept all the way through to delivery. I have a particular passion for DXPs (Digital Experience Platforms) and am a certified developer for products such as Optimizely, Umbraco, Kontent.ai and more.</p>
</div>
</div>2023-11-28T08:06:18.0000000ZBlog postA day in the life of an Optimizely Developer - Vertical Slicing in CMS12<p>There is such a vast choice these days in how you can build a website, aside from all of the different programming languages out there, there are many different methodologies and patterns that can be used.</p>
<p>In this blog post, I cover off Vertical Slicing, which is a method that we adopt widely in all of our CMS 12 builds. I personally believe this is a way of ensuring we stick to the important concept of SRP (Single Responsibility Principle) as well as being one of the better ways of structuring projects within an Agile delivery program.</p>
<h2>Horizontal Layering </h2>
<p>The traditional way of building .Net applications is via a concept called the Horizontal Layering Approach. This is a software design pattern that divides an application into distinct layers, each with a specific responsibility, to promote separation of concerns, improve maintainability, and facilitate testing and scalability.</p>
<p>The following are the common layers of a typical .Net Core application:</p>
<ol>
<li>
<p>Presentation Layer: This is the topmost layer of the application that deals with user interface components such as forms, pages, and controls. It is responsible for receiving user inputs and displaying the results to the user. It communicates with the business logic layer to perform actions and retrieve data.</p>
</li>
<li>
<p>Business Logic Layer: This layer contains the business logic of the application, which is responsible for processing the data and applying business rules. It contains the application's core functionality and domain-specific logic. The business logic layer communicates with the data access layer to retrieve or store data.</p>
</li>
<li>
<p>Data Access Layer: This layer provides an interface to access the data store, such as a database or file system. It is responsible for querying and retrieving data from the data store and providing it to the business logic layer. The data access layer also handles data validation, caching, and transaction management.</p>
</li>
</ol>
<p>By separating the application into these distinct layers, developers can better manage complexity, maintain code quality, and achieve greater flexibility and scalability. Changes made in one layer do not affect the other layers, allowing for easier maintenance and modification. Additionally, each layer can be tested independently, which helps to identify issues early in the development process.</p>
<h3>Optimizely CMS12 Example</h3>
<p>As CMS 12 is a pre-built application, we do not have the data access layer as described above, however as you can see from the screenshot below of the out-of-the-box AlloyCMS example, the way in which the code is structured does still have distinct horizontal layering.</p>
<ul>
<li>Business - this folder contains business logic used by the different blocks, pages and other general components</li>
<li>Controllers - this folder contains the individual controllers for the page types of the website</li>
<li>Models - this folder contains all of the models used by Content Types (Pages/Blocks), ViewModels, etc.</li>
<li>Views - this folder contains all of the views for pages, blocks, etc. </li>
</ul>
<p><img src="/link/6148f3dfdbc34471af4c6e7341db0813.aspx" width="277" height="392" /></p>
<p>The functionality for a specific feature is clearly spread across multiple folders within the solution and thus increases complexity, testing overhead and can lead to perfomance issues if not implemented correctly.</p>
<h2>Vertical slicing</h2>
<p>Vertical slicing is a software development approach where a feature is implemented in a single vertical slice of the application's architecture, spanning the user interface down to the data access layer. In ASP.NET Core applications, this approach is often used to build small, independent, and self-contained parts of a larger application.</p>
<p>The idea behind vertical slicing is to create a clear separation of concerns within the application, where each slice represents a specific feature or business capability. Each slice includes all the layers required to implement the feature, such as the user interface, business logic, data access, and data storage. By doing this, the developer can work on a specific feature end-to-end, without being blocked by other parts of the application.</p>
<p>Some of the benefits of vertical slicing in ASP.NET Core applications include:</p>
<ul>
<li><span><span class="ui-provider cnc cnd c d e f g h i j k l m n o p q r s t cne cnf w x y z ab ac ae af ag ah ai aj ak">Easier to maintain, all the code is in one place and does not have to be hunted down.</span></span></li>
<li><span><span class="ui-provider cnc cnd c d e f g h i j k l m n o p q r s t cne cnf w x y z ab ac ae af ag ah ai aj ak">Reduced test surface when changing a single feature</span></span>
<ul>
<li>Due to decoupling between features while coupling tightly within a feature</li>
<li>Has a cost of duplication of some code while maintaining that decoupled natu</li>
</ul>
</li>
</ul>
<h3>CMS 12 Example</h3>
<p>In the example CMS 12 solution structure below (taken from one of our client builds), you can see that we have a "Features" project, this contains a "Common" folder which contains common functionality that is either utilised by a number of different components or is functionality global to Optimizely, examples being Editor Descriptors, Api Controllers, Extensions, Helpers, etc.</p>
<p>The other folder in this solution (although not required, this is just for additional nesting) is the "Components" folder, this has the following sub-folders:</p>
<ul>
<li>Blocks - this contains sub-folders for each block content type in the application, each folder encapsulating all of the functionality that the block requires</li>
<li>Pages - this contains sub-folders for each page content type in the application, each folder encapsulating all of the functionality that the page requires</li>
<li>Global - this contains sub-folders for each global feature within the application, each folder encapsulating all of the functionality for that feature, examples being footer, header, navigation, breadcrumb, etc.</li>
</ul>
<p>In the example below, we have the AccordionBlock folder, this contains:</p>
<ul>
<li>AccordionBlock.cs - this is the model class for the accordion block content type</li>
<li>AccordionBlockValidator.cs - this is the IValidate class for validation of the accordion block fields</li>
<li>AccordionContainerBlock.cs - this is the model class for the accordion container block content type (this block contains one or more accordion block content types)</li>
<li>AccordionContainerBlockViewComponent - this is the ViewComponent class which encapsulate all of the functionality for the accordion block feature</li>
<li>AccordionContainerViewModel - this is the view model that is passed into the View file</li>
<li>AccordionViewModel - this is the view model that is passed into the View file as part of AccordionContainerViewModel</li>
</ul>
<p><img src="/link/99728b3ec68c4560a4f8a41542752194.aspx" width="294" height="273" /></p>
<p>The next screenshot shows the "Web" project, this contains the standard "Views" folder, with sub-folders for the different pages in the application, there is also a "Components" folder (although not required, this is just for additional nesting) which contains folders for all of the components (blocks and global) that exist in the features project. Within each of these folders is a single Index.cshtml file which is the View file for the related View Component.</p>
<p><img src="/link/1ed72cf345a6445fafe8579c57390c71.aspx" width="293" height="408" /></p>
<p>It is clear to see that this method of structuring your applications, provides a much cleaner and more concise way of grouping all of the functionality and related files for a feature into easily distinguishable folders.</p>
<h2>Summary</h2>
<p>In summary, while the layered approach to building a .Net Core application does have many benefits, it also has some drawbacks that developers should be aware of. Here are some potential cons to consider:</p>
<ol>
<li>
<p>Increased complexity: The layered approach can make the application more complex as it requires more code and more layers of abstraction. This can lead to increased development time and greater difficulty in maintaining the application.</p>
</li>
<li>
<p>Performance issues: The layered approach can lead to performance issues if not implemented correctly. Each layer adds an overhead that can slow down the application. Additionally, excessive or inefficient data access calls can cause delays in data retrieval. Also performance issues can arise due to repositories and services doing more than they need to do for the intended usage.</p>
</li>
<li>
<p>Over-engineering: The layered approach can lead to over-engineering if the application does not require a high level of complexity. This can lead to unnecessary code and can make the application difficult to understand and maintain.</p>
</li>
<li>
<p>Testing overhead: While testing each layer separately can help identify issues early on, it can also lead to increased testing overhead. Testing each layer separately can be time-consuming and may require more resources.</p>
</li>
<li>
<p>Lack of flexibility: The layered approach can make the application less flexible as it can be difficult to make changes that affect multiple layers. This can lead to code duplication and increased maintenance costs.</p>
</li>
<li>Lots of model mappers needed for moving between layers</li>
</ol>
<p>The main benefit of a layered approach is that:</p>
<ul>
<li><span><span class="ui-provider cnc cnd c d e f g h i j k l m n o p q r s t cne cnf w x y z ab ac ae af ag ah ai aj ak">You are able to swap out a layer, namely swap out presentation or database while keeping the rest, although usages of this are extremely few and far between</span></span></li>
</ul>
<p>When we look at Vertical Slicing however we can see that it has the following pros:</p>
<ol>
<li>
<p>Faster feedback: With vertical slicing, developers can quickly get feedback on the feature they are building as they work through all layers of the application. This helps to identify issues early and address them before they become bigger problems.</p>
</li>
<li>
<p>Better user experience: Vertical slicing ensures that features are built from end to end, which helps to ensure a seamless user experience. This can lead to higher user satisfaction and increased adoption of the application.</p>
</li>
<li>
<p>Greater agility: Vertical slicing enables developers to quickly deliver features and respond to changing requirements. As each feature is built from end to end, developers can quickly make changes to any layer of the application without affecting other features.</p>
</li>
<li>
<p>Improved collaboration: Vertical slicing promotes collaboration among developers as they work together to build features from end to end. This approach also helps to ensure that developers have a better understanding of how all layers of the application work together.</p>
</li>
<li>
<p>Better maintainability: Vertical slicing can lead to better maintainability as developers can quickly understand how a feature is built and make changes as needed. This can help to reduce the amount of technical debt in the application.</p>
</li>
</ol>
<p>So in conclusion, while the layered approach has its benefits, vertical slicing can be a useful alternative approach for .NET developers, particularly in projects where speed, user experience, and agility are critical.</p>
<h2>Resources</h2>
<p><a href="https://code-maze.com/vertical-slice-architecture-aspnet-core/">https://code-maze.com/vertical-slice-architecture-aspnet-core/</a><br /><a href="https://dev.to/htech/exploring-vertical-slices-in-dotnet-core-3mik/">https://dev.to/htech/exploring-vertical-slices-in-dotnet-core-3mik/</a><br /><a href="https://awesome-architecture.com/vertical-slice-architecture/">https://awesome-architecture.com/vertical-slice-architecture/</a><br /><a href="https://medium.com/aspnetrun/layered-architecture-with-asp-net-core-entity-framework-core-and-razor-pages-53a54c4028e3/">https://medium.com/aspnetrun/layered-architecture-with-asp-net-core-entity-framework-core-and-razor-pages-53a54c4028e3/</a><br /><a href="https://www.c-sharpcorner.com/article/three-tier-architecture-in-asp-net-core-6-web-api/">https://www.c-sharpcorner.com/article/three-tier-architecture-in-asp-net-core-6-web-api/</a> </p>
<div class="author__image col-sm-5"><img src="https://assets-eu-01.kc-usercontent.com/1e387446-ba57-010e-8dbf-944631f19d11/d003b6bf-e48d-43b5-ae36-ace9342bcecb/GrahamCarr_680x454.jpg?w=500&h=1000&auto=format" /></div>
<div class="author__content col-sm-7 keep-margin-bottom">
<h2>Graham Carr, Lead .NET Developer</h2>
<div class="rich-text aos-init aos-animate">
<p>I am an experienced Lead .Net Developer with over 25 years’ experience in a wide range of products and technologies. I have helped companies deliver their digital vision from concept all the way through to delivery. I have a particular passion for DXPs (Digital Experience Platforms) and am a certified developer for products such as Optimizely, Umbraco, Kontent.ai and more.</p>
</div>
</div>2023-03-20T14:05:51.0000000ZBlog postA day in the life of an Optimizely Developer - OptiNorth Meetup March 2023<p>Hello and welcome to another instalment of A Day In The Life Of An Optimizely Developer. Last night (1st March 2023) I was excited to have attended the March 2023 OptiNorth Meetup in Manchester and in this blog post I will give an overview of the evening and what my learnings and main takeaways were.</p>
<h2>The Venue</h2>
<p>The meetup location was the Everyman Cinema located on Quay Street, Manchester. I have never been to an Everyman Cinema and was very impressed by the venue, in terms of facilities and comfort. I arrived at 5:15 allowing 45 minutes for networking before the talks began at 6pm.</p>
<figure class="image"><img src="/link/7bd28f07d7e3432fae91f882b9c64bf5.aspx" width="569" height="759" />
<figcaption>Outside the venue</figcaption>
</figure>
<p><br />The networking for the area took place in the bar area of the Everyman Cinema and was a perfect and relaxing area to chat with the attendees and speakers both prior to the presentations and during the mid-point break and after the presentations (also helped by both the open bar tab and food).<br /><br /></p>
<figure class="image"><img src="/link/66c189dffbd940b6bf8888dff028007e.aspx" width="796" height="597" style="width: 789px; height: 592px;" />
<figcaption>Pre-talk networking in the bar area</figcaption>
</figure>
<p><br />As you can see by the next image, the presentation room was in one of the cinema rooms, having never been to an Everyman Cinema before I have to say that I was impressed by the use of sofas and cushions and proved to be both small enough to hear and see everything but also comfy and relaxing at the same time.<br /><br /></p>
<figure class="image"><img src="/link/7e244a075a044edc988ad9b157d65bc9.aspx" width="1478" alt="" height="1108" style="width: 789px; height: 592px;" />
<figcaption>Comfy sofas and cushions</figcaption>
</figure>
<h2>Introductions</h2>
<p>The presentations kicked off with an introduction by the sponsors of the meeting, our very own Ibrar Hussain, Technical Director at <a href="https://www.26-agency.com">26</a> and <span>Paul Gruffydd, Technical Director at <a href="https://www.kinandcarta.com">Kin + Carta</a> - they both gave a brief overview of who they were and what their job roles were, and gave a small introduction to the speakers of the evening and what the talks were about.<br /><br /></span></p>
<figure class="image"><img src="/link/da8022183a264cfeabff954de21ce9a4.aspx" width="789" alt="" height="582" />
<figcaption>Ibrar Hussain, Technical Director at <a href="https://www.26-agency.com">26</a> and <span>Paul Gruffydd, Technical Director at <a href="https://www.kinandcarta.com">Kin + Carta</a></span></figcaption>
</figure>
<h2>Simplifying a new website build on CMS12</h2>
<p>The first talk kicked off by one of my work colleagues at <a href="https://www.26-agency.com">26</a> Mark Stott, who is our Lead Optimizely Developer as well as an <a href="/link/ed828821aeb74380ba334ce78ad022f5.aspx">OMVP</a> - the content of his talk was on how we can simplify new website builds when utilising Optimizely CMS12.</p>
<figure class="image"><img src="/link/ce1930d92ea9492c9e1f7907e81e2f45.aspx" width="789" alt="" height="592" />
<figcaption>Simplifying new CMS12 builds</figcaption>
</figure>
<p><br />The content of this talk covered the following areas:</p>
<ul>
<li>What is great about CMS 12, including the use of .Net 6 architecture and therefore benefiting from the performance and security improvements this new framework provides</li>
<li>How we can utilise Razor Class Libraries to create NuGet packages for specific areas of functionality that are generally repeated across many website builds (e.g. News functionality, Events functionality, etc.)
<ul>
<li>These packages can contain all of the generic properties, functionality, associated JS and razor views, stylesheets could be added but as the layout and styling will differ per site it is recommended not add these</li>
<li>Once the package has been added to the project you can override the classes to hide properties that might not apply for a specific client and you can also override the razor views to provide a different layout/structure if that is also required, at this point CSS files can also be added to provide the unique styling</li>
</ul>
</li>
<li>Some thought has to be put into what is put into the razor class library, but it needs to be made as generic as possible to be useful for many different web projects</li>
</ul>
<p>Mark then went into a demo of this showing an example razor class library to provide news functionality, this was then added as a package to a CMS12 build, and he then showed how we can utilise and then override the functionality and view(s)</p>
<figure class="image"><img src="/link/eebf47f777f64609a905ab474d3fe224.aspx" width="790" alt="" height="593" />
<figcaption>Mark doing a demo of utilising Razor Class Libraries</figcaption>
</figure>
<p><br />In his summary he made it clear that the use of Razor Class Libraries can help you to build out features set to an exceptional standard that can be installed as packages.</p>
<h2>Liquid Templating</h2>
<p>The next talk was done by <span>Mark Everard who is an Optimizely Consultant and owner of the company FTT (First Three Things). His talk was on liquid templating, for those of you who have never heard of Liquid, it is an open-source templating language that was created by and is used in production by Shopify.</span></p>
<figure class="image"><img src="/link/c9151c38f9704c0da98f73a67dc213a6.aspx" width="789" alt="" height="592" />
<figcaption>Liquid Templating</figcaption>
</figure>
<p><span><br />During his talk, Mark covered off the following areas, however the reasoning behind providing Liquid Templating is that Optimizely are trying to move away from relying on C# skills to build out fazor views and associated functionality. There are development teams spread across the globe who might not have any C# resource, therefore providing Liquid Templating allows non-C# developers to build out functionality in Liquid Templates whilst at the same time utilising the helper methods that it provides.</span></p>
<ul>
<li>What liquid templating is, it's benefits and why Optimizely are pushing for different view engines</li>
<li>An overview of the Liquid Templating NuGet package that Mark created in conjunction with Optimizely</li>
<li>An overview of the helper methods that the package also provides</li>
</ul>
<p>Mark then went on to do a demo of the package, which included how to create liquid templates, how they get added in the Optimizely solution and some examples of utilising the various helper method classes that are available.</p>
<figure class="image"><img src="/link/da4385d43fad4256b04a02fd084efdf7.aspx" width="789" alt="" height="592" />
<figcaption>Liquid Templating Optimizely Package Demo</figcaption>
</figure>
<p><br />In his summary he re-iterated the direction that Optimizely want to be heading and why the Liquid Templating package is useful for certain development teams.</p>
<p><span>When the talk and question time finished, we took a break for food and more networking (who doesn't like free food and drink at an event!!)</span></p>
<h2>GraphQL & Optimizely Content Graph</h2>
<p>After the break, the next person to talk was <span>Paul Gruffydd, Technical Director at <a href="https://www.kinandcarta.com">Kin + Carta</a></span> who covered GraphQL and Optimizely Content Graph.</p>
<figure class="image"><img src="/link/44ba1aad452f4598aeca51025b5162ff.aspx" width="789" alt="" height="592" />
<figcaption>GraphQL and Optimizely Content Graph</figcaption>
</figure>
<p><br />The talk that Paul did started with an overview of what GraphQL is and why it is useful compared to REST API's, for instance GraphQL allows you to retrieve specific information from an object whenever you like, whereas REST Apis generally need to return the full model of an object to be useful for different use cases.</p>
<p>As an overview, the following was covered during this talk:</p>
<ul>
<li>What GraphQL is and it's use cases</li>
<li>How GraphQL has been implemented and made available by Optimizely Content Graph</li>
<li>The difference in speed between GraphQL queries and traditional REST Api calls</li>
<li>How the Strawberry Shake GraphQL client for Visual Studio can be used</li>
</ul>
<p>Paul then did a demo of creating and running some GraphQL queries within Optimizely, whilst at the same time showing how much faster GraphQL queries are compared to REST Api calls. He also showed how the Strawberry Shake Visual Studio plugin can be used to create GraphQL clients.</p>
<figure class="image"><img src="/link/9ccc5832a1764a12932b3c7d37693afa.aspx" width="789" alt="" height="592" />
<figcaption>Demo time</figcaption>
</figure>
<h2>How to run successful experimentation projects with Optimizely</h2>
<p>The final talk was done by Optimizely's own Simon Chapman who is a <span>Lead Solution Architect and his talk was on how to run successful experimentation projects with Optimizely.</span></p>
<figure class="image"><img src="/link/5178a1d58ff343768cfc18b66c0a77b3.aspx" width="789" alt="" height="592" />
<figcaption>Running successful experimentation projects with Optimizely</figcaption>
</figure>
<p><br />Simon provided an overview of what Optimizely Experimentation is and how it fits into the landscape of the Optimizely product suite as well as the following areas:</p>
<ul>
<li>The integration roadmap and how it can integrate with things such as BigQuery and an upcoming integration with GA4 v1.1 and v1.2</li>
<li>Design best practices when planning for experiments such as using unique ids for elements, avoid using HTML tables for layouts, etc.</li>
<li>Improving site performance for experimentation tests, such as snippet placement, increase the Cache Expiration (TTL), deploy the snippet synchronously, etc.</li>
<li>An important note about using the show/hide elements to deliver substantial changes outside of Optimizely Wev Experimentation, e.g. embedding images and HTML in the native HTML tags and then using show/hide to create the versions of the pages you are testing.</li>
<li>A comparison chart of different experimentation platforms that shows Optimizely's experimentation is the best in the class</li>
<li>A brief overview of Optimizely Connect Platform (OCP) which is one point of integration for the Optimizely ecosystem and 3rd party platforms, and a showcase of the OCP App Marketplace.</li>
</ul>
<figure class="image"><img src="/link/4f4f4cb97a1745ff8c6efeed0591d9b6.aspx" width="1901" alt="" height="1426" style="width: 789px; height: 592px;" />
<figcaption>How and where experimentation sits in the Optimizely space</figcaption>
</figure>
<p><br /><br /></p>
<figure class="image"><img src="/link/709d112ff45e486f8f2078d116f2b7d4.aspx" width="789" alt="" height="592" />
<figcaption>Optimizely Experiementation Comparison</figcaption>
</figure>
<p><br />Simon then finished off his talk by showing some examples of how to setup some experimentations and how they are then run and data captured to be analysed so you can determine the results of the tests.</p>
<h2>Main Takeaways and Learnings</h2>
<p>All in all the event was very insightful and gave me a lot of food for thought in terms of how we could utilise some of these practices and technologies in the Optimizely builds we do at <a href="https://www.26-agency.com">26</a> - the main points that I take away from this event are as follows:</p>
<ul>
<li>How Razor Class Libraries can be utilised to create specific features that are regularly used in CMS builds, packaged up as NuGet packages and utilised and overridden in CMS builds, feature slicing is an important concept that I believe should be used wherever possible and this goes a long way to helping with this, it also helps you provide value rather than features.</li>
<li>What Liquid Templating is and why it is the direction that Optimizely want to be heading, it was also made clear how it comes in useful for non-C# development teams, I particularly liked seeing the demo and how much thought had gone into providing helper methods.</li>
<li>What GraphQL is and why it can be preferable to REST Apis, the demo was a great showcase of its possibilities and showcasing the speed compared to REST Apis was quite an eye opener.</li>
<li>My knowledge of Optimizely Experimentation is now much more improved and I was particularly impressed by how blazing fast it is and how it outdoes it's competitors. It was also interesting to hear about the deprecation of Google Optimize and the cross-over special offer Optimizely have created to help customers move from Optimize to Optimizely Experimentation.</li>
</ul>
<h2>References</h2>
<p>Below are a list of links to further information on areas of the talks by all four speakers.</p>
<h3>Simplifying CMS12 Builds</h3>
<p><a href="https://github.com/GeekInTheNorth">https://github.com/GeekInTheNorth</a><br /><a href="https://www.linkedin.com/in/mark-antony-stott/">https://www.linkedin.com/in/mark-antony-stott/</a> <br /><a href="https://learn.microsoft.com/en-us/aspnet/core/razor-pages/ui-class?view=aspnetcore-7.0&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;tabs=visual-studio">https://learn.microsoft.com/en-us/aspnet/core/razor-pages/ui-class?view=aspnetcore-7.0&tabs=visual-studio</a> <br /><a href="https://learn.microsoft.com/en-us/aspnet/core/blazor/components/class-libraries?view=aspnetcore-7.0&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;tabs=visual-studio">https://learn.microsoft.com/en-us/aspnet/core/blazor/components/class-libraries?view=aspnetcore-7.0&tabs=visual-studio</a> <br /><a href="https://medium.com/swlh/using-razor-class-library-rcl-to-generate-a-common-ui-for-all-your-dotnet-web-projects-be970d4a82a0">https://medium.com/swlh/using-razor-class-library-rcl-to-generate-a-common-ui-for-all-your-dotnet-web-projects-be970d4a82a0</a> </p>
<h3>Liquid Templating</h3>
<p><a href="https://github.com/markeverard">https://github.com/markeverard</a> <br /><a href="https://www.linkedin.com/in/everard/">https://www.linkedin.com/in/everard/</a> <br /><a href="https://github.com/episerver/liquid-templating-cms">https://github.com/episerver/liquid-templating-cms</a> <br /><a href="/link/72f9dc98320d484c860be38dcee469ef.aspx">https://world.optimizely.com/blogs/deane-barker/dates/2023/1/introducing-liquid-templating/</a> <br /><a href="https://shopify.github.io/liquid/">https://shopify.github.io/liquid/</a> <br /><a href="https://nuget.optimizely.com/package/?id=Optimizely.CMS.Labs.LiquidTemplating">https://nuget.optimizely.com/package/?id=Optimizely.CMS.Labs.LiquidTemplating</a> </p>
<h3>GraphQL and Optimizely Content Graph</h3>
<p><a href="https://www.linkedin.com/in/paulgruffydd">https://www.linkedin.com/in/paulgruffydd</a> <br /><a href="https://github.com/PaulGruffyddAmaze">https://github.com/PaulGruffyddAmaze</a> <br /><a href="https://docs.developers.optimizely.com/digital-experience-platform/v1.4.0-content-graph/docs/project-graphql">https://docs.developers.optimizely.com/digital-experience-platform/v1.4.0-content-graph/docs/project-graphql</a> <br /><a href="https://docs.developers.optimizely.com/digital-experience-platform/v1.4.0-content-graph/docs/using-the-graphql-api">https://docs.developers.optimizely.com/digital-experience-platform/v1.4.0-content-graph/docs/using-the-graphql-api</a> <br /><a href="https://docs.developers.optimizely.com/digital-experience-platform/v1.4.0-content-graph/docs">https://docs.developers.optimizely.com/digital-experience-platform/v1.4.0-content-graph/docs</a> <br /><a href="https://graphql.org/">https://graphql.org/</a> <br /><a href="https://chillicream.com/docs/strawberryshake/v13">https://chillicream.com/docs/strawberryshake/v13</a> <br /><a href="https://marketplace.visualstudio.com/items?itemName=ChilliCream.strawberryshake-visualstudio">https://marketplace.visualstudio.com/items?itemName=ChilliCream.strawberryshake-visualstudio</a> </p>
<h3>Successful Experimentation Projects with Optimizely</h3>
<p><a href="https://www.linkedin.com/in/sgchapman/">https://www.linkedin.com/in/sgchapman/</a> <br /><a href="https://www.optimizely.com/products/experiment/feature-experimentation/">https://www.optimizely.com/products/experiment/feature-experimentation/</a> <br /><a href="https://docs.developers.optimizely.com/experimentation">https://docs.developers.optimizely.com/experimentation</a> <br /><a href="https://docs.developers.optimizely.com/experimentation/v10.0.0-web/docs">https://docs.developers.optimizely.com/experimentation/v10.0.0-web/docs</a> <br /><a href="https://www.optimizely.com/insights/feature-experimentation-demo/">https://www.optimizely.com/insights/feature-experimentation-demo/</a> <br /><a href="https://www.optimizely.com/insights/experimentation-series-dev/">https://www.optimizely.com/insights/experimentation-series-dev/</a> <br /><a href="https://www.optimizely.com/google/optimize/">https://www.optimizely.com/google/optimize/</a> <br /><a href="https://docs.developers.optimizely.com/experimentation/v3.1.0-full-stack/docs">https://docs.developers.optimizely.com/experimentation/v3.1.0-full-stack/docs</a> </p>
<div class="author__image col-sm-5"><img src="https://assets-eu-01.kc-usercontent.com/1e387446-ba57-010e-8dbf-944631f19d11/d003b6bf-e48d-43b5-ae36-ace9342bcecb/GrahamCarr_680x454.jpg?w=500&h=1000&auto=format" /></div>
<div class="author__content col-sm-7 keep-margin-bottom">
<h2>Graham Carr, Lead .NET Developer</h2>
<div class="rich-text aos-init aos-animate">
<p>I am an experienced Lead .Net Developer with over 25 years’ experience in a wide range of products and technologies. I have helped companies deliver their digital vision from concept all the way through to delivery. I have a particular passion for DXPs (Digital Experience Platforms) and am a certified developer for products such as Optimizely, Umbraco, Kontent.ai and more.</p>
</div>
</div>2023-03-03T14:47:52.0000000ZBlog postA day in the life of an Optimizely Developer - Implementing Identity Server 4 and ASP.Net Identity<p>Hello and welcome to another instalment of A Day In The Life Of An Optimizely Developer.</p>
<p>Recently on a CMS 12 build that I was doing for a client I was faced with the challenge of implementing Identity Server 4 for the website user login, whilst still retaining the default ASP.Net Identity login for Optimizely CMS. At the outset this sounded quite easy, but reality showed me otherwise, therefore I have written this blog post to provide reader's with an overview of how you setup two different authentication schemes at the same time.</p>
<p>In this implementation, I needed to integrate with a 3rd party SSO solution that was running on Identity Server 4. For those not aware of Identity Server, combining OpenID Connect and OAuth 2.0 is considered one of the best approaches to securing modern applications and Identity Server 4 is an implementation of these two protocols. I won't delve too deep into what Identity Server 4 is and how it is used, I have added some links in the reference section at the end of this blog post that provide more information if you fancy some bedtime reading.</p>
<p><img src="https://docs.wso2.com/download/attachments/60493891/OAuth%20grant%20types%20-%20AuthorizationCode%20%281%29.png?version=1&amp;amp;amp;amp;amp;amp;modificationDate=1510603077000&amp;amp;amp;amp;amp;amp;api=v2" width="601" height="385" /></p>
<p>Before we start with the implementation we first need to add a reference to the Microsoft.AspNetCore.Authentication.OpenIdConnect NuGet package, this allows us to use OpenIdConnect for our implementation with Identity Server 4. The official documentation describes OpenID Connect as:</p>
<p><em>"OpenID Connect 1.0 is a simple identity layer on top of the OAuth 2.0 protocol. It allows Clients to verify the identity of the End-User based on the authentication performed by an Authorization Server, as well as to obtain basic profile information about the End-User in an interoperable and REST-like manner.</em></p>
<p><em>OpenID Connect allows clients of all types, including Web-based, mobile, and JavaScript clients, to request and receive information about authenticated sessions and end-users. The specification suite is extensible, allowing participants to use optional features such as encryption of identity data, discovery of OpenID Providers, and logout, when it makes sense for them."</em></p>
<p><img src="/link/56702db27567454fadb15138fac57f5c.aspx" /></p>
<p>So moving onto the implementation of this, the first step is to add a new class called "UserAuthenticationServiceExtensions" which will act as the middleware that you inject in the Startup.cs file (detailed later). We first need to add the constructor for the AddUserAuthentication class, this needs to call the AddCmsAspNetIdentity method that adds the authentication scheme for the CMS logins as Asp.Net Identity, the next call is to a private method AddIdentityServer that adds the OpenID Connect and IdentityServer scheme functionality.</p>
<pre class="language-csharp"><code> public static IServiceCollection AddUserAuthentication(
this IServiceCollection services,
IWebHostEnvironment environment,
IConfiguration configuration)
{
services.AddCmsAspNetIdentity<ApplicationUser>();
services.AddIdentityServer(configuration);
return services;
}</code></pre>
<p>Within the AddIdentityServer method we first need to a add couple of constants that define both an Authentication and Challenge scheme to be used in the Identity Server implementation utilising OpenID Connect.</p>
<pre class="language-csharp"><code> private const string AuthenticationScheme = CookieAuthenticationDefaults.AuthenticationScheme; // CookieAuthenticationDefaults.AuthenticationScheme =
"Cookies"
private const string ChallengeScheme = OpenIdConnectDefaults.AuthenticationScheme; // OpenIdConnectDefaults.AuthenticationScheme = "OpenIdConnect"</code></pre>
<p>The next step is to add the call to the AddAuthentication method to define the default Authentication and Challenge schemes. We can see that the default challenge scheme is set to "policy-scheme", this is a custom scheme that is defined later in the class and is the important part for ensuring the application can determine when the two different authentication schemes are to be used.</p>
<pre class="language-csharp"><code>services.AddAuthentication(options =>
{
options.DefaultScheme = AuthenticationScheme;
options.DefaultChallengeScheme = "policy-scheme";
})</code></pre>
<p>We next need to add the two cookies required for both authentication schemes. The first cookie is the one that will be utilised by the Asp.Net Identity authentication scheme and the second cookie is the one that will be used by the OpenID Connect authentications scheme.</p>
<pre class="language-csharp"><code>.AddCookie(AuthenticationScheme, options =>
{
// Defines a path to redirect the user to if they don't have access to a page.
// This page should return a 200 response so as to not cause authentication loops.
options.AccessDeniedPath = new PathString("/no-access");
})
.AddCookie(ChallengeScheme)</code></pre>
<p>The next part of the implementation is to add the OpenID Connect specific functionality calling the "AddOpenIdConnect" method. I have just highlighted the important parts to call out of this functionality as the rest is pretty standard implementation and also depends very much on how your Identity Server 4 client has been setup. </p>
<p>So in this call we can see that we pass in the name of the authentication scheme we want to associate with OpenID Connect, in this case "IdentityServer", next we define the default Sign In and Sign Out scheme which is set to the ChallengeScheme constant we created earlier. We next specify the response type, in this case the Identity Server client has been setup for AuthorizationCode flow (Identity Server has five different flows (more information on flows in the links at the end of this blog). The callback path is also set and for OpenID Connect should be set to "/signin-oidc". UsePkce is set to false in this case, but this depends on how your client has been setup (Pkce stands for Proof Key for Code Exchange standard and is detailed in the references section)</p>
<pre class="language-csharp"><code>.AddOpenIdConnect("IdentityServer", options =>
{
options.SignInScheme = ChallengeScheme;
options.SignOutScheme = ChallengeScheme;
options.ResponseType = OpenIdConnectResponseType.Code;
options.CallbackPath = "/signin-oidc";
options.UsePkce = false;
options.Authority = authority;
options.RequireHttpsMetadata = requireHttpsMetadata;
options.ClientId = clientId;
options.ClientSecret = clientSecret;
....
})</code></pre>
<p>The final part and indeed the most important part is to define the custom policy scheme that we referenced earlier. We call the "AddPolicyScheme" method for this, passing in the name of the new scheme. Next we need to define the paths that determine which authentication scheme should be used. If the path starts with "/episerver" or "/util" we know this is a user trying to login to the CMS and therefore we return the scheme that is used by Asp.Net Identity, in this case "Identity.Application", for all other paths we just return "IdentityServer" which in this case is the scheme used by OpenId Connect.</p>
<pre class="language-csharp"><code>.AddPolicyScheme("policy-scheme", null, options =>
{
options.ForwardDefaultSelector = ctx =>
{
if (ctx.Request.Path.StartsWithSegments("/episerver", StringComparison.OrdinalIgnoreCase) ||
ctx.Request.Path.StartsWithSegments("/util", StringComparison.OrdinalIgnoreCase))
{
return IdentityConstants.ApplicationScheme; // IdentityConstants.ApplicationScheme = "Identity.Application"
}
return "IdentityServer";
};
});</code></pre>
<p>The full code of the UserAuthentication class is provided below:</p>
<pre class="language-csharp"><code>using System.Text;
using EPiServer.Cms.UI.AspNetIdentity;
using Microsoft.AspNetCore.Authentication.Cookies;
using Microsoft.AspNetCore.Authentication.OpenIdConnect;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Identity;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.IdentityModel.Protocols.OpenIdConnect;
public static class UserAuthenticationServiceExtensions
{
private const string AuthenticationScheme = CookieAuthenticationDefaults.AuthenticationScheme; // CookieAuthenticationDefaults.AuthenticationScheme =
"Cookies"
private const string ChallengeScheme = OpenIdConnectDefaults.AuthenticationScheme; // OpenIdConnectDefaults.AuthenticationScheme = "OpenIdConnect"
/// <summary>
/// Sets up authentication based on one of the following schemes:
/// Optimizely CMS Identities for the CMS login using AspNet Identity.
/// Identity Server using Open ID connect for front-end user login.
/// </summary>
/// <param name="services"></param>
/// <param name="environment"></param>
/// <param name="configuration"></param>
/// <returns></returns>
public static IServiceCollection AddUserAuthentication(
this IServiceCollection services,
IWebHostEnvironment environment,
IConfiguration configuration)
{
services.AddCmsAspNetIdentity<ApplicationUser>();
services.AddIdentityServer(configuration);
return services;
}
/// <summary>
/// Sets up authentication based on Identity Server 4 using Open ID Connect
/// </summary>
/// <param name="services"></param>
/// <param name="configuration"></param>
/// <returns></returns>
public static void AddIdentityServer(this IServiceCollection services, IConfiguration configuration)
{
var identityServerSettings = configuration.GetSection(nameof(IdentityServerSettings)).Get<IdentityServerSettings>();
var authority = identityServerSettings?.Authority ?? string.Empty;
_ = bool.TryParse(identityServerSettings?.RequireHttpsMetadata ?? "true", out bool requireHttpsMetadata);
var clientId = identityServerSettings?.ClientId ?? string.Empty;
var clientSecret = identityServerSettings?.ClientSecret ?? string.Empty;
services.AddAuthentication(options =>
{
options.DefaultScheme = AuthenticationScheme;
options.DefaultChallengeScheme = "policy-scheme";
})
.AddCookie(AuthenticationScheme, options =>
{
// Defines a path to redirect the user to if they don't have access to a page.
// This page should return a 200 response so as to not cause authentication loops.
options.AccessDeniedPath = new PathString("/no-access");
})
.AddCookie(ChallengeScheme)
.AddOpenIdConnect("IdentityServer", options =>
{
options.SignInScheme = ChallengeScheme;
options.SignOutScheme = ChallengeScheme;
options.ResponseType = OpenIdConnectResponseType.Code;
options.CallbackPath = "/signin-oidc";
options.UsePkce = false;
options.Authority = authority;
options.RequireHttpsMetadata = requireHttpsMetadata;
options.ClientId = clientId;
options.ClientSecret = clientSecret;
options.Scope.Clear();
options.Scope.Add(OpenIdConnectScope.OpenId);
options.Scope.Add("xxx");
options.MapInboundClaims = false;
options.Events.OnRedirectToIdentityProvider = context =>
{
// Prevent redirect loop
if (context.Response.StatusCode == 401)
{
context.HandleResponse();
}
if (context.ProtocolMessage.RequestType == OpenIdConnectRequestType.Logout)
{
var idTokenHint = context.HttpContext.User.FindFirst("id_token");
if (idTokenHint != null)
{
context.ProtocolMessage.IdTokenHint = idTokenHint.Value;
}
}
return Task.CompletedTask;
};
options.Events.OnAuthenticationFailed = async context =>
{
context.HandleResponse();
await context.Response.BodyWriter.WriteAsync(Encoding.ASCII.GetBytes(context.Exception.Message));
};
})
.AddPolicyScheme("policy-scheme", null, options =>
{
options.ForwardDefaultSelector = ctx =>
{
if (ctx.Request.Path.StartsWithSegments("/episerver", StringComparison.OrdinalIgnoreCase) ||
ctx.Request.Path.StartsWithSegments("/util", StringComparison.OrdinalIgnoreCase))
{
return IdentityConstants.ApplicationScheme; // IdentityConstants.ApplicationScheme = "Identity.Application"
}
return "IdentityServer";
};
});
}
}</code></pre>
<p>The next step is to add the new configuration section to our appsettings.json file, in this case we have:</p>
<ul>
<li>Authority - this is the Identity Server 4 URI</li>
<li>Client Id - this is the id of the client that has been setup within Identity Server 4</li>
<li>Client Secret - this is the secret of the client that has been setup within Identity Server 4</li>
<li>RequireHttpsMetadata - this determines if http or https should be required, generally this should be set to true</li>
</ul>
<pre class="language-javascript"><code> "IdentityServerSettings": {
"Authority": "https://xxx.xx.com/identity",
"ClientId": "xxx",
"ClientSecret": "xxx",
"RequireHttpsMetadata": true
}</code></pre>
<p>Next we need to register the new user authentication middleware in the ConfigureServices method of the Startup.cs file:</p>
<pre class="language-csharp"><code>services.AddUserAuthentication(_webHostingEnvironment, _configuration)</code></pre>
<p>The following also needs adding in the Configure method of the Startup.cs file:</p>
<pre class="language-csharp"><code>app.UseAuthentication();
app.UseAuthorization();</code></pre>
<p>Now we need to implement the authentication controller, registering the Login and Logout routes that the user's of the website are to be redirected to.</p>
<p>For the login method, we need to decorate it with an Authorize attribute, this needs to return a ChallengeResult that is an ActionResult that on execution invokes HttpContext.ChallengeAsync for the challenge scheme(s) passed in which in this case is a single scheme called "IdentityServer".</p>
<p>In terms of the logout method, we need to ensure we call the SignOutAsync method of the current HttpContext passing in the Authentication Scheme we want to logout, in this case the "OpenIdConnect" scheme. We then redirect back to the website homepage.</p>
<pre class="language-csharp"><code>using System.Globalization;
using Microsoft.AspNetCore.Authentication;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Authentication.OpenIdConnect;
using Microsoft.AspNetCore.Mvc;
public sealed class AuthenticationController
{
[Authorize(AuthenticationSchemes = "IdentityServer")]
[HttpGet]
[Route("/login")]
public IActionResult? Login()
{
return new ChallengeResult("IdentityServer", new AuthenticationProperties { RedirectUri = "/" });
}
[HttpGet]
[Route("/logout")]
public IActionResult? Logout()
{
HttpContext.SignOutAsync(OpenIdConnectDefaults.AuthenticationScheme); // OpenIdConnectDefaults.AuthenticationScheme = "OpenIdConnect"
return Redirect("/");
}
}</code></pre>
<p>Finally (and this is one part that confused me for a while) is providing the ability for both anonymous and logged in user's access to a page, to do this we needed to add the same Authorize attribute as for the login method but also add the "AllowAnonymous" attribute. For pages that we don't want non-logged in users to access, we can simply omit this attribute.</p>
<pre class="language-csharp"><code>[Authorize(AuthenticationSchemes = "IdentityServer")]
[AllowAnonymous]</code></pre>
<p>I hope this blog post provides an insight into how implementing login for multiple authentication schemes can be achieved, I know in this case it is heavily leaning towards Identity Server 4 but changing the provider to something like Azure AD should be relatively simple, both for the website user login and/or the CMS login.</p>
<h3>References<em><br /></em><em></em></h3>
<p><a href="https://identityserver4.readthedocs.io/en/latest/intro/terminology.html">https://identityserver4.readthedocs.io/en/latest/intro/terminology.html</a><br /><a href="https://identityserver4.readthedocs.io/en/latest/topics/clients.html">https://identityserver4.readthedocs.io/en/latest/topics/clients.html</a><br /><a href="https://docs.wso2.com/display/IS530/Authorization+Code+Grant">https://docs.wso2.com/display/IS530/Authorization+Code+Grant</a><br /><a href="https://docs.developers.optimizely.com/content-cloud/v12.0.0-content-cloud/docs/mixed-mode-authentication">https://docs.developers.optimizely.com/content-cloud/v12.0.0-content-cloud/docs/mixed-mode-authentication</a><br /><a href="https://docs.developers.optimizely.com/content-cloud/v12.0.0-content-cloud/docs/integrate-azure-ad-using-openid-connect">https://docs.developers.optimizely.com/content-cloud/v12.0.0-content-cloud/docs/integrate-azure-ad-using-openid-connect</a><br /><a href="https://gist.github.com/jawadatgithub/638c11f08ecc0d76b05c">https://gist.github.com/jawadatgithub/638c11f08ecc0d76b05c</a> <br /><a href="https://auth0.com/docs/get-started/authentication-and-authorization-flow/authorization-code-flow-with-proof-key-for-code-exchange-pkce">https://auth0.com/docs/get-started/authentication-and-authorization-flow/authorization-code-flow-with-proof-key-for-code-exchange-pkce</a> </p>
<div class="author__image col-sm-5"><img src="https://assets-eu-01.kc-usercontent.com/1e387446-ba57-010e-8dbf-944631f19d11/d003b6bf-e48d-43b5-ae36-ace9342bcecb/GrahamCarr_680x454.jpg?w=500&h=1000&auto=format" /></div>
<div class="author__content col-sm-7 keep-margin-bottom">
<h2>Graham Carr, Lead .NET Developer</h2>
<div class="rich-text aos-init aos-animate">
<p>I am an experienced Lead .Net Developer with over 25 years’ experience in a wide range of products and technologies. I have helped companies deliver their digital vision from concept all the way through to delivery. I have a particular passion for DXPs (Digital Experience Platforms) and am a certified developer for products such as Optimizely, Umbraco, Kontent.ai and more.</p>
</div>
</div>2023-03-01T09:00:00.0000000ZBlog postA day in the life of an Optimizely Developer - Opticon London 2022<p>Arriving at the train station in Leeds on Thursday, the evening before Opticon London 2022, excited for the journey ahead on what was promising to be a great day full of all things Optimizely, of course I should have expected to fall foul of the dreaded “train delays” - what should have been a 2hr 15min journey to King’s cross turned into a 4hr nightmare journey with many un-planned stops and bleary eyed and extremely tired children running up and down the aisles, thank god for my wireless ear buds!!</p>
<p><span>Eventually I arrived at King’s cross and after a 30 minute underground journey and a short walk I finally arrived at the hotel at 11pm. I wasted no time getting into bed and fell asleep with thoughts and images of the day to come. </span></p>
<p><span>The next morning arrived and after a short walk from the hotel I arrived at the location of Opticon London 2022 - Tobacco Dock. As a brief history, originally built in 1812 as a hub for precious cargo arriving from the New World, such as wine and, of course, tobacco, Tobacco Dock originally spanned 70 acres. Now occupying just two-fifths of the original site, the Grade 1 listed building still offers a generous 57 spaces over 16,000 sqm.</span></p>
<figure class="image"><img src="/link/1e9256cb061a4ecea9222ab431989977.aspx" />
<figcaption>Entrance to Opticon London 2022</figcaption>
</figure>
<p><span><br />Upon entering the building I was warmly greeted and directed to the registration where I electronically signed in and received my printed Optimizely badge for the day. After dropping my coat off at the cloakroom I entered the main room (or should I say hall) where the Optimizely and sponsor stands (</span><em>Microsoft, Google Cloud, Valtech and Siteimprove</em><span>) were situated, along with the music stage, plenty of nibbles, tea and coffee and even a sweetie cart with Optimizely branded bags!! (#thankyouopti) <br /><br /></span></p>
<figure class="image"><img src="/link/f1ae0bc2529c4b9c813e2fc1f29ff287.aspx" width="732" height="549" />
<figcaption>Main networking hall, music stage and stands</figcaption>
</figure>
<figure class="image"><img src="/link/56e4245a30a2439daaf514d150da1479.aspx" width="732" height="549" />
<figcaption><span>Optimizely branded sweetie bags </span></figcaption>
</figure>
<p><span><br />After looking at the sponsor stands I made my way over to the Optimizely stand where you had the chance to talk about anything Opti, I was particularly interested in the image they had on the stand display that provided a logical architecture of DXP and clearly showed how important components such as the </span><strong>Optimizely Data Platform (ODP)</strong><span>, </span><strong>Content Marketing</strong><span> and </span><strong>Feature Experimentation</strong><span> sat within the DXP architecture. From the agenda it looked as though these were the areas that were being given greatest focus across the day.<br /><br /></span></p>
<figure class="image"><img src="/link/ee9232edb94847fab65db4ab430f1c00.aspx" width="735" height="551" />
<figcaption><span>Optimizely Stand - DXP Logical Architecture Diagram </span></figcaption>
</figure>
<p><span><br />After a bit of networking I made my way to the room where the Keynote speech was delivered by </span><em>Alex Atzberger (CEO, Optimizely)</em><span>. He gave a very interesting speech with the headline of “<strong>The future is boundless</strong>”, this covered how the digital landscape is currently emerging and how Optimizely and it's various current and more importantly upcoming components such as Feature Experimentation and Content Marketing can deliver Boundless Digital Invention to help marketers with the challenges they currently face working across disparate tools and systems, collaborating with an ever growing number of teams such as engineering, product, etc and receiving ever decreasing budgets whilst at the same time customer expectations are forever increasing. Boundless Digital Invention is driven by three core principles:</span></p>
<p><strong>Orchestrate</strong><span><strong> </strong>- A single platform that has all of the tools to help manage the entire content lifecycle<br /></span><strong>Monetize</strong><span> - Modern and relevant commerce experiences can help drive the experiences that customers expect as well as increasing revenue and growth, this is all made possible by the B2C and B2B Commerce platforms<br /></span><strong>Experiment</strong><span><strong> </strong>- Using the tools available within Feature Experimentation such as A/B testing, Personalisation, etc. marketers are able to provide experiences that are optimized and can drive business growth.</span></p>
<p><em>Marcella Pasqualucci (Head of Experimentation, Sky)</em><span> was then welcomed onto the stage where he discussed how the Web Experimentation features within Optimizely allowed Sky to experiment at a fast pace allowing them to learn from experimentation tests quickly and adapt to what a consumer is looking for in an ever changing digital world, the experimentation evolved from simple web experiments (button colors), to more advanced server-side and mobile experiments.. This has helped drive customer satisfaction whilst at the same time increasing product adoption by consumers.<br /><br /></span></p>
<figure class="image"><img src="/link/e5c84b08ba594ccdafcaf7ce0699d214.aspx" width="733" height="550" />
<figcaption><span>Alex Atzberger & Marcella Pasqualucci discuss experimentation at Sky</span></figcaption>
</figure>
<p><span><br />We then moved onto a presentation titled “</span><strong>Driving digital forward: The Road to revolutionary experiences</strong><span>”. This was presented by </span><em>Justin Anovick (CPO, Optimizely)</em><span> and he was joined on stage by </span><span><em>Nazanin Ramezani (Chief of Staff, Optimizely)</em> and <em>Jacob Khan (GVP, Solution Architect, Optimizely)</em></span><span> all sporting groovy jackets covered in Optimizely client logos, Naz and Jacob’s were particularly noteworthy in their bright orange and green colour!"</span></p>
<p>The presentation covered the struggles that a current marketer (role-played by Naz) face when creating new content, making changes to existing content, trying to gather insights on customer experiences, etc. and Naz acted as the role of that marketer. We then saw how a marketer (role-played by Jacob) who has access to Optimizely Content Marketing, Feature Experimentation and Data Platform could quickly and efficiently create content, get changes made and approved, as well as being able to gather data and insights on everything customers were doing, and acting on these insights by incorporating personalisation and experimentation.<br /><br /></p>
<figure class="image"><img src="/link/d9ad5b98636e4168b4e6393dc9ab16ec.aspx" width="743" height="557" />
<figcaption><span>Justin Anovick presenting on stage</span><span> </span></figcaption>
</figure>
<p><span><br />The final presentation of the keynote session was titled “</span><strong>Reinventing how marketing works: A radically new way of creating digital experiences</strong><span>” and was presented by </span><span><em>Kirsten Allegri-Williams (CMO, Optimizely)</em> </span><span>she was joined on stage by </span><em>Veronica Saha (Head of Analytics, Zoopla). </em>This session discussed how Optimizely can help provide a new ways of creating digital experiences, allowing inclusive collaboration with unified calendar views and digital asset management, confident content creation via iterative experiments, clear insights and embedded AI and finally customer foresight where access to insightful data alllows customer understanding as well as delivering exclusive experiences, product recommendations, to name but a few.</p>
<p>A short coffee break came next where I had chance to do a bit more networking as well as saying hello to some of the clients of the company that I work for (<a href="https://www.twentysixdigital.com">#twentysix</a>)<span> - I always find being courteous and chatting with existing clients is as important as speaking with new people who might become possible future contacts to learn from or gain leads from. </span></p>
<p><span>Next up was the sponsor breakout sessions, these were all held in separate rooms spread across the floor where Opticon was being hosted and you chose to attend the session that interested you the most. I opted for the session titled “</span><strong>Unlock new possibilities by taking your Optimizely Digital Experience Platform to the next level</strong><span>”, this was presented by </span><span><em>Michelle Azzopardi (Digital & App innovation GTMM UK Microsoft)</em>. </span><span>This session was the most technical session of the day covering Azure, .Net and the Optimizely DXP Cloud Service.<br /><br /></span></p>
<figure class="image"><img src="/link/5da74e31987e42c5ae2b4e136d732d86.aspx" width="737" height="553" />
<figcaption><span>Microsoft discuss the Optimizely Azure cloud architecture and use of .Net 6/7 </span></figcaption>
</figure>
<p><br />The first area that was covered was on how customisable Optimizely is, more specifically:</p>
<ul>
<li><strong>800+ digital agencies</strong><span> use Optimizely as there preferred DXP </span></li>
<li><strong>40k developers</strong><span> are using Optimizely </span></li>
<li><strong>87 OMVPs</strong><span> current exist across the world </span></li>
<li><strong>300+ add-ons</strong><span> are currently available </span></li>
<li><strong>Infinite possibilities</strong><span> exist with the use of Optimizely </span></li>
</ul>
<p><span>The session then went on to cover the what Microsoft are currently doing in terms of reducing carbon emissions, paying an increasing amount of carbon tax, reducing energy consumption within data centers, reducing water usage, accelerating carbon reduction, etc. This leads to four commitments which are: </span></p>
<ul>
<li><strong>Carbon Negative</strong><span> by 2030 </span></li>
<li><strong>Zero Waste</strong><span> by 2030 </span></li>
<li><strong>Water Positive</strong><span> by 2030 </span></li>
<li><span>Build the </span><strong>Planetary Computer</strong><span> </span></li>
</ul>
<p><span>The session then moved onto how Optimizely are using Microsoft Azure for their DXP Cloud Services. It discussed how the services in use are helping to protect </span><strong>29K</strong><span> sites and projects in 120 countries and how </span><strong>7B+</strong><span> attacks were blocked last year alone.</span></p>
<p>The talk then moved onto the momentum that is occuring within .Net and we were told:</p>
<ul>
<li><strong>5.4M .Net Developers</strong><span> current exist in the Visual Studio Family</span></li>
<li><strong>#1 Most Loved Framework</strong><span> (2019, 20, 21) .Net Core/.Net 5 </span></li>
<li><strong>>6.9K Community Contributors</strong><span> to .Net 6 </span></li>
<li><strong>>21K Community Contributions</strong><span> to .Net 6 </span></li>
</ul>
<p>CMS12 was the next thing to be discussed, including some of the new features of CMS12 that have been released and some others that are currently in development. It was also worth noting that the DXP packages now support the very recently released .NET 7.</p>
<h3>New features on CMS 12</h3>
<table>
<tbody>
<tr>
<td><strong>Released</strong></td>
<td><strong>In Development</strong></td>
</tr>
<tr>
<td>Welcome DAM Integration</td>
<td>Tag helpers</td>
</tr>
<tr>
<td>Welcome Structured Content integration (Private Beta)</td>
<td>List property support</td>
</tr>
<tr>
<td>Headless editing</td>
<td>OptiID</td>
</tr>
<tr>
<td>Optimizely Data Platform integration</td>
<td>TinyMCE6 upgrade</td>
</tr>
<tr>
<td>Liquid templates support (Labs)</td>
<td>Out-of-the-box dashboard</td>
</tr>
<tr>
<td>Advanced admin functionalities</td>
<td></td>
</tr>
<tr>
<td>Improved accessibility</td>
<td></td>
</tr>
</tbody>
</table>
<p><span><br />The self-service migration tool was then covered, this is a tool that is now available within Paasportal (</span><span><a href="https://paasportal.episerver.net/">https://paasportal.episerver.net/</a>). Upgrading to CMS12 requires changes to the underlying Azure infrastructure, and as customers have no direct control over the service infrastructure then this tool was created so that a customer can confidently migrate to CMS12 and Commerce 14 with no assistance from Optimizely. The tool provides parallel project support to allow independently finalizing the migration process without disrupting current environments, content can be copied on-demand from a source CMS11/Commerce 13 project and once you are happy when you are able to easily switch over hostnames to the new project whilst ensuring data consistency.</span><span> </span></p>
<p><span>Next on the agenda was the first set of the Optimizely breakout sessions. I decided to join the session titled “</span><strong>Get more from your digital experience platform with Optimizely Data Platform</strong><span>” and was presented by </span><span><em>Nazanin Ramezani (Chief of Staff, Optimizely)</em> and <em>Jacob Khan (GVP, Solution Architect, Optimizely)</em> </span><span>with Naz having decided to drop the groovy green Optimizely jacket for a more fashionable black one</span></p>
<p>The session started off by discussing how there is more customer data than ever in the current digital landscape due to the many different touchpoints that exist across channels and devices. They also went on to discuss how new privacy laws and an ever expanding customer expectation for personalisation meant that both insightful, relevant and up-to date data are more important than ever.<br /><br /></p>
<figure class="image"><img src="/link/8566abe1d0a546f0a862edc094634c19.aspx" width="702" height="527" />
<figcaption><span>Naz and Jacob discuss Optimizely Data Platform capabilities</span></figcaption>
</figure>
<p><br />This then led us on to a discussion on how the Optimizely Data Platform helps to make complex data simple for marketers, as it acts as a centralised hub to turn customer data into data science profiles ready. This is seen across two different personas, namely developers and marketers:</p>
<table>
<tbody>
<tr>
<td><strong>Developer</strong></td>
<td><strong>Marketer</strong></td>
</tr>
<tr>
<td>Easy to use APIs for custom integration scenarios</td>
<td>Start immediately with unified profiles and predictive analytics</td>
</tr>
<tr>
<td>GraphQL providing complete and understandable description of the data in the API</td>
<td>Act on real-time segments within any of experimentation, CMS or Commerce</td>
</tr>
<tr>
<td>Real time segments to instantly act on any data collected</td>
<td>Unlock more value from experimentation by adding the customer context</td>
</tr>
</tbody>
</table>
<p><span><br />They finally went on to discuss how the Optimizely Data Platform will be joined in January 2023 by the Optimizely Connector Platform that will enable both out-of-the-box and custom integrations with many third-parties. </span></p>
<p>After what was an excellent morning of sessions where a good insight and learnings into some of the main components of the DXP architecture were made it was time for lunch. Once again this took place in the main hall and gave plenty of time for further networking as well as feasting on the amazing lunch that was provided.</p>
<p><span>After being fully topped up on Latte’s from the barista stand, I felt invigorated for the afternoons sessions. Next up was the second set of Optimizely breakout sessions where I opted to attend the session titled “</span><strong>Scale your experimentation program with Feature Experimentation</strong><span>” which was presented by <em>Joey Moore </em></span><em>(Associate Vice President, Product, Optimizely)</em><span> and who was joined on stage by guest speaker </span><span><em>Stewart Ehoff (Head of Experimentation, RS Components)</em> </span><span>and consisted of a deep dive into feature experimentation by taking a look into the future of experimentation and feature management.<br /><br /></span></p>
<figure class="image"><img src="/link/9461fe569d274ab5b4b47d4772da0a85.aspx" width="689" height="517" />
<figcaption><span>Joey Moore - Feature Experimentation Deep Dive</span><span> </span></figcaption>
</figure>
<p><br />The concept of feature experimentation was split into separate areas and included the Delivery Platform, Optimisation Layer and Data Layer.</p>
<ul>
<li><strong>The Delivery Platform</strong> covered the tools in place to provide things such as environments, rules engine, flexible architecture, webhooks, rollouts, API first and many more.</li>
<li><strong>The Optimisation Layer </strong>covered the tools available such as concurrent A/B tests, Personlisation, Metrics, Data Integrations, Audiences and many more</li>
<li>The final layer related to <strong>Optmizely Data Platform</strong> and the upcoming <strong>Optimizely Connect Platform</strong>.<br /><br /></li>
</ul>
<figure class="image"><img src="/link/c1b1cb9baac4493bb7be9d2f7b16a7d5.aspx" width="692" height="519" />
<figcaption><span>Joey joined on stage by Stewart Ehoff </span></figcaption>
</figure>
<p><span><br />Joey then started interviewing Stewart on the stage asking him how experimentation has evolved at RS Components. When asked how a company can get into experimentation, Stewart made a good point that the most important thing is actually doing an experimentation, no matter how small or trivial, a lot of the time with experimentation, you might have a few wins but 70% of the time will be fails, but these aren't truly fails and a lot can be learnt from them to help direct the approach taken on the next set of experiments that are performed. Joey finished by talking about the big ideas that Optimizely have concerning data capabilities and a collaboration with Google Cloud Platform to allow improved data sharing, data import capabilities, advanced metrics and data science capabilities.</span></p>
<p><span>After this session it was onto the final set of Optimizely breakout sessions and this time I opted for the session titled “</span><strong>Building a powerhouse commerce engine</strong><span>” which was presented by </span><span>J<em>osh Schoonmaker (Global VP of Product, Optimizely)<br /><br /></em></span></p>
<figure class="image"><img src="/link/954329b40feb4c658b329ac5051107a3.aspx" width="695" height="521" />
<figcaption><span>Josh Schoonmaker presenting on stage </span></figcaption>
</figure>
<p><span><br />Josh gave an insightful presentation talking about competitive pressure and how 90% of surveyed leaders say they are investing in additional capabilities to drive digital growth. He talked about how Commerce currently exists today, from a social media perspective through to personalisation and loyalty. Concerning personalisation in Commerce:</span></p>
<ul>
<li><span>70% of consumers would willingly share data for a more personalised experience</span></li>
<li><span>72% only engage with personalised messaging</span></li>
<li><span>71% of consumers expect personalised interactions</span></li>
<li><span>76% of consumers get frustrated when this doesn't happen </span></li>
</ul>
<p><span>Another set of interesting points he made were concerning Gen Z preferences in that 37% value personalisation over all else and 52% value personalisation so highly that they are willing to share more information with brands if it means a more personalised shopping experience.</span></p>
<p><span>At the end of this presentation, there was a short break before we all congregated back in the main keynote room for the prestigious customer and partner awards.</span><span> </span><span>The awards along with winners were presented in the following order:</span></p>
<h3>Customer Awards</h3>
<p><strong>Most Innovative Digital Experience</strong><span><strong> </strong>- EPG Health <br /></span><strong>Best Experimentation Practice</strong><span><strong> </strong>- Channel 4</span><span> <br /></span><strong>Most Customer-Centric Experience</strong><span><strong> </strong>- Mazda Motor Europe</span><span> <br /></span><strong>Best Buying Experience</strong><span> - Farrow & Ball in partnership with Kin+Carta </span></p>
<h3>Partner Awards</h3>
<p><strong>Experimentation Partner of the Year</strong><span> - Kin+Carta <br /></span><strong>Digital Experience Solution Partner of the Year</strong><span> - Unrivald <br /></span><strong>Rising Star Solution Partner of the Year</strong><span> - Mando <br /></span><strong>Customers' Choice Partner of the Year</strong><span> - Netcel </span></p>
<p><span>The final award was the prestigious <strong>2022 Solution Partner of the Year</strong> and both myself and my fellow twentysix colleagues were extremely happy to be named as the winners of this award. This award is honors the winner as </span><span>a top-performing partner that has demonstrated outstanding business performance and excellence in both sales and delivery of Optimizely solutions. (</span><em><strong>twentysix </strong>part of the <strong>MSQ Group</strong></em><span> - <a href="https://www.twentysixdigital.com">https://www.twentysixdigital.com</a>)<br /><br /></span></p>
<figure class="image"><img src="/link/e146a721268d4a1db0bb69eabe94a99f.aspx" width="706" height="942" />
<figcaption><span>2022 Solution Partner of the Year trophy </span></figcaption>
</figure>
<figure class="image"><img src="/link/b252d9066ec04190abbc5be60dd9672e.aspx" width="708" height="944" />
<figcaption><span>Myself and my fellow colleagues proudly sporting our trophy </span></figcaption>
</figure>
<figure class="image"><img src="/link/720d7f32e66948679b566392b2743c9c.aspx" width="707" height="530" />
<figcaption><span>Winners of the 2022 Optimizely Partner Awards</span></figcaption>
</figure>
<p><span><br />After the awards were the closing remarks presented by </span><span>Alex Atzberger </span><span>where he gave an overview of the day and also discussed what we could look forward to in 2023. </span>The after party then commenced where drinks were available along with canapés and you were left free to network all the while listening to the excellent live music being played in tandem with a very talented saxophone player.</p>
<figure class="image"><img src="/link/779853c62ed149549cbc4b1559e3ebec.aspx?1668106979604" width="647" height="485" style="width: 707px; height: 530px;" />
<figcaption><span>After party with live music</span></figcaption>
</figure>
<p><br />After an hour or two it was time to head back to King’s Cross for the journey back to Leeds where I had plenty of time to absorb what had been covered in the day along with getting notes down whilst still fresh in my memory which would allow me to write this blog post.</p>
<h2>Final Thoughts</h2>
<p><span>So after attending the event and absorbing the information that was provided across the day, firstly I would highly recommend attending this event in 2023 regardless of whether you attend the main Opticon event as it gives you a different angle to look from and also provides you with great networking with like-minded UK customers and technology experts. </span></p>
<p>My main takeaways from the event were that Optimizely are pushing "<strong>Boundless Digital Invention</strong>" which is delivered by Optimizely DXP but heavily focussed in three additional areas. The first is <strong>Optimizely Data Platform (ODP)</strong> and how it is able to store big data whilst providing an easy way of querying the data via GraphQL as well as enabling an ever growing library of integrations via the <strong>Optimizely Connect Platform</strong> coming in January 2023.</p>
<p>The second area of focus was <strong>Optimizely Content Marketing</strong> formerly Welcome where the day showcased the features and what can be achieved from this platform and how it will help provide excellent marketing capabilities.</p>
<p>The final area of focus was on <strong>Optimizely Feature Experimentation</strong> formerly referred to as Full Stack and covered a lot of how the experimentation features can enable fast experimentation, allowing ideas to be tried out quickly therefore keeping up with the ever demanding consumer.</p>
<p>As 70-80% of the people attending the event were customers who were either thinking of using Optimizely or are already using Optimizely then it makes sense for the focus on how Optimizely products can help customer drive their digital landscape through Boundless Digital Invention.</p>
<h3>References</h3>
<p>Boundless Digital Invention - <a href="https://www.optimizely.com/unlimit-yourself/"><span>https://www.optimizely.com/unlimit-yourself/</span></a> <br />Optimizely Data Platform (ODP) - <a href="https://www.optimizely.com/products/intelligence/data-platform/"><span>https://www.optimizely.com/products/intelligence/data-platform/</span></a> <br />Optimizely Content Marketing - <a href="https://www.optimizely.com/products/content-marketing/">https://www.optimizely.com/products/content-marketing/</a> <br />Optimizely Feature Experimentation - <a href="https://www.optimizely.com/products/intelligence/full-stack-experimentation/">https://www.optimizely.com/products/intelligence/full-stack-experimentation/</a> <br />CMS12 Self-Service Migration - <a href="https://docs.developers.optimizely.com/digital-experience-platform/v1.3.0-DXP-for-CMS11-COM13/docs/migration-to-cms-12-commerce-14">https://docs.developers.optimizely.com/digital-experience-platform/v1.3.0-DXP-for-CMS11-COM13/docs/migration-to-cms-12-commerce-14</a> <br />DXP Cloud Architecture - <a href="https://docs.developers.optimizely.com/content-cloud/v12.0.0-content-cloud/docs/architecture">https://docs.developers.optimizely.com/content-cloud/v12.0.0-content-cloud/docs/architecture</a> <br />Zoopla - <a href="https://www.optimizely.com/insights/zoopla-refines-personalization-strategy-to-enhance-the-homebuyers-experience/">https://www.optimizely.com/insights/zoopla-refines-personalization-strategy-to-enhance-the-homebuyers-experience/</a><br /><a href="https://www.optimizely.com/insights/zoopla-refines-personalization-strategy-to-enhance-the-homebuyers-experience/"></a>Microsoft Commitments to Sustainability - <a href="https://www.microsoft.com/en-us/corporate-responsibility/sustainability">https://www.microsoft.com/en-us/corporate-responsibility/sustainability</a> </p>
<div class="author__image col-sm-5"><img src="https://assets-eu-01.kc-usercontent.com/1e387446-ba57-010e-8dbf-944631f19d11/d003b6bf-e48d-43b5-ae36-ace9342bcecb/GrahamCarr_680x454.jpg?w=500&h=1000&auto=format" /></div>
<div class="author__content col-sm-7 keep-margin-bottom">
<h2>Graham Carr, Lead .NET Developer</h2>
<div class="rich-text aos-init aos-animate">
<p>I am an experienced Lead .Net Developer with over 25 years’ experience in a wide range of products and technologies. I have helped companies deliver their digital vision from concept all the way through to delivery. I have a particular passion for DXPs (Digital Experience Platforms) and am a certified developer for products such as Optimizely, Umbraco, Kontent.ai and more.</p>
</div>
</div>2022-11-10T19:53:20.0000000ZBlog post