We use cookies to enhance your experience, analyze site traffic, and personalize content. By clicking “Accept All”, you agree to our use of cookies.

Cookie Preferences

Manage your cookie settings. You can enable or disable different types of cookies below. For more details, see our Privacy Policy.

Quick Start - WebAR with Zappar

This tutorial covers how to use wonderland-ar-tracking together with Zappar’s Universal AR Tracking.

You can use any of Zappar’s supported tracking capabilities:

  • SLAM tracking
  • Image tracking (flat and cylindrical)
  • Face tracking

Creating a Project 

Select either the Image Tracking, SLAM Tracking, or Face Tracking template when creating your project.

Testing 

To test the project locally, connect your device via USB, find the device drop-down at the top to select it, and hit the green arrow button to launch the local website in the browser as follows:

View on Smartphone 

For Android:

  1. Ensure you have “USB Debugging” enabled on your device.
  2. Connect your device via USB.
  3. Select “Local Device” to trigger the “Allow USB Debugging” dialog on your device.
  4. Once approved, you can select the device in the dropdown.
  5. Hit the green arrow to launch the browser with the page on your smartphone.

For iOS:

  1. Connect your iOS device and Mac to the same Wi-Fi network.
  2. On your Mac, find your Mac’s name: Go to System Preferences > Sharing to find your Mac’s name.
  3. Open Safari on your iOS device: Type the URL http://YourMacName.local:8080.

Publishing 

To publish your app, create a new “Local Project” on ZapWorks, use the “JavaScript” SDK, and then copy the project ID.

Then, open Views > Plugins, enable plugin execution for the project, and install the @wonderlandengine/zappar-publish-plugin in the “Project Scope” plugins.

Once enabled, you can paste the project ID into the plugin and click “Upload & Publish”.