AruControl for Construct 3 (free template)

This is a fairly simple Construct 3 example / template which you can use to make games (or anything) that uses video input (like a webcam or other device camera) and detects ArUco markers (their IDs and positions).

The example project does two things: it detects the classic ArUco marker #0 and moves a sprite to its mid-point; if it detects marker #1 or #2 on screen it plays a sound file (one for each).  You can open this page on a second device and scroll to the markers below to try it out (or you can print them out as well):

Code #0

Code #1

Code #2

The project exceeds the Construct 3 free limits, so you'll have to have a subscription. I might add a less readable version which is compatible with the free limits later - if you're interested in that, feel free to add a comment.

I've also added an alternative version (a separate project file, see downloads), which does the same thing, but uses a DrawingCanvas object to display the video and the HTMLElement object is hidden (but still required). This has the advantage that you can display objects on top of the video (he HTMLElement object is always on top in C3 at the moment, that's why its opacity is so low in the original - so you can see other stuff below it).

It's also possible to design your own ArUco fiducial markers and use them in this project (see comments in the source code): I've made a free tool called ArUco Painter that makes this a breeze.

The published project was tested on PC (Firefox, Chromium), Android (Chrome) and iOS (Safari).

If you can't run the project for any reason, check out this video demo:

You can download the source code (C3P project file), which is licensed under the MIT License. Please note that  this project uses the js-aruco2 library by Damiano Falcioni, which is based on the js-aruco library by Juan Mellado - which includes some code from OpenCV. You can find the relevant licenses here.