Experiences
An Experience is a reusable piece of content shown to a user at a moment in their journey, such as a paywall, a registration wall, or a promotional banner. Where a Plan and its Features decide whether a user has access, an Experience decides what they see as a result of that decision.
Experience Slot
An experience slot is the connection point between a surface and an experience. Slots are added to a surface, then referenced from its workflow to control what content that workflow returns.
An experience slot can be linked to any compatible experience. When a surface decision runs, the surface workflow decides which experience slots to render.
Experience Slot Facet
Each experience slot is associated with a single facet, which determines what a slot returns when resolved:
- Web Content: Resolve an experience slot as a WebElement array. For use in components of Web Content surfaces.
- JSON: Resolve an experience slot as a JavaScript object.
- Text: Resolve an experience slot as a plain string containing its rendered content.
Experience resolution
Resolving an experience slot renders its linked experience into the format defined by the slot's facet. A surface workflow does this by calling a resolve function from the experiences argument, using the function matching the slot's facet: resolveAsWebContent, resolveAsJson, or resolveAsText. For example, to resolve an experience into web content:
const workflow: SurfaceWorkflow = async ({ experiences }) => {
const promoBanner = await experiences.resolveAsWebContent('promo-banner')
return {
properties: { promoBanner }
}
}Template variables
A surface workflow can optionally pass dynamic variables when resolving an experience. These variables can be referenced within the experience's content. Each experience type handles them differently.
Experience Types
An experience has a type, which determines the kind of content it holds. The following table shows which experience types support which facets:
| Type | Web Content | JSON | Text |
|---|---|---|---|
| HTML | ✅ | ✅ | |
| App | ✅ | ✅ |
HTML Type
An HTML experience is content rendered using standard HTML, CSS, and JavaScript. It uses the Mustache templating language to display dynamic content, such as variables and values from other MonetizationOS primitives.
Dynamic Variables
HTML experiences use Mustache to render the dynamic variables passed in by the surface workflow when resolving the experience.
A variable is rendered by referencing its key in a placeholder, for example {{ first_name }}.
Offers and Features
HTML experiences can reference offers and features configured in your organization.
A feature's properties, evaluated for the current user, are exposed under the mos-features Mustache section tag:
{{#mos-features.premium-articles.remaining-views}}
{{#hasAccess}}
<p>{{remainingUnits}} views remaining</p>
{{/hasAccess}}
{{/mos-features.premium-articles.remaining-views}}An offer slot is a placeholder configured on the experience that can hold one or more offers. When the experience resolves, each slot picks a single offer for the current user based on priority and filters. The picked offer is exposed under the mos-offer-slots-map Mustache section tag:
{{#mos-offer-slots-map.slot-0}}
<div class="offer">
<h3>{{name}}</h3>
<a href="/checkout?token={{mos-offer-token}}">Choose plan</a>
</div>
{{/mos-offer-slots-map.slot-0}}App Type
An App experience holds structured data, defined by a schema configured in your organization. The schema defines the fields available, and values are assigned to them through an auto-generated form. Rendering that data into a UI is handled by your organization's frontend library.
Dynamic Variables
App experiences also render their JSON content through Mustache, so dynamic variables sent by the surface workflow can be referenced by specifying the key in a placeholder, for example {{ first_name }}.
Experiences in observability
Every time an experience resolves, the resolution is recorded against the event it happened within, showing which experience was used, which surface and slot it resolved for, and which offers, if any, were presented in its offer slots.
Learn More
References
Workflow references
Surface Workflows
Resolve experience slots into HTML, text, or JSON as part of a surface's behavior.
Component Workflows
Resolve experience slots scoped to an individual component.
experiences
Resolve the experiences linked to a surface via experience slots.