---
title: How to create a WebAR Hologram project using Depthkit Cinema
description: Capture your own volumetric videos for an immersive WebAR experience
---

[Default HubSpot Blog](https://info.nianticspatial.com/blog)

# [How to create a WebAR Hologram project using Depthkit Cinema](https://info.nianticspatial.com/blog/how-to-create-a-webar-hologram-project-using-depthkit-cinema)

 Written by [8th Wall](https://info.nianticspatial.com/blog/author/8th-wall) | Sep 9, 2020, 10:54:00 PM

[Depthkit Cinema](https://www.depthkit.tv/depthkit-cinema?utm_source=dk_site&utm_medium=web&utm_campaign=8thwall) software allows you to capture high resolution volumetric videos from anywhere. When paired with 8th Wall, you can create a WebAR experience that works on all devices, no app needed. Here’s how:

## Step 1. Capture a Volumetric Video Using Depthkit Cinema

Follow Depthkit’s step-by-step tutorial below and make sure to export as *Combined Per Pixel Video *which will produce a .txt file and .mp4 file. These files are what you will need for your 8th Wall project.

 

## Step 2. Clone one of these sample projects from 8th Wall

Clone either the [A-Frame project](https://www.8thwall.com/playground/depthkit-aframe) or the [three.js](https://www.8thwall.com/playground/depthkit-threejs) project to get started. If you don’t already have an 8th Wall account, you’ll be prompted to sign up for a 14-day free trial.

 

## Step 3. Import Depthkit Files Into 8th Wall

In 8th Wall, open your cloned project then drag and drop the Depthkit files into the Cloud Editor. The .txt file should drop into the *capture-data* folder and the .mp4 should drop into the *assets/captures* folder.

 

## Step 4. Reference Assets

In your <a-scene>, reference the Depthkit capture name in the *capture* parameter from within the *depthkit* component. This assumes your .txt and .mp4 share the same name (i.e. *autumn* in the example).

 

## Step 5. Test and publish

Once you Save + Build, you can preview your project by scanning the QR code at the top with a smartphone or tablet. If everything looks good, you’re ready to publish.

And just like that, you’ve created your first WebAR hologram using Depthkit Cinema and 8th Wall! 🎉

\* \* \*

*Share a photo or video of your hologram project on Twitter tagging @the8thwall and @depthkit *📸 *We can’t wait to see what you create!*

[View full post](https://info.nianticspatial.com/blog/how-to-create-a-webar-hologram-project-using-depthkit-cinema)

```json
{
  "@context" : "http://schema.org",
  "@type" : "BlogPosting",
  "author" : {
    "@type" : "Person",
    "name" : "8th Wall"
  },
  "dateModified" : "2021-09-28T23:24:14.523Z",
  "datePublished" : "2020-09-09T22:54:00Z",
  "headline" : "How to create a WebAR Hologram project using Depthkit Cinema",
  "image" : {
    "@type" : "ImageObject",
    "height" : 300,
    "url" : "https://f.hubspotusercontent20.net/hubfs/7182223/1_nSkC-NhR_xqJgEzzmx0OpA.gif",
    "width" : 700
  },
  "mainEntityOfPage" : "https://info.nianticspatial.com/blog/how-to-create-a-webar-hologram-project-using-depthkit-cinema",
  "publisher" : {
    "@type" : "Organization",
    "logo" : {
      "@type" : "ImageObject",
      "height" : 60,
      "url" : "/hs/hsstatic/content_shared_assets/static-1.4092/img/default-amp-logo.png",
      "width" : 60
    },
    "name" : "Default HubSpot Blog"
  }
}
```