How To Create your Own Marker ?
Most of AR.js demos use the Hiro marker. It is nice but people often want to personalise the marker. For example, they may want to use their avatar or their logo. They want to make it more suitable for their own usage. So I wrote a tool to create new markers in 3 easy steps.
- Upload your image — the one that appears inside the black boundary.
- Download the trained marker — and use it in your AR experience.
- Download the marker image — to print it.
It is very simple! Let’s get started.
Step 1 — Upload Your Image
First you upload an inner image. This is the image that you want to appear inside the black square of the marker.
Step 2— Download the Trained Marker
Then you download the trained marker by clicking on the download button. You will need to add it to your code, thus it is aware of this new marker.
Step 3— Get The Marker Image
Finally, you can either right click the marker image and “save image as” to your computer, or you can export it to PDF and print it on paper. Your call ;)
Step 4— Include it in your Code
This file contains the encoded marker that you should reuse in your code. You specify you want a pattern marker and you provide the url to your own marker. So just replace this in your code.
The End 😄
That was easy right?
For further details on what are the characteristics of a good marker, read more here.
Thanks for reading, and if you like this post, don’t forget to share 😉