Gesprek plannen
← Terug naar case studies
Adobe Summit 2026 · Las Vegas

Een Next.js 16-demo op AEM, Journey Optimizer en Real-Time CDP

Hoe ik de bouw leidde van de Adobe Summit-standdemo van een digitaal bureau: een hotelwebsite en een agentwerkplek voor het contactcenter in één Next.js-codebase, live gepersonaliseerd door Journey Optimizer op basis van wat een beller zegt.

Door Laurentiu NichiteanGepubliceerd Bijgewerkt

Mijn rol:
Lead Developer
Klant:
Standdemo van een digitaal bureau (fictief merk Lumière Hotels)
Kern-techstack:
Next.js 16, AEM GraphQL, Universal Editor, AJO, RT-CDP

De zakelijke uitdaging

Het bureau had voor zijn stand op Adobe Summit 2026 (Las Vegas, 20–22 april) een werkende demo nodig die AEM, Real-Time CDP en Journey Optimizer samen liet zien: een gast belt het contactcenter en enkele ogenblikken later verandert de hotelwebsite voor die gast.

Het team was parttime ingezet, de richting was vaag en de planning krap. De demo moest door marketeers te bewerken zijn in Universal Editor en mocht standbezoekers nooit een kapotte pagina tonen.

Wat ik heb gebouwd

Eén Next.js 16 App Router-codebase bedient beide ervaringen, in vier lagen:

  • Content uit AEM, bewerkt in Universal Editor: Server Components halen AEM-content op via GraphQL persisted queries: AEM Author met een IMS-token in draft mode, anders Publish met Next.js-cachetags, plus een on-demand revalidatie-endpoint voor publish-events.
  • Een proxy op netwerkniveau: verwerkt optionele Basic Auth, detecteert authoringsessies in Universal Editor en genereert tokens, zodat dezelfde app werkt voor auteurs en standbezoekers.
  • Van spraak naar gestructureerde intentie: in de agentwerkplek leveren spraaktranscriptie en een LLM gestructureerde JSON (intentie, sentiment, entiteiten), die naar Real-Time CDP wordt gestreamd zodat Journey Optimizer erop kan reageren.
  • Personalisatie die altijd rendert: beslissingen van Journey Optimizer worden client-side gerenderd achter een prehiding-snippet, met een fallbackketen (AJO Edge, dan AEM GraphQL, dan statische JSON) zodat de pagina altijd rendert.

Architectuur

Hoe een gesprek in de agentwerkplek gepersonaliseerde content op de website van Lumière Hotels wordt:

  • Next.js 16-app
  • Adobe Experience Cloud
  • AI-services
  • Robuustheid
Architectuur van de Adobe Summit 2026-demoEen agentwerkplek stuurt een getranscribeerd, door een LLM gestructureerd gesprek naar Real-Time CDP; Journey Optimizer bepaalt het aanbod; de hotelsite rendert het met AEM-content, met een fallbackketen.Next.js 16AgentwerkplekGesprek in contactcenterAISpraak + LLMIntentie, sentiment, entiteitenAdobeReal-Time CDPUniform gastprofielAdobeJourney OptimizerJourney- en aanbodbeslissingNext.js 16HotelwebsiteGepersonaliseerd voor de gastAdobeAEM + Universal EditorContent via GraphQLFallbackketenAJO Edge → AEM GraphQL → JSON12345
  1. 1De agentwerkplek transcribeert het gesprek; een LLM levert gestructureerde JSON: intentie, sentiment en entiteiten.
  2. 2De gestructureerde intentie wordt naar Real-Time CDP gestreamd en komt in het gastprofiel terecht.
  3. 3Het profiel kwalificeert voor een doelgroep en Journey Optimizer kiest de journey en het aanbod.
  4. 4De hotelsite ontvangt de beslissing via het Edge Network en rendert die achter een prehiding-snippet.
  5. 5Pagina-content komt uit AEM via GraphQL persisted queries: concepten van Author, gecachte pagina's van Publish.

Datamodel voor gasten

Het demomerk, Lumière Hotels, is fictief, dus de klantdata moest vanaf nul worden ontworpen. Ik werkte aan de onderdelen die een beller verbinden met een websitebezoeker:

  • XDM-schema's voor gasten: een schema voor het gastprofiel en de events voor verblijven en reserveringen.
  • Identity namespaces: ECID, e-mail en loyalty-ID, zodat één gast wordt herkend in het contactcenter en op de website.
  • Doelgroepen: gebouwd op het uniforme profiel, en bepalend voor welk Journey Optimizer-aanbod de site toont.
  • Touchpoints
  • Adobe Experience Platform
  • Datamodel
Gastdatamodel van Lumière HotelsWebsitebezoeken, contactcentergesprekken en loyalty-aanmeldingen dragen elk een identiteit; identity namespaces voegen ze samen tot één XDM-gastprofiel, en doelgroepen op dat profiel sturen Journey Optimizer-aanbiedingen.TouchpointWebsitebezoekWeb SDKTouchpointContactcentergesprekAgentwerkplekTouchpointLoyalty-aanmeldingLumière-lidAEPIdentity namespacesSamengevoegd tot één gast2ECIDEmailLoyalty IDXDMXDM-gastprofielLumière-schema's3GastprofielVerblijf- & reserveringseventsRT-CDPDoelgroepenSturen AJO-aanbod14
  1. 1Elk touchpoint draagt een identiteit: ECID op de website, e-mail of loyalty-ID in het gesprek en bij het aanmelden.
  2. 2Identity namespaces voegen die identiteiten samen tot één Lumière-gast.
  3. 3Het gastprofiel en de verblijfsevents zijn gemodelleerd met XDM-schema's.
  4. 4Doelgroepen op het uniforme profiel bepalen welk Journey Optimizer-aanbod de website toont.

Van cruciaal belang om de demo voor Summit af te ronden, en heeft een groot deel van de ontwikkeling aangestuurd.

Senior Director, Engineering
Adobe Summit 2026-demo

Hij was het centrale verbindingspunt van het project en integreerde meerdere platforms zoals AEM, Next.js, de callcenter-app, AEP, AJO en andere.

Manager, Digital Marketing
Adobe Summit 2026-demo

Laurentiu nam absoluut de leiding en was eigenaar van het Adobe Summit-project als geheel.

Senior Analytics Architect
Adobe Summit 2026-demo

Resultaten

  • Live getoond op Adobe Summit 2026: gedemonstreerd op de stand van het bureau in Las Vegas, 20–22 april 2026, waar ik de demo aan bezoekers presenteerde.
  • Eén codebase, twee ervaringen: de hotelsite en de agentwerkplek delen contentmodellen, authenticatie en deployment.
  • Te bewerken door marketeers: Universal Editor werkt op de live app, met concepten uit AEM Author en gecachete pagina's uit Publish.
  • Gedocumenteerd voor hergebruik: ik schreef de technische beschrijving en het runbook, zodat de demo opnieuw kan worden uitgevoerd en uitgebreid.