# Release Notes

## v2.1.0

### **Face Tracking Lifecycle Callbacks**

Monitor face detection state in real-time with new callback APIs.

**New APIs:**

* `SetFaceFoundCallback(callback)` - Fires when a face is detected
* `SetFaceLostCallback(callback)` - Fires when a face is lost
* `IsFaceTracked()` - Check if face is currently tracked
* `GetFaceTrackingState()` - Get current state ('FOUND' or 'LOST')
* `RemoveFaceFoundCallback(callback)` / `RemoveFaceLostCallback(callback)` - Remove callbacks

**Usage:**

```javascript
WEBARSDK.SetFaceFoundCallback((faceInfo) => {
  console.log('Face detected!');
  showARContent();
});

WEBARSDK.SetFaceLostCallback(() => {
  console.log('Face lost!');
  hideARContent();
});

if (WEBARSDK.IsFaceTracked()) {
  // Face is currently visible
}
```

**Key Features:**

* Callbacks fire on state transitions (not every frame)
* Built-in debouncing to prevent flickering
* Access to face position, rotation, scale, and mouth openness
* Late registration support - callbacks fire immediately if face already tracked

***

### **Tracking Status API (Surface & World Tracking)**

Query the current tracking state for Surface and World Tracking modes.

**New API:**

* `GetTrackingStatus()` - Returns current tracking state

**Usage:**

```javascript
const info = WEBARSDK.GetTrackingStatus();

if (info) {
  console.log('Status:', info.status);        // "Tracking", "Anchoring", etc.
  console.log('State:', info.state);          // 0-3
  console.log('Is Tracking:', info.isTracking); // true/false
}
```

**Tracking States:**

* `0` - Idle
* `1` - Anchoring/Initialising
* `2` - Tracking (active)
* `3` - Relocalising

***

### Bug Fixes & Improvements

**Windows Touchscreen Laptop Detection**

Fixed device detection for Windows touchscreen laptops (Microsoft Surface Pro, Surface Laptop, etc.). These devices are now correctly identified as desktop devices, preventing unwanted motion sensor permission prompts.

**CSS Framework Compatibility (Face Tracking)**

Fixed face tracking compatibility with CSS frameworks like Tailwind and Bootstrap. The SDK now properly handles aspect ratio constraints, preventing horizontally stretched faces and improving tracking accuracy.

**Gyro Initialization**

Improved gyro sensor initialization for more reliable tracking startup.

***

## v2.0.9

### Key New Features

#### **1. Seamless Surface/Marker ➡️ Gyro Transition**

This release introduces the ability to seamlessly transition from Surface or Marker Tracking to Gyro Tracking using the new `EnableGyroMode()` API. This ensures experiences can continue using device orientation when specific tracking is no longer required.

* **Manual Handover:** Developers can programmatically trigger the transition to Gyro tracking using `WEBARSDK.EnableGyroMode()`.
* **Flexible Control:** Ideal for scenarios where the user moves away from the marker or surface after initial content placement.

#### **2. Front Camera Marker Tracking**

Developers can now enable marker tracking using the front-facing camera, unlocking new selfie-style marker experiences.

* **Usage:** Add the `enable-front-camera-for-marker-tracking` attribute to your configuration.

#### **3. Advanced Cursor API & Customization**

A new globally accessible Cursor API provides full control over the Surface & World Tracking cursor, allowing for deep customization and state management.

* **Access Point:** `WEBARSDK.GetCursorAPI()`
* **State Introspection:**
  * `isTapReady()`: Checks if the surface is locked and ready for placement.
  * `isVisible()`: Returns current visibility state.
  * `isCustomCursor()`: Checks if a custom cursor is in use.
  * `getOpacity()`: Returns current opacity level.
* **Control:**
  * `setVisible(visible)`: Toggle cursor visibility.
  * `setOpacity(opacity)`: Adjust cursor transparency.
* **Event Handling:**
  * `onTapReady(callback)`: Triggered when a valid surface is detected.
  * `onTapNotReady(callback)`: Triggered when tracking is lost or searching.
* **Material Customization (Default Cursor):**
  * `materials.setRingColor(color)` / `materials.setDotColor(color)`: Customize specific elements.
  * `materials.setColors(ringColor, dotColor)`: Set both colors simultaneously.
* **Custom Cursor Entity:**
  * New `customCursor` property in `webar-ux-control` allows using any A-Frame entity as the cursor.
* **Direct Access:**
  * `entity`: Direct reference to the A-Frame cursor entity for low-level manipulation.
  * `debug()`: Logs internal state and configuration to the console.

#### **4. Privacy Enhancements (IP Anonymization)**

To better align with privacy regulations and user preferences, we have added an option to anonymize IP addresses in analytics.

* **Usage:** Add `anonymize-ip-addresses="true"` to your SDK script tag.

#### **5. Manual Gyro Mode Control**

A new API allows developers to manually switch the experience to Gyro mode, effectively disabling SLAM tracking and relying solely on device orientation. This applies to both **Surface Tracking** and **Marker Tracking**.

* **Usage:** `WEBARSDK.EnableGyroMode()`
* **Example:**

```javascript
// Give a callback when the WebAR Marker <a-entity webar-marker> is ready to track the marker image
WEBARSDK.SetMarkerDetectedCallback((markerId) => {
  console.info('Marker is detected for marker id: ', markerId);
  // Switch to gyro mode after 7 seconds
  setTimeout(() => {
    WEBARSDK.EnableGyroMode();
  }, 7000);
});
```

### Performance & Stability

* **60 FPS Support:** WebAR experiences can now run smoothly at up to 60 FPS on supported devices.
* **Instant Tracking:** AR content appears instantly when the camera is opened.
* **Gyro-Fusion & Pose Smoothing:** Significant reduction in jitter and elimination of the AR "leaning" effect for improved orientation accuracy.
* **Pure Gyro Rotation:** Replaces SLAM-based rotation with pure gyro data for cleaner camera movement.
* **Dynamic Ground Plane Alignment:** Prevents AR content from floating above or below the real-world surface.

### Developer Experience & UX Improvements

* **Enhanced Error Dialogs:** A completely redesigned error dialog experience featuring a "Copy Link" button, improved readability, and better visual hierarchy for troubleshooting.
* **Mirroring Control:** New `disable-mirroring` attribute to turn off video mirroring for Face and Marker tracking modes.
* **Camera Orientation:** New `disable-ar-facing-camera` attribute allows opt-out of the default behavior where content always faces the user.
* **Windows Surface Support:** Added hardware compatibility for Windows Surface tablets.
* **Viewport Meta Tag:** Recommended for optimal layout and AR stability on mobile devices (see Best Practices below).

### Bug Fixes & Compatibility

* **Safari iOS 26+ Liquid Glass Fix:** Resolved an issue where the address bar caused viewport shrinking and transparency on newer iOS versions.
* **SLAM Camera Hierarchy:** Entities placed under `<a-camera>` now correctly follow camera movement in SLAM mode, matching ECS behavior.
* **Cross-Browser Text Rendering:** Fixed text wrapping and consistency issues across different browsers.
* **Android Surface Tracking:** Fixed an issue where the 3D cursor failed to appear on page reloads.
* **Marker Tracking Stability:** Enhanced detection reliability and stability.

***

### Best Practices & Examples

**Recommended Viewport Meta Tag:** For optimal layout, AR stability, and to prevent accidental zooming, we recommend the following viewport configuration:

```html
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,shrink-to-fit=no,user-scalable=no,viewport-fit=cover">
```

**Enabling IP Anonymization:**

```html
<script src="webar-sdk-v2.0.9.min.js" anonymize-ip-addresses="true"></script>
```

**Using the Cursor API:**

```javascript
WEBARSDK.SetStageReadyCallback(() => {
  const cursor = WEBARSDK.GetCursorAPI();
  
  if (cursor) {
    // Debug current state
    cursor.debug();

    // Customize appearance
    cursor.setOpacity(0.8);
    if (!cursor.isCustomCursor()) {
        cursor.materials.setColors('#00ff00', '#ff00ff'); // Ring green, Dot magenta
    }

    // Handle events
    cursor.onTapReady(() => console.log('✅ Surface locked – tap to place!'));
    cursor.onTapNotReady(() => console.log('❌ Move device to find a surface'));
  }
});
```

## v2.0.8

### New Features

#### External Camera Stream Support

* SDK now supports external camera streams.
* Introduced external-camera-stream configuration option.
* API method for setting the camera stream\[See [API reference](https://docs.blippar.com/webar-sdk/api/api-ref-1.5.3) for more details]:

```
WEBARSDK.SetCameraStream(yourVideoStream);
```

#### Minimal UI Mode

* Provides a clean, distraction-free UI.
* Enabled via configuration:

```
minimal-ui="true"

```

* Optional splash screens.

#### Enhanced Error & Progress Handling

* New standardized error codes for precise diagnosis, allowing custom UI display. \[See [SDK Configuration Properties](https://docs.blippar.com/webar-sdk/api/api-ref-1.5.3/sdk-configuration-properties) for more details]
* Unified callback handlers for errors and progress:

```
onError: (error) => { /* handle error */ },
onProgress: (progress) => { /* handle progress */ }
```

### Enhancements

#### Improved Marker Tracking

* Enhanced stability and tracking accuracy.
* Reduced false marker detection (lift-off) issues.

#### Performance & Stability Optimizations

* Improved FPS on less-featured surfaces, significantly enhancing stability.

### New SDK Configuration Properties

| Configuration Option   | Description                                | Default |
| ---------------------- | ------------------------------------------ | ------- |
| external-camera-stream | Enables external camera streams            | false   |
| minimal-ui             | Enables minimal UI mode                    | false   |
| auto-start-tracking    | Auto-starts tracking upon SDK load         | true    |
| on-error               | Enables custom error handling callbacks    | {}      |
| on-progress            | Enables custom progress handling callbacks | {}      |

## v2.0.7

We are excited to bring you the latest update **WebAR SDK v2.0.7**.

### Enhancements

* **Improved Marker Tracking:** Enhanced tracking accuracy and stability for a more responsive experience.
* **Reduced Detection Issues:** Minimized marker lift-off detection problems for smoother operation.

### Bug Fixes

* Various stability improvements
* Fixed several minor tracking issues
* General performance optimizations

## v2.0.6

We are excited to announce the release of **WebAR SDK v2.0.6**, packed with new features, enhancements, and critical bug fixes aimed at improving the augmented reality experience. This release focuses on enhancing user interactions and providing developers with more robust tools to create seamless AR applications.

### Perspective-Based Scaling(Aframe & Playcanvas)

Implemented scaling where nearer touchpoints result in larger AR objects compared to farther touchpoints. Recommended to use a canonical model with specific scale and position settings.

### AR Rotation Improvement

AR now faces the phone/user after tapping, improving the user experience over previous versions where AR faced the initial world direction.

### New SDK Config Properties

Added a new web attribute - `disable-ar-always-facing-camera`

* <mark style="color:orange;">`disable-ar-always-facing-camera`</mark>: When the stage cursor is enabled, AR objects now automatically orient to face the camera upon tapping, with behavior adjustable via the `disable-ar-always-facing-camera` setting.

### New APIs

We have added two new APIs:

1. <mark style="color:orange;">`PerformReset()`</mark>: Allows resetting of tracking, enabling users to design their own reset button.
2. <mark style="color:orange;">`SetPrepareForCameraTransitionCallback()`</mark>: Triggered just before the camera transition begins during app loading, allowing developers to manage HTML elements for a smooth transition.

## v2.0.5

We are excited to announce the release of WebAR SDK v2.0.5. This update brings significant enhancements to improve the user experience. Below are the key features and improvements included in this version.

### Instant Tracking

No hand movements or surface scanning required.

* AR appears as soon as the scene opens or the camera starts.
* Simply tap, and AR will appear instantly.

### Tap Anywhere

Place AR objects anywhere with a simple tap.

### Improved Ground Plane Alignment

* Improved ground plane alignment for better AR object placement.
* Enhanced surface detection for a more accurate experience.

### Speed Optimzations

Performance improvements for higher FPS and smoother experiences.

### Smooth Fade-In

The camera now opens with a slow fade-in effect, offering a seamless transition into the AR experience.

### Face Tracking Enhancements (A-Frame)

* New Attributes
  1. `webar-face-landmark="point: 151;"`: Attach a 3D model to a face landmark point.
  2. `webar-facemesh-shadow`: Create an additional face-mesh layer to display only shadows.
* Inbuilt Material Attributes
  1. `webar-facemat-occluder`
  2. `webar-facemat-normal`
  3. `webar-facemesh-shadow`
* Issues Fixed
  1. Replaced orthographic camera with a perspective camera for face tracking.
  2. Fixed shadow rendering issues.

**Note:**

* `webar-facemesh` and `webar-facemesh-shadow` are two different layers acting as a face mask. The `webar-facemesh-shadow` is positioned above the webar-facemesh layer.
* webar-video-plane should be placed at a negative z-distance as shown below:

  `<a-plane id="webar-video-plane" color="white" visible="true" position="0 0 -200"></a-plane>`

| Downloads                                                                                                       | Example Links                                                                                                                                                                                                                                                                                                                                                                                                      |
| --------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| [Download WebAR SDK v2.0.5 Zip File](https://webar-sdk.blippar.com/releases/2.0.5/blippar-webar-sdk-v2.0.5.zip) | <p>A-Frame</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.5/aframe/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.5/aframe/marker-tracking/index.html">Marker Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.5/aframe/face-tracking/index.html">Face Tracking</a></li></ul> |
| [CDN WebAR SDK v2.0.5](https://webar-sdk.blippar.com/releases/2.0.5/webar-sdk-v2.0.5.min.js)                    | <p>Babylon</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.5/babylon/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.5/babylon/marker-tracking/index.html">Marker Tracking</a></li></ul>                                                                                                                          |
|                                                                                                                 | <p>PlayCanvas</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.5/playcanvas/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.5/playcanvas/marker-tracking/index.html">Marker Tracking</a></li></ul>                                                                                                                 |
|                                                                                                                 | [Github Repo Examples](https://github.com/blippar/webar-sdk-example/releases/tag/v2.0.5)                                                                                                                                                                                                                                                                                                                           |

## v2.0.4 <a href="#release-2.0.1" id="release-2.0.1"></a>

We are excited to announce the release of WebAR SDK v2.0.4! This update brings significant enhancements to improve the user experience. Below are the key features and improvements included in this version.

### New Features and Improvements:

* **Dynamic Ground Plane Alignment:** The Ground-Plane now automatically attaches to the detected surface whenever a scene change is detected. This means that the virtual objects will align more accurately with the real world, providing a smoother and more immersive experience.
* **Performance Optimizations:** We’ve made some tweaks to improve the overall performance, resulting in a slight increase in frames per second (FPS). This should make the experience feel a bit more fluid and responsive.

| Downloads                                                                                                       | Example Links                                                                                                                                                                                                                                                                                                                                                                                                      |
| --------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| [Download WebAR SDK v2.0.4 Zip File](https://webar-sdk.blippar.com/releases/2.0.4/blippar-webar-sdk-v2.0.4.zip) | <p>A-Frame</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.4/aframe/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.4/aframe/marker-tracking/index.html">Marker Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.4/aframe/face-tracking/index.html">Face Tracking</a></li></ul> |
| [CDN WebAR SDK v2.0.4](https://webar-sdk.blippar.com/releases/2.0.4/webar-sdk-v2.0.4.min.js)                    | <p>Babylon</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.4/babylon/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.4/babylon/marker-tracking/index.html">Marker Tracking</a></li></ul>                                                                                                                          |
|                                                                                                                 | <p>PlayCanvas</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.4/playcanvas/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.4/playcanvas/marker-tracking/index.html">Marker Tracking</a></li></ul>                                                                                                                 |
|                                                                                                                 | [Github Repo Examples](https://github.com/blippar/webar-sdk-example/releases/tag/v2.0.4)                                                                                                                                                                                                                                                                                                                           |

## v2.0.3 <a href="#release-2.0.1" id="release-2.0.1"></a>

### **Introduction**

We are thrilled to introduce the latest version of our WebAR SDK, which focuses on delivering a more seamless and responsive AR experience. This release addresses key performance issues to ensure your AR interactions are smoother and more reliable. Below are the details of the improvements:

## Improved Performance

* Fixed an issue causing temporal/rubber band effect, resulting in a smoother and more responsive user experience.

| Downloads                                                                                                       | Example Links                                                                                                                                                                                                                                                                                                                                                                                                      |
| --------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| [Download WebAR SDK v2.0.3 Zip File](https://webar-sdk.blippar.com/releases/2.0.3/blippar-webar-sdk-v2.0.3.zip) | <p>A-Frame</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.3/aframe/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.3/aframe/marker-tracking/index.html">Marker Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.3/aframe/face-tracking/index.html">Face Tracking</a></li></ul> |
| [CDN WebAR SDK v2.0.3](https://webar-sdk.blippar.com/releases/2.0.3/webar-sdk-v2.0.3.min.js)                    | <p>Babylon</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.3/babylon/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.3/babylon/marker-tracking/index.html">Marker Tracking</a></li></ul>                                                                                                                          |
|                                                                                                                 | <p>PlayCanvas</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.3/playcanvas/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.3/playcanvas/marker-tracking/index.html">Marker Tracking</a></li></ul>                                                                                                                 |
|                                                                                                                 | [Github Repo Examples](https://github.com/blippar/webar-sdk-example/releases/tag/v2.0.3)                                                                                                                                                                                                                                                                                                                           |

## v2.0.2 <a href="#release-2.0.1" id="release-2.0.1"></a>

### **Introduction** <a href="#introduction" id="introduction"></a>

We're excited to announce the latest updates to our AR system, which bring significant improvements in stability, persistence, and overall user experience. These enhancements ensure that your AR interactions are smoother and more reliable than ever before.

### Enhanced AR Stability and Model Persistence <a href="#enhanced-ar-stability-and-model-persistence" id="enhanced-ar-stability-and-model-persistence"></a>

1. **Improved Tracking and Visibility:**
   * Maintains AR content visibility during system repositioning or tracking interruptions.
   * Addresses model disappearance issues, ensuring consistent visibility.
2. **User Experience Enhancements:**
   * Delivers smoother and more stable AR interactions.
   * Increases overall reliability and user engagement.

| Downloads                                                                                                       | Example Links                                                                                                                                                                                                                                                                                                                                                                                                      |
| --------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| [Download WebAR SDK v2.0.2 Zip File](https://webar-sdk.blippar.com/releases/2.0.2/blippar-webar-sdk-v2.0.2.zip) | <p>A-Frame</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.2/aframe/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.2/aframe/marker-tracking/index.html">Marker Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.2/aframe/face-tracking/index.html">Face Tracking</a></li></ul> |
| [CDN WebAR SDK v2.0.2](https://webar-sdk.blippar.com/releases/2.0.2/webar-sdk-v2.0.2.min.js)                    | <p>Babylon</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.2/babylon/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.2/babylon/marker-tracking/index.html">Marker Tracking</a></li></ul>                                                                                                                          |
|                                                                                                                 | <p>PlayCanvas</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.2/playcanvas/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.2/playcanvas/marker-tracking/index.html">Marker Tracking</a></li></ul>                                                                                                                 |
|                                                                                                                 | [Github Repo Examples](https://github.com/blippar/webar-sdk-example/releases/tag/v2.0.2)                                                                                                                                                                                                                                                                                                                           |

## v2.0.1

### **Introduction**

We’re excited to announce the latest update to our SLAM surface tracking technology, focused on delivering an even more refined user experience for augmented reality (AR) applications. This release continues to support AFrame, Babylon, and Playcanvas web frameworks.

### Building on a Strong Foundation

The previous update introduced significant advancements in performance, reliability, and user experience for AR development. This release builds upon that foundation by addressing specific user feedback:

1. **Enhanced Interaction Stability:**
   * We’ve mitigated the “sliding effect” during interactions, resulting in a more responsive and predictable user experience.
2. **Smoother Tracking:**
   * Jitter issues have been resolved to ensure smoother object tracking within the Web SDK, leading to an improved user experience.
3. **Consistent Scale:**
   * Scaling inconsistencies have been addressed to guarantee accurate and consistent object manipulation across various Web SDK functionalities.

### Continued Engine Support & Existing Features

* AFrame compatibility remains intact, enabling developers to create immersive WebAR experiences with ease.
* Seamless integration with Babylon continues, providing access to high-quality 3D graphics and interactive AR applications.
* Playcanvas support is still available, offering a powerful platform for developing interactive 3D WebAR content.

<table><thead><tr><th width="336">Downloads</th><th>Example Links</th></tr></thead><tbody><tr><td><a href="https://webar-sdk.blippar.com/releases/2.0.1/blippar-webar-sdk-v2.0.1.zip">Download WebAR SDK v2.0.1 Zip File</a></td><td><p></p><p>A-Frame</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.1/aframe/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.1/aframe/marker-tracking/index.html">Marker Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.1/aframe/face-tracking/index.html">Face Tracking</a></li></ul></td></tr><tr><td><a href="https://webar-sdk.blippar.com/releases/2.0.1/webar-sdk-v2.0.1.min.js">CDN WebAR SDK v2.0.1</a></td><td><p></p><p>Babylon</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.1/babylon/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.1/babylon/marker-tracking/index.html">Marker Tracking</a></li></ul></td></tr><tr><td></td><td><p></p><p>PlayCanvas</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.1/playcanvas/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.1/playcanvas/marker-tracking/index.html">Marker Tracking</a></li></ul></td></tr><tr><td></td><td><a href="https://github.com/blippar/webar-sdk-example/releases/tag/v2.0.1">Github Repo Examples</a></td></tr></tbody></table>

## v2.0.0

### Discover Our Advanced SLAM&#x20;

We are excited to introduce the latest update to our SLAM surface tracking technology, designed to offer enhanced performance and reliability for AR experiences. This release supports AFrame, Babylon, and Playcanvas. Key Features and Improvements:

1. **Enhanced Accuracy:**
   * Improved tracking precision for more stable and accurate surface detection.
   * Reduced drift and increased robustness in diverse environments.
2. **Faster Initialization:**
   * Quicker setup times allowing for near-instantaneous surface recognition and interaction.
3. **Optimized Performance:**
   * &#x20;Smoother and more responsive tracking with reduced computational overhead.
   * Enhanced performance on a wide range of devices, ensuring a seamless user experience.
4. **Improved Stability:**
   * Enhanced algorithms for maintaining stable tracking even in challenging conditions such as low-light or dynamic environments.
5. **Increased Range:**
   * Extended tracking range enabling larger and more complex AR interactions.
   * Improved handling of occlusions and dynamic changes in the environment.
6. **User-Friendly Integration:**
   * Simplified API and SDK integration process, making it easier for developers to incorporate advanced surface tracking into their applications.
7. **Support for Multiple Engines:**
   * AFrame: Full compatibility with AFrame, allowing developers to create immersive WebAR experiences with ease.
   * Babylon: Seamless integration with Babylon, enabling high-quality 3D graphics and interactive AR applications.
   * Playcanvas: Support for Playcanvas, providing a powerful platform for developing interactive 3D WebAR content.

### **Enhanced User Interaction Control using New APIs**

1. **SetUserGestureRotation(enabled):**
   * This API allows you to enable or disable user rotation.
   * `enabled = true`: Rotation is enabled.
   * `enabled = false`: Rotation is disabled.
2. **SetUserGestureScale(enabled):**
   * This API enables or disables user scaling.
   * `enabled = true`: Scale is enabled.
   * `enabled = false`: Scale is disabled.

<table><thead><tr><th width="336">Downloads</th><th>Example Links</th></tr></thead><tbody><tr><td><a href="https://webar-sdk.blippar.com/releases/2.0.0/blippar-webar-sdk-v2.0.0.zip">Download WebAR SDK v2.0.0 Zip File</a></td><td><p></p><p>A-Frame</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.0/aframe/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.0/aframe/marker-tracking/index.html">Marker Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.0/aframe/face-tracking/index.html">Face Tracking</a></li></ul></td></tr><tr><td></td><td><p></p><p>Babylon</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.0/babylon/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.0/babylon/marker-tracking/index.html">Marker Tracking</a></li></ul></td></tr><tr><td></td><td><p></p><p>PlayCanvas</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.0/playcanvas/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v2.0.0/playcanvas/marker-tracking/index.html">Marker Tracking</a></li></ul></td></tr><tr><td></td><td><a href="https://github.com/blippar/webar-sdk-example/releases/tag/v2.0.0">Github Repo Examples</a></td></tr></tbody></table>

## v1.7.4

### What's New?

* **WebAR SDK**\
  Added new API **`SetFaceScaleFactor()`** for face tracking\
  It configures the scale at which AR objects are displayed relative to the user’s face in a web-based AR experience.
* **Unity**\
  As part of Release 1.7.4 an enhancement has been deployed to Unity build release v.1.7.4-1 with **peel-away mod**e. Enable this feature to allow the object to be displayed even when the user moves the camera away from the marker, the AR object will still remain on the screen. For more information refer '[Build a marker tracking experience](https://docs.blippar.com/webar-sdk/integrations/unity-integration/build-a-basic-marker-tracking-experience)'&#x20;

<table><thead><tr><th width="336">Downloads</th><th>Example Links</th></tr></thead><tbody><tr><td><a href="https://webar-sdk.blippar.com/releases/1.7.4/blippar-webar-sdk-v1.7.4.zip">Download WebAR SDK v1.7.4 Zip File</a></td><td><p></p><p>A-Frame</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.4/aframe/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.4/aframe/marker-tracking/index.html">Marker Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.4/aframe/portal-webar/index.html">Portal Experience</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.4/aframe/face-tracking/index.html">Face Tracking</a></li></ul></td></tr><tr><td><a href="https://unity-webar-sdk.blippar.com/releases/latest/unity_webarsdk.unitypackage?_gl=1*1eyxk1v*_ga*MTk5NDk0OTczOC4xNjgwNDE3NjIw*_ga_Z5WQRDSH6E*MTcwNzM3NDc1MC44Ni4xLjE3MDczNzQ3NjcuNDMuMC4w">Download Latest Unity SDK Plug-in</a></td><td><p></p><p>Babylon</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.4/babylon/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.4/babylon/marker-tracking/index.html">Marker Tracking</a></li></ul></td></tr><tr><td></td><td><p></p><p>PlayCanvas</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.4/playcanvas/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.4/playcanvas/marker-tracking/index.html">Marker Tracking</a></li></ul></td></tr><tr><td></td><td><a href="https://github.com/blippar/webar-sdk-example/releases/tag/v1.7.4">Github Repo Examples</a></td></tr></tbody></table>

## v1.7.3

### What’s New?

* **Face tracking released for all rendering engines**\
  A-Frame, Babylon.js PlayCanvas
* **Enhanced UX for Playcanvas Surface Tracking**\
  Introduced a new and improved user experience for PlayCanvas Surface tracking, streamlining and enhancing user interactions. For more information refer article 'Build a Surface tracking experience using A-frame- [Step 6](https://docs.blippar.com/webar-sdk/integrations/a-frame-integration/build-a-basic-surface-tracking-experience)'
* **Lazy-Mode Support for Face Tracking**\
  This update brings <mark style="color:red;">**`lazy-mode`**</mark> support, optimizing face tracking for efficiency and performance.
* **WEBARSDK.EnableTrackingOnDesktop() Function**\
  A new function to enable desktop-only tracking specifically for face tracking. This is particularly useful in scenarios like BB, where the app initially starts in lazy-mode and subsequently determines the appropriate tracking mode.
* <mark style="color:red;">**`webar-face-pivot`**</mark> - **AFrame Attribute**\
  A new attribute that allows an entity to move in sync with the user’s head movements, without rotating with the head. This enhances the realism and interactivity of AR experiences. For more information refer article '[Build a Face Tracking experience using A-frame'](https://docs.blippar.com/webar-sdk/integrations/a-frame-integration/build-a-basic-face-tracking-experience)
* <mark style="color:red;">**`webar-raycaster`**</mark> - **AFrame Attribute**\
  A specialized attribute for improved AR interaction in face-tracking mode. Developers can now use <mark style="color:orange;">**`el.addEventListener('click', (evt) => {})`**</mark> to receive raycast events. This attribute replaces AFrame’s native raycaster and cursor attributes in face tracking mode, addressing compatibility issues with AFrame’s built-in raycaster component in face-tracking scenarios. Our custom raycaster component ensures better performance and reliability.

**Example**

```html
<a-scene
      webar-scene="key: <%= htmlWebpackPlugin.options.licenseKey %>"
      webar-raycaster="objects: .clickable; enabled: true;"
      vr-mode-ui="enabled: false"
      device-orientation-permission-ui="enabled: false"
      loading-screen="enabled: false"
      renderer="colorManagement: false; antialias: true; 
      physicallyCorrectLights: false;">
```

| Downloads                                                                                                       | Examples                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                |
| --------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Download WebAR SDK v1.7.3 zip File](https://webar-sdk.blippar.com/releases/1.7.3/blippar-webar-sdk-v1.7.3.zip) | <p></p><p>A-Frame</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.3/aframe/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.3/aframe/marker-tracking/index.html">Marker Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.3/aframe/portal-webar/index.html">Portal Experience</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.3/aframe/face-tracking/index.html">Face Tracking</a></li></ul> |
|                                                                                                                 | <p></p><p>Babylon</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.3/babylon/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.3/babylon/marker-tracking/index.html">Marker Tracking</a></li></ul>                                                                                                                                                                                                                                                        |
|                                                                                                                 | <p></p><p>PlayCanvas</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.3/playcanvas/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.3/playcanvas/marker-tracking/index.html">Marker Tracking</a></li></ul>                                                                                                                                                                                                                                               |
|                                                                                                                 | [GitHub Repo Examples](https://github.com/blippar/webar-sdk-example/releases/tag/v1.7.3)                                                                                                                                                                                                                                                                                                                                                                                                                                                                |

## v1.7.1

### What’s New

#### **Enhanced User Experience for Surface Tracking**

* New UX for Surface Tracking: Added a ‘safe zone’ that appears once SLAM anchors, allowing users to place objects anywhere using the cursor. Just tap on the screen to place an object.
* Interactive Animations & Cues: Introduced animations and visual cues to further enhance the user experience during interaction.Model Interaction:
* Pinch to Zoom: Implemented pinch-to-zoom functionality to allow users to zoom in and out for a better model viewing experience.
* Swipe to Rotate: Added the ability to rotate the model by swiping, making it easier to adjust the model’s orientation.&#x20;

### Enabling New UX Experience

### New APIs

<table><thead><tr><th width="393">API</th><th>Function</th><th data-hidden></th></tr></thead><tbody><tr><td><code>SetARModelPlaceCallback(callback)</code></td><td>Assigns a callback to execute after an AR model is placed within the scene, enabling custom post-placement interactions.</td><td></td></tr><tr><td><code>SetResetButtonCallback(callback)</code></td><td>Links a custom callback to the reset button’s action for customized reset logic. Requires <code>webar-ux-control</code> with <code>stageCursorUX: true</code></td><td></td></tr><tr><td><code>SetResetButtonVisibility(isVisible)</code></td><td>Controls the reset button’s visibility within the AR interface, allowing for UI customization.</td><td></td></tr></tbody></table>

### SDK Configuration Properties

<table><thead><tr><th>Configuration</th><th>Description</th><th data-hidden></th></tr></thead><tbody><tr><td><code>rotation-speed</code></td><td>Controls the sensitivity of the AR object’s rotation in response to user gestures. Accepts values greater than 0 and less than 1.</td><td></td></tr><tr><td><code>gesture-scale-max</code></td><td>Sets the maximum scale factor for enlarging an AR object using pinch gestures.</td><td></td></tr><tr><td><code>gesture-scale-min</code></td><td>Sets the minimum scale factor for reducing an AR object’s size in a single pinch gesture.</td><td></td></tr><tr><td><code>hide-reset-button</code></td><td>Optionally hides the reset button from the UI, active only when <code>webar-ux-control</code> with <code>stageCursorUX: true</code> is configured.</td><td></td></tr></tbody></table>

{% hint style="info" %}
Dependency on `webar-ux-control`: All new functionalities—including callbacks, visibility controls, and interactive attributes—require a properly configured `webar-ux-control`. This is essential for activating the full range of UX and interactive features in both A-Frame and Babylon.js environments.
{% endhint %}

| Downloads                                                                                                       | Examples                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                |
| --------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Download WebAR SDK v1.7.1 zip File](https://webar-sdk.blippar.com/releases/1.7.1/blippar-webar-sdk-v1.7.1.zip) | <p></p><p>A-Frame</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.1/aframe/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.1/aframe/marker-tracking/index.html">Marker Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.1/aframe/portal-webar/index.html">Portal Experience</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.1/aframe/face-tracking/index.html">Face Tracking</a></li></ul> |
|                                                                                                                 | <p></p><p>Babylon</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.1/babylon/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.1/babylon/marker-tracking/index.html">Marker Tracking</a></li></ul>                                                                                                                                                                                                                                                        |
|                                                                                                                 | <p></p><p>PlayCanvas</p><ul><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.1/playcanvas/surface-tracking/index.html">Surface Tracking</a></li><li><a href="https://webar-sdk.blippar.com/webar-sdk-example/v1.7.1/playcanvas/marker-tracking/index.html">Marker Tracking</a></li></ul>                                                                                                                                                                                                                                               |
|                                                                                                                 | [GitHub Examples](https://github.com/blippar/webar-sdk-example/releases/tag/v1.7.1)                                                                                                                                                                                                                                                                                                                                                                                                                                                                     |

## v1.7.0

### What's New?

#### Face Tracking for A-frame

Face tracking released for A-frame rendering engine. Will be followed by other rendering engines. Blippar is excited to announce that Face Tracking is now available within our WebAR SDK. The all new Blippar WebAR SDK is an industry-leading facial detection system which allows you to use any face as a digital canvas to build exciting AR experiences and increase user engagement for your brand.

| SDK Attributes                                                                                                                                                                                                                                                       | A-Frame Attributes                                                                                                                            | Functions                                                                                                                                                |
| -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `webar-mode="face-tracking"` sets to face tracking mode. For more information refer article '[Build a face tracking experience using A-frame](https://docs.blippar.com/webar-sdk/v/v.1.7.1/integrations/a-frame-integration/build-a-basic-face-tracking-experience)' | `<a-entity webar-face>` to display 3D models on the tracked face                                                                              | `GetMouthOpenedMagnitude()` - To get the magnitude of the distance between the upper and lower lips. It gives a constant value in the range of 0 to 1.5. |
|                                                                                                                                                                                                                                                                      | `<a-plane webar-facemesh>` to display image/video texture on the tracked facemesh                                                             |                                                                                                                                                          |
|                                                                                                                                                                                                                                                                      | `<a-plane webar-plane>`  to display webcam video background(optional). Developer can hide this to display a face model on a white background. |                                                                                                                                                          |

### Try Now

{% hint style="info" %}

* [webar-sdk zip file](https://webar-sdk.blippar.com/releases/stage/blippar-webar-sdk.zip) has `face.html` which has a simple 3D face model and facemesh filter.
* The default face.html example in the zip is simplified in order to make an easy to create face tracking tutorial documentation.
* For more complex demo testing, you may try the [Newsletter Try-now examples](https://webar-sdk.blippar.com/newsletter/face-tracking/try-now/aframe/face.html).

New `face.html` [example](https://webar-sdk.blippar.com/zip-examples/stage/aframe/face.html) has:

* Try ons - Coolers and lipstick try-on.

* To test face and facemesh tracking accuracy
  {% endhint %}

* **Extended Tracking Range**: Enable larger and more complex AR interactions.

* **Improved Occlusion Handling**: Better manage dynamic changes in the environment.

* **AFrame**: Full compatibility with AFrame, allowing developers to create immersive WebAR experiences with ease.
