Image tracking alternative


Hi. I have an image, with a qr code at the top right corner. What I want to happen is that the qr code is scanned (it’s a trigger on the zap project), and my image appears based on the overall image.

The problem is that this is all happening on the screen, and I think the light of the screen makes the tracking image not stable. My appearing image just shakes constantly.

I would do without the “image tracking”, but thematically it is tied together. additionall, the image won’t disappear (target state notseen) , which isn’t good.

So can someone help me improve a tracking image that is on the computer screen? Or is there an expiry I can do to let the AR image dissapear after ten seconds?


Hi @gittel828,

I hope you are well! There are a few things I can suggest that could help you on your journey.

Firstly, it’s a great idea to make sure that your target aligns with our tracking image best practices here if you haven’t already. The usual culprits in this regard are images not having a standard aspect ratio (or a width/height with an odd number), not having enough contrast/a lot of blank spaces or having too much of a repetitive pattern. It might be helpful to view your image in black and white/greyscale occasionally so you can see roughly what our vision is looking at when it’s sourcing a target.

In regards to your image not disappearing, are you using a modified version of the Image Tracking template? By default, this template’s content should hide when it doesn’t see the image by reducing the colour alpha value to 0. You can set this behaviour yourself on elements of your choosing as well - here’s some information about that in case anybody is wondering how.

You can also set content relative to the screen if you decide to remove the tracking feature. Here’s some information about what this means and how you can use the co-ordinate system.

As for showing the image and then hiding it after some time, this is certainly possible with the Z.After() function - here’s the documentation for that. You could create a function to hide the image and then call it after 10000ms (10 seconds). It would look something like this:

function hideImage(){
    // Use pure script or insert states for intended behaviour
// Call the function hideImage after 10000ms (10 seconds)
Z.after(10000, hideImage);

Hopefully that was helpful!

Have a lovely day,
Francesca :blush: