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

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:

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

Figure: Frosmo platform architecture and information flows at a glance

In a nutshell:

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

Frosmo platform architecture

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

Figure: Frosmo platform architecture and information flows in detail

Frosmo JavaScript library

The Frosmo JavaScript library is the core component of the Frosmo platform. The library runs on top of the customer website in the visitor's browser. 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 file:

The Frosmo JavaScript library is loaded in the browser through two script elements in a web page's HTML source code, one for the 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 platform.

The Frosmo JavaScript library is optimized for fast loading. The Frosmo Core library is only 50 KB in size, while the Frosmo custom script usually ranges between 16-32 KB.

By default, the Frosmo JavaScript library files are delivered through Amazon CloudFront. Frosmo can also use other services based on customer requirements.

The Frosmo JavaScript library is often referred to simply as Frosmo scripts.

Frosmo data layer

The Frosmo data layer can be used to pass information from a web page to the Frosmo JavaScript library. The library then sends the information to the Frosmo back end. The library can also use the information directly in the browser to, for example, display content or manage segmentation. You can pass information about the following events and items through the data layer:

For more information about the data layer, see 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.

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

Message API

The Message API retrieves content to be displayed to visitors from the Frosmo back end. 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:

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:

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:

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

In the Frosmo platform, 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 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 examples of common modifications:

Modifications are grouped into the following types:

Frosmo platform administrators manage modifications in the Control Panel.

Data gathering

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:

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:

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:

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

Visitor data

By default, the Frosmo platform collects only anonymous 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:

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:

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

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

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 services.

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

Here are some examples of common integrations:

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:

Frosmo platform security

The Frosmo platform can limit customer access to the Control Panel by IP address. This restricts access to the customer's dedicated Control Panel to Frosmo premises and to the IP addresses specified by the customer.

The Frosmo platform can force all content that is provided through the Frosmo JavaScript library to the customer website to load resources only from specified domains. When this feature is enabled, the Frosmo 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 overview.

Browsers

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
FirefoxLatest version
Google ChromeLatest version
Internet Explorer (IE)9 or newer
Microsoft EdgeLatest 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

The Frosmo platform interprets an incognito browsing session as a new visitor. This means that no segmentation data or other data previously stored in the browser is available for the session. Each new incognito session is counted as a new visitor.

Amazon