Get Started with Curved Tracking in ZapWorks Studio

Hi all!

We’re happy to announce the release of our newest tracking type, Curved Tracking.

Curved surface tracking expands upon Zappar’s existing image tracking (which was previously only designed for flat surfaces), opening up a world of new opportunities, especially when it comes to connected packaging, allowing you to create interactive, branded experiences on a range of curved surfaces including cans, cups or bottles.

Here’s a quick showcase of curved tracking in action :champagne::

This post details how to get started with the beta version of curved tracking in ZapWorks Studio.

:warning: A quick note before you get started with this tracking type - this functionality is currently in beta. This means that we are working on it to make improvements. The beta version is not recommended for live projects. Please consider this carefully; and rigorously test your projects across multiple devices and browsers if you do decide to use this version.


:sparkle: What makes a good curved target image?

:+1:

  • Lots of unique high-contrast texture
  • Good coverage over the object

:-1:

  • Repetitive patterns
  • Largely see-through or translucent labels
  • Fancy finished, e.g very shiny or colour changing

:sparkle: Training a curved image using the ZapWorks CLI

First you’ll need to install and train up a curved target with the ZapWorks CLI. Currently this is the only way to train up a curved target but we’ll be bringing an update into Studio soon to enable curved image training directly in the tool.

To install and use the ZapWorks CLI, first make sure you have Node.js installed, then run the following command in a terminal on your computer:

npm i -g @zappar/zapworks-cli@beta

Once installed, you can use the ‘train’ function to create a .zpt from your PNG / JPG image, as seen in the example below:

zapworks train YOURFILENAME.jpg/png --circumference=..cm --input-height=..cm

So that the image training algorithm knows the curvature of your object, specify exactly one of:

  • --radius=Xcm
  • --circumference=Xcm

So that the algorithm knows the real-world size of your target, specify exactly one of:

  • --input-height=Xcm
  • --input-width=Xcm
  • --dpi=X

train-curved-image-cli
(Image above showing example command usage)

:sparkle: Importing the .zpt file into Studio

Once you’ve trained your target image, you’ll have a .zpt file in the chosen directory. To import this .zpt file into Studio, simply drag it into the Media Library. It should now appear under the ‘Targets’ tag.

Dragging a target from the Media Library into the Hierarchy will display a preview of the tracking image in the viewport.

Curved images are currently displayed flat in the Studio viewport. We will be bringing an update to Studio soon which will show a curved version of the target image if a curved .zpt is detected.

Once in the Hierarchy, you can build up your scene in the same way as any other tracking type.

:sparkle: Previewing

As this tracking type is still in beta, you’ll need to scan the preview code in our beta WebAR site: https://wtbeta.arweb.app

:sparkle: Publishing

We can deploy this version of the runtime that includes Curved Tracking to any custom WebAR sites, please get in touch with us if you want to learn more!


We hope you have fun experimenting and we’re delighted to see what you create!

Team ZapWorks :zap:

5 Likes

I got this to work in Studio after the webinar but as of today (2/24/22) Unity Universal AR beta 3.0.1-preview.1 doesn’t work.

Can’t wait for the Unity update!!

Steve

1 Like

Hi, I love this new feature…
In Studio may i know which is the best way to stream a video on a curved fbx?
I have modified a Video player and succeeded in streaming a video in the curved surface (it’s a round label applied to a Bottle) but the video is wrapping the surface the wrong way; May be this problem is about the UV coordinates of the FBX?. Is there a method to rotate the texture on the surface? Maybe there’s a best way to achieve this?
Thank you
Luca

Trying to train a curved image file for Studio, but the command can’t find my image file. I feel like this should be an easy answer, but I’d love help. I’ve tried typing the whole path, but still no luck.

Thanks in advance

Hi @joel,

You can set a destination manually using:

zapworks train YOURFILENAME.jpg/png --circumference=..cm --input-height=..cm -o myFolder/target.zpt

Just add the folder you want the image to save to and you should be good to go!

George

Hi, I would also like to know how to play a video curved round a bottle using Studio.

I have successfully trained a curved label image and can preview it using the Beta site and make a simple 3D object appear, that works great. But what I really want to do is make the label “come alive” i.e. like your tutorial video for Designer where you use the first frame of a video as the tracking image then play the video automatically, but curved! Is this possible? If so would appreciate some pointers.

@lucalilli did you manage to get this working?

Andrea

Hi ,
if you look at the Video player sub symbol you will find a plane on that plane it plays the video, i have substituted it with a curved fbx…

Luca

1 Like

Thanks, will give it a go!

Hi @lucalilli ,

Have spent hours trying to get this working but no success! Not sure exactly how to substitute the videoplayer plane for an fbx file - have imported a cylinder fbx into the video player and set its materials to be an MP4 video but this doesn’t work. Are you using a video texture instead? Would you be able to share your project or code to show me a working example? Quite new to all this!
Thanks

Andrea


Hi Andrea, on the show script of the Videoplayer subsymbol.
Luca

Thanks very much that’s really helpful. But when I import an fbx model it is a sub symbol, on your example you have a plane named Etichetta-tonda.fbx. How do I turn my fbx model into a plane? Or am I missing something?

You have to import the fbx into the media library and not as a sub symbol…
Sorry i forgot to take the whole pic to the screen…
Luca

Thanks for your help

Hi George, Im trying to train a curved image in Mac for Zapworks Studio. I already installed Zapworks CLI and also Universal AR SDK. When I try train the image it shows this error and I am not able to find the reason. Can you help me?

1 Like

Hi!

I have some trouble!..please let me know what i can do!

Hi chrisvalear,

Please contact our support team here with more details of the issue.

Cheers,
Dapo

Hi,
When I try to train my image, this happens. Is there something obvious that I’m missing?