Pages

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Published by Scroll Versions from this space and version 10.2

This document provides a technical overview of the architecture and main key features of the Frosmo platform.

Table of Contents
maxLevel2

Frosmo platform at a glance

The Frosmo platform is a web UI development solution for improving website functionality and personalizing online user experience.

The Frosmo platform provides a fast and easy way to:

  • Customize and extend the content and functionality of a website, including adding completely new features
  • Segment visitors based on multiple criteria, such as where they are located or which pages they have visited
  • Display personalized content based on segmentation
  • Track conversions and conversion attribution
  • Measure visitor behavior and content use from multiple angles, such as how many times content is viewed or clicked

The following figure introduces the basic architecture and information flows of the Frosmo platform.

Image Removed

Figure: Frosmo platform architecture and information flows at a glance

In a nutshell:

  • The Frosmo JavaScript library handles the custom modifications to the website, manages segmentation, collects and sends usage data to the Frosmo back end, and fetches content to display from the Frosmo back end. By default, the library is stored on Amazon CloudFront, but Frosmo also supports other web services for hosting files.
  • The Frosmo back end stores the usage data collected by the Frosmo JavaScript library and processes the data for analysis and reporting purposes. The back end also stores data related to modifications, segments, and other configurable resources.
  • The Frosmo Control Panel manages the Frosmo JavaScript library and pools analysis and report data from the Frosmo back end.

The Frosmo platform is hosted on servers in Central Europe. However, Frosmo can also set up dedicated instances in specific market areas.

...

Platform. For a high-level introduction to the platform, see Introduction to the Frosmo Platform.

Table of Contents
maxLevel2

Frosmo Platform architecture

The following figure shows the main components and subcomponents of the Frosmo platform Platform architecture and the information flows between them.

Image RemovedFrosmo Platform architecture and information flowsImage Added

Figure: Frosmo platform Platform architecture and information flows in detail

For more information, see:

Table of Contents
maxLevel2
minLevel2
excludeSupported|Ad|Private

Frosmo JavaScript library

The Frosmo JavaScript library is the core component of the Frosmo platformFrosmo presence in the front end. The library runs on top of the a customer website site in the visitor's browser, integrating the site with the Frosmo Platform. The library provides both the framework for the platform to operate on the site and Frosmo's custom solutions for improving the site. The library is platform-independent and can be used together with existing web application frameworks, such as Angular and React.

The Frosmo JavaScript library consists of the following components, each contained in its own JavaScript filetwo script files:

  • The The Frosmo Core library implements implements the core front-end functionality and services of the Frosmo JavaScript solutionplatform. The library manages modifications and segmentation, collects usage data and sends it to the Frosmo back end, and fetches modification content to display from the Frosmo back end. The  The library is the same for all customers and sites.
  • The The Frosmo custom script contains contains the configurations for customer-and code specific modifications to the website. The script also contains the segmentation rules and all other custom code for a single site. These are used to modify the content and functionality of the site. The configurations include, for example, modifications whose content is preloaded, placements, segments, and triggers. The custom script runs on top of the Frosmo Core library and is and is unique to each site (or group of sites managed as a single site). Changes made to a site in the Frosmo Control Panel are automatically reflected in the custom script for that site.

The browser loads the Frosmo JavaScript library is loaded in the browser through two script <script> elements placed directly in a web page's HTML source code, one for the . The first element loads Frosmo Core library and another for the Frosmo custom script. Apart from adding these two elements, no other changes to the web page are required to use the Frosmo platformand the second one loads the custom script for the site. The scripts are separated so that modifications can be pushed faster to your site without having to load the entire library every time. For more information about adding the scripts to a site, see Adding the Frosmo scripts to your site.

The Frosmo JavaScript library is optimized for fast loading. The Frosmo Core library is only 50 about 54 KB in size, while the Frosmo custom script usually ranges between 16-32 KB. For more information about the Frosmo Platform and site performance, see Measuring and improving website performance.

Tip

The Frosmo JavaScript library is often referred to simply as the "Frosmo scripts". The Frosmo Core library typically goes by "Frosmo Core".

Script hosting and delivery

The Frosmo Platform uses content delivery networks (CDNs) to deliver the Frosmo JavaScript library and any Frosmo-specific media files used on websites. A CDN is a network of global servers connected to each other and used to store and deliver web content, such as images, videos, style sheets, and JavaScript files. When a visitor browses a site, the content of the site is delivered by the CDN server geographically closest to the visitor, decreasing page load times.

By default, the Frosmo JavaScript library files are delivered through Amazon CloudFront, which serves the files using the CloudFront servers closest to the visitor. Frosmo can also use other services CDNs based on customer requirements.

...

The Frosmo

...

Platform uploads the custom script and associated media files (ones added directly to modifications) to the CDN every time they need to be updated, that is, every time something on the site is changed using the Control Panel. The files are always exported to CloudFront and, when needed, copied from CloudFront to other CDNs.

Frosmo data layer

Customers can use the Frosmo data layer to implement basic data tracking by themselves, rather than have Frosmo do it in the custom script.

The Frosmo data layer can be used allows you to pass information data from a web page to the Frosmo JavaScript library. The library then sends the information that data to the Frosmo back end, where the data is stored in a database. The library can also use the information data directly in the browser to, for example, display content or manage segmentation.  You The exact behavior depends on how the Frosmo Platform is configured for the site.

You can pass information data about the following events and items through the data layer:

...

For more information about data tracking and the data layer, see Data tracking overview and Frosmo data layer.

Optimizer API

The Optimizer API takes the data collected by the Frosmo JavaScript library and stores it in the Frosmo back end. The data is stored using a dedicated process, which ensures that no data is lost even if the website or the messaging component of the Frosmo JavaScript library becomes unavailable.

...

Frosmo Control Panel

The Control Panel is the main user interface of the Frosmo Platform. You use the Control Panel to customize your websites and monitor their performance.

The Control Panel manages the Frosmo JavaScript library. Changes made to a site in the Control Panel are automatically reflected in the custom script for that site.

The Control Panel uses the Graniitti API to access the Frosmo back end and to deploy custom scripts to the CDN.

For more information about the Control Panel, see Introduction to the Frosmo Control Panel and our user guides.

Graniitti API

The Graniitti API provides secure access to the data in the Frosmo back end. The API allows client applications to, for example, retrieve and create modifications, and retrieve usage data collected by the Frosmo Platform.

Customers can use the API to, for example:

  • Provide data to custom dashboards and management UIs.
  • Provide an outside access point to usage data that is collected and stored by the Frosmo Platform.

The API uses token-based authentication for all requests.

For more information, see Graniitti API.

Message API

The Message API retrieves modification content to be displayed to visitors from the Frosmo back end. The , so that the content can be displayed in the browser. The Message API uses segmentation data and previous usage data to dynamically select suitable content for the visitor.

The Message API also tracks what content is shown to whom and how many times.

Custom APIs

A custom API is a customer-specific API created for a specific purpose that cannot be realized using the other APIs or the Frosmo JavaScript library. Frosmo creates custom APIs as needed.

Custom APIs are typically used to:

  • Return specialized data to the browser, such as data stored in a customer's back-end system or data read from a feed.
  • Send data to another service, such as email addresses to a mailing list for marketing automation purposes.

Graniitti API

The Graniitti API provides access to the data in the Frosmo back end. The API allows client applications to, for example, retrieve and create modification configurations, and retrieve usage data collected by the Frosmo JavaScript library.

The Graniitti API is currently only used by the Control Panel. However, in the future, the API will be made public. Customers can then use the API to, for example:

  • Provide data to custom dashboards and management UIs.
  • Provide an outside access point to usage data that is collected and stored by the Frosmo platform.

Frosmo Control Panel

The Control Panel is the Frosmo UI for website management and data analysis. Each customer has access to a dedicated Control Panel for their site(s).

The Control Panel provides the following core features:

  • Create and manage modifications.
  • Define visitor segmentation.
  • Manage audience activation campaigns for ad serving.
  • View analytics data for conversions, modifications, segmentation, and other components. Daily summary reports are updated at night as they require more time to process. Other data is usually available within a few minutes.

The Control Panel is responsible for managing the Frosmo JavaScript library and uploading the library to the file hosting service.

The Control Panel uses the Graniitti API to access the Frosmo back end.

Modifications

...

Optimizer API

The Optimizer API receives and stores usage data from websites. In other words, the Frosmo JavaScript library collects usage data in the visitor's browser and sends the data to the back end by calling the Optimizer API. In the back end, the Optimizer API stores the data for further processing.

To secure the data during transit between the site and the Frosmo back end, the Frosmo JavaScript library communicates with the Optimizer API over an HTTPS connection.

Recommendations API

The Recommendations API retrieves recommendation data from the Frosmo back end. This data is generated by the Frosmo Recommendations subsystem and describes one or more recommended items, such as products.

Frosmo Recommendations generates recommendations based on usage data collected from a site and using an algorithm or filter that produces relevant results from that data. The generation process is driven by recommendation configurations, which define from what usage data the recommendations are generated, how exactly the recommendations are generated, and how frequently the platform should regenerate the recommendations. You define the recommendation configurations in the Control Panel, and then retrieve the generated recommendations for display by calling the Recommendations API from a modification.

For more information, see Feature: Recommendation and Recommendations API.

Frosmo Platform servers

The Frosmo Platform is hosted on multiple regional servers for improved availability. A customer's site is typically hosted on the server geographically closest to the majority of the site's visitors.

Frosmo has regional servers for:

  • Americas
  • Asia
  • Europe
  • Finland

Modifications

In the Frosmo context, a modification is a real-time change to a web page designed to personalize or otherwise improve the user experience of the website and to guide visitors to complete a conversion. For example, modifications can be used to improve the sales funnel of an ecommerce site, leading to an increased conversion rate. In technical terms, a modification is a managed piece of code that changes the content, appearance, or behavior of a web page directly in the visitor's browser. The code can consist of HTML, CSS, and JavaScript, in any combination. The purpose of a modification is to improve the user experience or usability of a website in some specific way. For example, modifications can be used to improve the sales funnel of an eCommerce site, leading to an increased conversion rate.

The Frosmo platform Platform can use the data stored in the browser's local storage and cookies, such as segmentation data, to determine which modifications to show to the visitor. Modifications can also use data stored in the Frosmo back end.

Here are some a few examples of common modifications:

  • Display personalized content based on the visitor's behavior or context.
  • Add new content, such as personalized product recommendations or content generated from data feeds.
  • Modify existing content, such as images or linksbanners.
  • Remove unnecessary content, such as distracting elements, site navigation elements in shopping carts, or surplus elements in mobile-optimized layouts.
  • Modify Test the layout and styling of and element or a web page.
  • Add custom JavaScript code that interacts with custom APIs.

Modifications are grouped into the following types:

  • Automatic modifications generate content automatically from a data feed or an API, or from existing content managed elsewhere on the website. The generated content is first stored in the Frosmo back end and then retrieved from there for display.
  • Basic modifications are used for content that is retrieved from the Frosmo back end and displayed only after the browser has rendered the web page.
  • Cached modifications are used for static content that must be inserted into the web page code before the page is rendered in the browser. (Like with all modifications, the content is maintained in the Frosmo back end, but unlike with the other modification types, the content is inserted in full in the Frosmo custom script for quick access.)
  • Recommendations generate content based on the visitor's previous behavior on the website.

Frosmo platform main cases:

  • A/B test: Create two or more content variations to test which variation performs best.
  • Multi-armed bandit: Select a multi-armed bandit algorithm that automatically decides the best-performing content variation and adjusts the variation distribution accordingly.
  • Personalization: Create a single piece of content that you can personalize.

Frosmo Platform administrators manage modifications in the Control Panel.

...

For more information about modifications, see Feature: Modification.

For information about how conversions are attributed to modifications, see Conversion attribution.

Data collection and storage

The Frosmo JavaScript library collects usage data in the visitor's browser and sends the data to the Frosmo back end over an HTTPS connection. The library sends the data in the background so as not to interfere with the visitor's user experience. The data can be categorized into:

  • Product data
  • Segmentation data
  • Visitor data

The Frosmo JavaScript library also stores selected data locally in the browser.

Product data

The Frosmo platform collects product data from predefined product pages. Product data can include several attributes, such as:

  • Product name
  • Product category
  • Product image URL
  • Regular price
  • Discount price
  • Campaign name

The Frosmo platform can track product views and purchases separately for each visitor.

The preferred method for implementing product tracking is to use the Frosmo data layer.

Segmentation data

Segmentation is the process of assigning visitors to predefined groups called segments based on their behavior on a website. A visitor can belong to multiple segments at the same time, and the segments they belong to can change over time as they browse and interact with the site. The segmentation data for a visitor is a list of segments to which the visitor currently belongs.

Here are examples of common segments:

  • New/returning visitors
  • Visitors who have viewed a specific page
  • Visitor's geolocation

The Frosmo platform can also use custom segmentation rules if needed, such as segmentation based on information passed through the Frosmo data layer.

...

data can be categorized into:

  • Modification performance data
  • Product data
  • Server logs
  • Visitor data

By default, the Frosmo platform Platform collects and processes only anonymous and pseudonymous information about visitors and their behavior on a website. The platform does not collect personal or otherwise sensitive information, such as visitor names or credit card numbers.

The Frosmo platform tracks visitor behavior by collecting data about a visitor's actions on the website. Tracked actions can include, for example:

  • Conversions
  • Modifications or other content the visitor sees or clicks
  • Number of visits to the website
  • Time spent on the website or on a specific page

In addition to collecting anonymous information, the Frosmo platform can collect additional information about visitors from login and registration pages, including personal information, such as email addresses and phone numbers. However, this type of data collection can only be done with the consent of all involved parties, since collecting personal information may require changes to the customer's data protection statement. If implemented, the Frosmo platform will collect the information for the sole purpose of passing it on to the customer's system. The information will not be stored in the Frosmo back end.

Locally stored data

In addition to sending data to the Frosmo back end, the Frosmo JavaScript library stores data in the browser's local storage and cookies. None of the library's core features require the use of cookies, so storing data in cookies can be disabled, if necessary. Local storage, in turn, is a safer way to manage data, since web servers do not have access to it.

Local storage is used for most of the data that is not sent to the Frosmo back end and also for some data that is sent to the back end. Depending on the website, the Frosmo JavaScript library can use either the site's default, origin-specific local storage or, if data needs to be shared between multiple origins, a cross-origin local storage implemented using an inline frame (iframe), also known as a shared context. A common example of the latter is a site that uses both HTTP and HTTPS to deliver a service. This requires data to be shared between two origins. Using a shared context allows the origins to be treated as one and the same, which in turn allows the data to be stored only once and the visitor to be treated as a single user within the service.

The following visitor-specific data is stored in local storage:

  • User ID
  • Segmentation data
  • Custom data, if defined

The following data is stored in 1st-party cookies:

  • Frosmo keywords: Target group data for ad campaigns (set only if target groups are used)
  • Frosmo preview tool: Used by the modification preview tool (set only for preview tool users)
  • Frosmo quick context: Data needed for cached modifications (visitor-specific user ID and segmentation data; set only if cached modifications are used for the website)
  • Frosmo ON/OFF: Used to enable and disable the Frosmo JavaScript library (and thereby the Frosmo platform as a whole) for the website, usually for debugging purposes
  • Frosmo UID: Used to retrieve visitor-related data from the Frosmo back end (set only for Apple devices)

The following data is stored in 3rd-party cookies:

  • Globally unique browser ID: Used to identify the browser across different domains and websites

Integration with systems and services

The Frosmo platform can integrate with customers' back-end systems and other online services, such as analytics platforms and email marketing servicesdata that in itself enables the identification of an individual data subject.

For more information about what data the Frosmo Platform collects and stores from websites, and how the platform processes and uses the data, see Data collection and processing.

For information about how Frosmo protects the data it collects, see Data protection and privacy.

Integration with external systems and services

The Frosmo Platform can integrate with other back-end systems and online services, such as analytics tools, marketing automation systems, and data management platforms (DMPs).

Integrations are typically used for synchronizing segmentation data between the Frosmo platform and a customer's Platform and an external back-end system, or for using the collected usage data outside the customer websitesite. Integrations also allow the Frosmo platform Platform to input data about displayed or clicked content directly into a web an analytics tool, such as Google Analytics.

Here are some examples of common integrations:

  • Add visitor email addresses to specific mailing lists based on segmentation.
  • Use email notifications to provide shopping cart contents for interrupted shopping sessions ("abandoned carts").
  • Retrieve information from and store information to external databases. For example, retrieve user data from a customer's database and use the data to personalize website content, or send segmentation data to a customer's database.
  • Retrieve information from data feeds, such as product data feeds, or back-end systems, such as customer relationship management (CRM) systems. For example, retrieve information about new products or products currently on sale from a data feed, and generate corresponding product recommendations to visitors.

The Frosmo platform can also use segmentation data to identify target audiences for online advertising campaigns. The platform can integrate with the following ad servers:

  • Adform
  • Adtech
  • DoubleClick
  • Emediate
  • Google AdWords
  • KliKKi

Frosmo platform security

The Frosmo platform can limit customer access You can integrate the Frosmo Platform with, for example:

  • Analytics tools. If you want to use a separate web analytics tool, you should integrate it with the Frosmo Platform, since changes made to your site with Frosmo are not, by default, included in 3rd-party web analytics tracking. Integration ensures that you have a clear understanding of what is happening on your site.
  • Marketing automation systems. The Frosmo Platform can gather and process segmentation and visitor data for marketing automation systems, which can then use the data to target the appropriate audiences. You can set up integrations with, for example, email services.
  • Data management platforms. As with many other systems, extracting useful data from DMPs can be laborious and requires the use of multiple APIs. The Frosmo Platform can be used as a master API, an interface for all data calls between a DMP and a site.

For more information about integrations, see System and service integrations.

Frosmo Platform security

The Frosmo Platform can limit user access to the Control Panel by IP address. This restricts means that users can access to the customer's dedicated Control Panel to Frosmo premises and to the IP addresses specified by the customeronly from the designated IP addresses and from Frosmo premises.

The Frosmo platform Platform can force all content that is provided through the Frosmo JavaScript library to the customer website a site to load resources only from specified domains. When this feature is enabled, the Frosmo platform Platform validates all modification content before it is saved to the Frosmo back end. If the content contains elements that could be used to load or inject resources from non-authorized domains, the content is rejected.

For more information, see Frosmo security Security overview.

Browsers and other software

For information about how the Frosmo Platform works with browsers and other software, see:

Table of Contents
maxLevel2
minLevel2
includeSupported|Privacy

Supported browsers

The following tables list the officially supported browsers for the Frosmo JavaScript library and the Control Panel. Both may work on other browsers and browser versions as well, but Frosmo does not officially support these.

Table: Browsers officially supported by the Frosmo JavaScript library

BrowserVersion
Firefox
Google ChromeLatest version
Google Chrome
Microsoft EdgeLatest version
Internet Explorer (IE)9 or newerMicrosoft Edge
Mozilla FirefoxLatest version
OperaLatest version
Safari8 or newer

Table: Browsers officially supported by the Frosmo Control Panel

BrowserVersion
FirefoxLatest version
Google ChromeLatest version
Internet Explorer (IE)11 or newer
Microsoft EdgeLatest version

Ad-blockers and content filtering software

The Frosmo platform is not on any known basic ad-blocking lists.

Some privacy lists and software block the Frosmo platform, for example, EasyList, F-Secure Freedome VPN (when tracking protection is enabled), and Ghostery (when the "Beacon" category is selected).

Private browsing

...

Mozilla FirefoxLatest version

Privacy technologies

While Frosmo never collects visitor data for its own purposes, or for the purpose of selling the data to a third party, the Frosmo scripts are technically third-party content on websites, and some privacy technologies therefore affect the Frosmo Platform.

For more information, see Online privacy technologies and the Frosmo Platform.