# Image Tracking Specifications

## Overview

### Scene

* **AR Scene: Image AR**
* **Collection: Image AR**

### What is Image Tracking?&#x20;

Image tracking, in full, refers to Image Detection and Tracking (i.e., an Image AR scenario).

It consists of two components:

* Image Detection
* Image Tracking<br>

To evaluate the quality of the experience, both factors must be considered:

* Whether image detection is fast enough
* Whether the AR scene remains stable after detection

> ![](https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2Fb42A3k76QXpR57RHdlt5%2F38-1.gif?alt=media\&token=2ac1e270-18c3-40fe-b453-298c66ad4cd1)![](https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2F14pRLJWhKcgpfJRGJpCO%2F38-2.gif?alt=media\&token=84d26d80-ea94-4c03-a8ad-63318eb118fe)
>
> When using the Collection feature (multi-scene recognition entry), the cloud-based image recognition algorithm will be used.
>
> Therefore, the recognition images must comply with both the Image Tracking specifications and the Cloud Recognition Image specifications.

***

## Guidelines

<table><thead><tr><th width="164.58984375">Category</th><th>Descriptions and Examples </th></tr></thead><tbody><tr><td><strong>Valid Format</strong></td><td>jpg, jpeg</td></tr><tr><td><strong>Valid Color Mode</strong></td><td><p>Set the image to RGB to help detect any color deviation promptly.</p><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FHDjqEYgpJ5WeHvDWH9SH%2F34-1.jpg?alt=media&#x26;token=698ed056-72ba-4b6c-a609-560685129d1c" alt=""><figcaption></figcaption></figure></div><p><br>When exporting, check “Color Space → Convert to sRGB”, and verify after export to ensure no color deviation is present.<br></p></td></tr><tr><td><strong>Recommended Image Resolution</strong></td><td><p>The image resolution is recommended to be between 480×480 and 1280×1280, with around 800 being ideal.</p><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FHv4CvgyvpF2mvJgYPTcr%2F34-2.png?alt=media&#x26;token=21925df1-2151-4414-996c-69cc719e55e0" alt=""><figcaption></figcaption></figure></div><p></p></td></tr><tr><td><p></p><p><strong>Recommended Image Aspect Ratio</strong></p></td><td><p>Landscape: 1:1 to 16:9 (Aspect Ratio 1 to 1.78)</p><p>Portrait: 9:16 to 1:1 (Aspect Ratio 0.56 to 1)<br></p><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2F5ckA8qmvZUsXCYKLVzV3%2Fimage%20(4).png?alt=media&#x26;token=5edfd272-fc1a-4f29-8111-fea93de74a9b" alt=""><figcaption></figcaption></figure></div><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FoDsd8aF9Mv6PADEnhG6V%2Fimage%20(5).png?alt=media&#x26;token=d1e49690-7d05-47e2-976f-bd2eca426451" alt=""><figcaption></figcaption></figure><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FkKLlp0TW1qA1xpS8QSNU%2Fimage%20(6).png?alt=media&#x26;token=d5877172-1314-48c6-a2b1-19d676c15913" alt=""><figcaption></figcaption></figure><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FsfxRRqgRh7yTSnevyoXz%2Fimage%20(7).png?alt=media&#x26;token=5451518d-5e60-4990-ba96-ec05e491e796" alt=""><figcaption></figcaption></figure></div><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FtHKhWLh1dS0mVk66QAaD%2F40-1.gif?alt=media&#x26;token=e0145535-3199-458e-bfbb-4830d9fe72b2" alt=""><figcaption></figcaption></figure></div><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FcRD4vQtWLKNCfRdDw23H%2F40-2.gif?alt=media&#x26;token=1479a4f6-ad9e-4c84-8edf-dbaf5e2e46a1" alt=""><figcaption></figcaption></figure></div><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2F7tcWJ2w5yfAq1GW1lRxU%2F40-3.gif?alt=media&#x26;token=276b586f-52df-4103-b4e0-1aca862f71f9" alt=""><figcaption></figcaption></figure></div><p></p></td></tr><tr><td><strong>Rich Detail</strong></td><td><p></p><p>The following are examples of poor-quality images:</p><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FGZwjtoDUcHgitVCNiXbN%2Fimage%20(8).png?alt=media&#x26;token=5a6cab32-908e-435c-872f-0d467c769839" alt=""><figcaption></figcaption></figure><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2Fceik1y1ZLdKZco97XDJN%2Fimage%20(9).png?alt=media&#x26;token=9322f5f6-39d8-4b67-a159-63a696197d48" alt=""><figcaption></figcaption></figure><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FscILDXaoFarRcZEvFKy9%2Fimage%20(10).png?alt=media&#x26;token=dbd80533-fffe-422c-bb00-ef7e0671a2e9" alt=""><figcaption></figcaption></figure><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FuySzsTh03a0TP651WoCq%2F2048.png?alt=media&#x26;token=07f1e48d-43cf-481e-8572-39d7225e680b" alt="" width="375"><figcaption></figcaption></figure></div><p><br></p></td></tr><tr><td><p></p><p><strong>Avoid extensive whitespace</strong></p></td><td><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2F5fClu2goh1AHL9BVm5nB%2Fimage%20(11).png?alt=media&#x26;token=bf326cff-0a62-4dfd-9f47-30b62a9d97d1" alt=""><figcaption></figcaption></figure><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FoJtkdbzprpENbdEADIFF%2Fimage%20(12).png?alt=media&#x26;token=1c919eca-fd12-4e49-b99a-898e3871a71a" alt=""><figcaption></figcaption></figure><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FB2KpbM1IEsbfRn6ruTSQ%2Fimage%20(13).png?alt=media&#x26;token=2fbff743-ae55-493d-9133-c721707fc9ee" alt=""><figcaption></figcaption></figure></div><p></p><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FTIUX7qlnTKqHUx1isPrR%2F41.gif?alt=media&#x26;token=a1f92929-baae-45d1-a1c3-89129e7750fd" alt=""><figcaption></figcaption></figure></div><p></p><p>Too much empty space can reduce tracking stability. Minimize blank regions and ensure the main subject is clearly emphasized.</p></td></tr><tr><td><strong>Avoid repeatitive patterns /</strong> <strong>Symmetrical images</strong></td><td><p>Symmetrical images tend to be unstable:<br><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2F4MRxAzzh6EcdiZw6pnZz%2Fimage%20(14).png?alt=media&#x26;token=fa60b21e-1a79-4aa4-a7da-71ef63ad1dea" alt=""><br><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FAKKsNQPZecZ0kf72cmM8%2F42.gif?alt=media&#x26;token=a22a8595-f7c4-4a04-90f3-7a114abe04ed" alt=""><br></p><p>For images that are not perfectly symmetrical, the final assessment should be based on actual tracking performance.</p><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FAVSMxjW7wCGLUYO9DKJn%2Fimage%20(15).png?alt=media&#x26;token=4d2239c9-9ee7-4acf-ae33-74a803762d3b" alt="" width="375"><figcaption></figcaption></figure></div><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FytYTcinCFhI112JHhU5i%2F43.gif?alt=media&#x26;token=e838fee9-b13a-4584-a4bd-63bd132f8c01" alt=""><figcaption></figcaption></figure></div><p></p><p><br>Repetitive Patterns Can Lead to Detection Difficulties:<br></p><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FiNoNdsePoQWPLASCl864%2Fimage%20(16).png?alt=media&#x26;token=a4dc198d-261b-4458-96a2-9839b47f8a35" alt=""><figcaption></figcaption></figure><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FEXIq8NnwmGtBpwCBCRU8%2Fimage%20(17).png?alt=media&#x26;token=9a90fcab-96f2-47f0-a65c-15d553f20005" alt=""><figcaption></figcaption></figure><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FvwIGOiIPTQ7jCtLmEa1c%2Fimage%20(18).png?alt=media&#x26;token=5b366639-8106-4911-8b60-f9bc1065f592" alt=""><figcaption></figcaption></figure></div></td></tr><tr><td><p></p><p><strong>Uniform Distribution of Feature Points</strong></p></td><td><p>Try to avoid large Single-color region around the borders. <br>Add appropriate details to achieve a more uniform distribution of feature points.<br></p><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2Fe0p1GpoTSuxZqUTn1CID%2Fimage%20(19).png?alt=media&#x26;token=b42f4c99-0ad0-4e45-9ecf-26ca755bcd0d" alt=""><figcaption></figcaption></figure><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FpOvUIdUJrHDlccTSsAQo%2Fimage%20(20).png?alt=media&#x26;token=b14a8be0-f172-4141-bd24-a0185bf19dda" alt=""><figcaption></figcaption></figure></div><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FPAulzYg4Sa4hFbsy679a%2F44-1.gif?alt=media&#x26;token=a7d9d165-e4b4-4f1b-a667-6d6b736935ac" alt=""><figcaption></figcaption></figure></div><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2F3zKHJcbbN2bUJBh3dA1b%2F44-2.gif?alt=media&#x26;token=5b2ef0cb-7a27-47c5-813c-1d5ebc503098" alt=""><figcaption></figcaption></figure></div><p></p></td></tr><tr><td><strong>Cloud Recognition vs Image Tracking</strong></td><td><h4>Different Feature Point Extraction Principles</h4><p><br>As the principles of feature point extraction differ, certain smooth or rounded shapes may receive a low star rating in cloud recognition, yet still perform adequately in image tracking.</p><div><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FJ3RGvT5WhYqMRGLTTNuH%2Fmarker4.jpeg?alt=media&#x26;token=ae00ba71-ed6a-4445-8133-38d477a17616" alt=""><figcaption></figcaption></figure></div><p></p><p>Actual Performance may still jitter. <br><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FxQW4svSoqfoV0K7nLhDH%2F45-1.gif?alt=media&#x26;token=5f695aa8-afbe-4354-a849-be9962c5de59" alt=""><br><br><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FFzpmpERMvJanooKvroNa%2Fimage%20(21).png?alt=media&#x26;token=01c763f7-6069-4379-b35d-6a6dbf4ce4f1" alt=""><br><br><strong>Higher Tolerance for Image Blur:</strong> <br><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FWOabbgfzwIFx0CF5Nx6u%2Fmarker6-1.jpg?alt=media&#x26;token=4ea3a2ce-2742-4bcc-b6c8-ec6d9d9f6ed5" alt=""><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2F7tGPFzeXXeW3Ne5WEY4J%2F45-3.gif?alt=media&#x26;token=a626fc0c-4a68-4f2b-863c-6690db27ae0b" alt=""><br>Even with complex or slightly blurred images, tracking can remain relatively stable</p><p>(This does not encourage using blurred designs, only indicates that the system offers higher tolerance.)</p></td></tr><tr><td><strong>Avoid Gradient Designs</strong></td><td>Avoid using large gradient areas<br><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2Fh1kFFjddJ02fcfnXpdOr%2Fimage%20(22).png?alt=media&#x26;token=539685f7-ca3b-43f3-9af1-49ef1520002a" alt=""></td></tr></tbody></table>

***

## Tips

### How to Improve Image Recognition

**Recommended Practice**

Before uploading an image for recognition, add a white border around it.

If the image will be printed, include a white border on the printed version as well.

<figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FS0xbkl9d2D0AFd7XaOOf%2F46.jpg?alt=media&#x26;token=aa428a79-3a39-492c-8ef3-bd2beb223983" alt=""><figcaption></figcaption></figure>

### Other Methods to Improve Image Tracking Stability

**Place AR objects tightly on the Image marker**

<figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FJJPF31wQN0HCfoVTz4R1%2F47-1.jpg?alt=media&#x26;token=40dfedb6-184c-44c8-a07d-d21c1194cacb" alt=""><figcaption></figcaption></figure>

**The AR scene placed on the Image marker should not be too tall.**

Example: Scanning a wall poster triggers an AR interaction.

<figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FV8HRaH3drXWWe7QkDjGU%2F47-2.jpg?alt=media&#x26;token=56c8856f-cd26-43f3-90f0-67a3f8a5e635" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2F9eWZSZ56grUcbQWY4o4k%2F47-3.jpg?alt=media&#x26;token=d4635eec-6416-47ed-b61f-e9acf996da17" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FZhcwjYeV20yWLdKw8py1%2F47-4.jpg?alt=media&#x26;token=54805af1-dd5d-4355-a36e-54af68e18941" alt=""><figcaption></figcaption></figure>

* Users’ perception of model "shaking" is related to its height: the higher the AR object, the more noticeable the visual displacement at the top becomes.
* Design AR interactions thoughtfully to reduce the amplified shaking effect caused by overly tall layouts.

### **Include animation in the AR experience**

* Rich scene animations can visually dilute the discomfort caused by minor jitter.
* In some cases, even when tracking jitter is present, users may hardly notice it.

<div align="left"><figure><img src="https://1498491008-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MEaYmgB-urx5wwuYcCa%2Fuploads%2FrJDejcUwQCUdpqClQR5Y%2F%E6%8A%96%E5%8A%A8.gif?alt=media&#x26;token=3b8ba877-634f-4c90-a5fb-a2e2d6784c3a" alt="" width="152"><figcaption></figcaption></figure></div>
