# Blings io MP5 Integration and Security Guide

## Blings.io MP5 Integration and Security Guide

At Blings.io, we've pioneered a unique approach to video technology with our patented MP5 system. This groundbreaking innovation combines the rich, immersive nature of video with the personalization and interaction capabilities of modern web technologies. Our goal is to enhance customer engagement for companies, driving significant improvements in sales, loyalty, and actionable responses.

Blings collaborates with prominent Fortune 500 enterprises, major financial institutions, and HMOs, ensuring full compliance with rigorous security standards. Our technology is designed to scale, and capable of accommodating the needs of millions of users seamlessly.

### MP5 Video Technology Overview

* **Key Features of MP5**
  * **Dynamic**: Tailored videos rendered in real-time based on dynamic data. Can scale to millions of video versions, at no additional cost or limitation.
  * **Interactive**: Videos feature clickable elements, supporting CTAs, real-time video modification, and forms for immediate customer interaction.
  * **Lightweight & High-Quality**: Utilizes vector graphics for minimal file size (< 100kb) without compromising resolution.
  * **Programmable**: Offers full customization with native web technologies like JS and HTML.
*   **Behind the Scenes: MP5 Mechanics**

    An MP5 file is essentially a set of instructions that comes to life when the video is played. It's analogous to how a website is rendered from HTML code upon a user visiting the page. The MP5 file merges video instructions with real-time data to generate a personalized video experience.

    Behind the Scenes differences between MP4 file and MP5 file

### Video Creation Process

* **One-time template creation**
  1. **Template Design**: Video templates are initially crafted using Adobe After Effects.
  2. **Personalization Mechanism**: Our no-code 'playground' enables video designers to integrate data variables for personalized experiences.
  3. **Dynamic Video Template**: The result is a dynamic blueprint ready to receive data variables and support user interactions.
* **Real-Time Video Generation**
  * The company incorporates Blings' client-side SDK within its web \ HTML infrastructure.
  * Data from the company’s customer database, typically embedded in the company’s web page for dynamic content display, is leveraged by the SDK
  * Videos are generated using real-time data directly on the recipient's device. This method ensures privacy and security, as private user data is never exposed to a third party.

## Integration

Videos are generated using real-time data directly on the recipient's device. to ensure privacy and security

Blings.io facilitates a streamlined integration process:

* **MP5 as a Visual Layer**: Our technology acts as a visual enhancement to your current data utilization methods, without interfering with the data and infrastructure itself.
* **Compatibility**: Works harmoniously with existing marketing platforms, facilitating a seamless addition to your ecosystem, and generating videos directly from existing data, eliminating the need for rendering servers or complex data integration processes.
* **Privacy-Focused**: Ensures private user’s data is never exposed to third-party

#### Blings SDK

The Blings SDK is a lightweight JavaScript library designed for client-side integration on web pages. Blings SDK merges user-specific data with a pre-designed video template to generate personalized videos in real-time, directly on the end user's device.

1. For seamless updates and maintenance, it is available through an evergreen CDN link provided by Blings.
2. For enhanced control and security, it can also be hosted on-premise or via the company's CDN.

* For NPM installation and React component support, please reach out to our technical team directly.
* **Alternative Hosting Options**: To embed Blings videos within an iFrame or for complete on-prem hosting without external network dependencies, consult our technical team for assistance.

#### **SDK Security and Isolation**

The Blings SDK operates as a client-side interface that functions independently from a company’s internal systems. Here's why the SDK poses no risk to your system:

1. **Client-Side Operation**: It runs within the user’s browser environment, not on company servers, ensuring that there is no integration into the company’s backend systems.
2. **No Data Exposure**: Since the SDK does not communicate with Blings servers, there is no transfer or exposure of data back to Blings. User data is processed in the browser and never leaves the company's domain.
3. **Isolation from Core Systems**: The SDK's activities are isolated from the company's core systems, mitigating any risk associated with data breaches or system integrity.
4. **Data Handling Compliance**: The SDK adheres to standard web technologies that are compliant with data handling and privacy standards, ensuring that the use of the SDK aligns with privacy regulations.
5. **Secure by Design**: With no server-side components, the SDK does not require open ports or database access within a company’s infrastructure, eliminating common attack vectors.

By maintaining a clear separation between the SDK and a company's systems, and handling all data within the user's browser, Blings ensures a secure, risk-free experience

Building on this foundation of secure architecture, Blings has earned the trust of banks and large corporations, many of which have the most stringent requirements for data privacy and security. Our commitment to maintaining the highest standards of data protection is reflected in our GDPR compliance and ISO 27001 certification, ensuring that our practices meet international security and privacy benchmarks. This underscores our dedication to safeguarding user data and providing a trusted solution for organizations across various industries.

#### Example SDK Integration

**Pseudo-code**

```jsx
<script src="blings-sdk.js"></script>

<body>
	<div id="video"></div>
</body>

<script>
	BlingsPlayer.create({
	    project: { id: "video-template-id-123" },
	    data: {
				"name": {{ data.username.first }}
			}
	});
	<script>
```

**Example Video**

**Sample HTML File (download)**

Blings SDK Integration Test.html

**Codepen demo**

#### CRM Integration

In addition to direct SDK integration, we provide an easy integration method for CRM email campaigns.

* With your CRM's email editor, add a link to a pre-configured MP5 webpage.
* Use CRM tokens in the link to personalize videos with user data.
  * e.g. https://company.blings.io/video1?name=\{{FIRST\_NAME\_TOKEN\}}\&points=\{{USER\_POINTS\}}
* Personalized tokens in the URL allow the video to parse and use data directly from the URL parameters for real-time personalization.
* Blings enhances email campaigns with dynamic thumbnails. These visually engaging thumbnails, can include the user’s name, and link directly to the personalized video webpage when clicked.

**Example Video Using URL parameters**

[OnBoarding Video](https://blings.mp5.live/onboarding_video?color=#ff0\&Name=Daniel)

change URL parameters to update video

