Experience overview 📖

This experience is a modified version of the AR games: hunt and destroy all elements in time limit. The user, once he finds a game point, has a mission: to hunt as many elements as possible in increasing order. In the same way as in the case of the logo hunt, where the objective is to complete a mission in a limited time, and obtain as many points as possible, this type of dynamics can offer different types of user interactions in environments such as music festivals, marketing campaigns associated with events, store openings, loyalty dynamics in leisure and shopping centers, etc. 

These types of experiences use a fairly simple AR mode, which is to place elements around the user, using sensors such as the gyroscope to position the elements in their immediate environment, performing rotation or movement movements, thus making it difficult to find the content to hunt. 

In this example the user has a configurable time limit (initially 60 seconds), to hunt the 10 elements that appear, in increasing order. For each correct element, points will be added, and if the order is wrong, points will be subtracted. Extra points can also be obtained for each second the user has left over when the game ends.

Visualize this experience

Scan the QR code and hold your device pointing to the marker.

experience QR code

Visualize this experience

Scan the QR code and enjoy the AR experience.

Uses and benefits 🌱

As mentioned in the initial version of logo hunting, this type of dynamics can help to generate gamification and loyalty programs in different environments, creating games that can last from a few days (advertising campaigns or festivals), to a long period of time (games where the user can evolve, acquiring more and more notoriety, and more appealing prizes).

As already mentioned, this type of experience can work very well connected with larger systems where there are missions and rewards, such as scavenger hunts or treasure hunts. In this type of project, more external elements can be added to the AR, which help to create a 360 experience:

  • New user registration system: customer acquisition. 
  • Scoring system: engagement, retention, loyalty.
  • Access to prizes and other types of benefits: brand image, customer relationship, reward systems.

Features and tips💡

In this case a dynamic has been made in Onirix using the most complex customization elements of the tool in addition to the Onirix Studio scene editor: Online code editor and Embed SDK for web AR. With these components you can go to a higher level of complexity, thus accessing the web programming component developed by Onirix with its SDK for JavaScript. We also rely on more common elements of this type of experiences: scene editor, audios, and events and interactions.

Code editor: HTML, CSS and JavaScript.

Within this type of experience, a game structure has been created, which the user can modify as he/she wishes. In this structure we can see an OnirixGame class, which has a series of callbacks: onStart, onTimeChange, onGameEnd, onScoreChange

By copying this experience you will be able to analyze the code in detail, seeing how we shape the whole game, and its changes in the user interface, through the different events that happen in the AR scene.

In addition, thanks to the code editor we can add different elements of the UI of the game relevant to this type of dynamics:

  • Onboarding: initial tips screen to explain the dynamics of the game.
  • Scoring: top menu where we show the status of the game (number of logos that have been hunted so far, for example).
  • Timer: game seconds indicator (the remaining seconds or those that are passing).
  • Final screen: at the end of each game a summary screen is shown with the score obtained.

Access the online code editor documentation.

Embed SDK for webAR in JavaScript

As discussed in the previous section, a game structure has been created within Onirix, which the user can modify to generate their own versions. In addition, access to the Onirix SDK is provided, where it is possible to subscribe to various events and thereby modify different parts of the AR scene.

In the case of the game in question the following events are programmed to manipulate interactions with the scene:

  • EmbedSDK.Events.SCENE_LOAD_END: the scene full load event is used to start the game and thus leave the initial user interface ready with all its components.
  • EmbedSDK.Events.ELEMENT_CLICK: this event allows to manipulate the click on each of the elements of the scene, and therefore to program the activation of the destruction animation of each element, as well as the disappearance of them. It is also the entry point to the addition of new points in the game and the evolution of the game.

Access the complete embed SDK documentation.

Events & interactions

Apart from the programming of the game itself, the scene starts with all the AR content included in it, i.e., all the logos to be hunted are already available in the scene. In this case, the experience starts with a fixed rotating logo, which when clicked “launches” the game dynamics. A total of 10 numeric elements appear floating around the user, with different movements. All these contents and their movements are included in the scene editor, with different associated events:

  • 10 3D logos grouped in 2 “orbital” collections in the scene. 10 3D models with destruction animations for each of the 3D elements.
  • The 2 collections start disabled (hidden) and when clicking on the start logo they are shown to the user.
  • In addition, rotation events are triggered for the 2 orbitals, with different speeds and turns in various axes, thus achieving the desired effect.

For more information see the documentation on events and interaction.

Sounds and effects

Also included as part of this experience are sounds that make the dynamics take on a greater level of immersion. 

  • A videogame-like background music is included, which plays throughout the experience. 
  • In addition, a destruction type sound effect is added, every time an element is clicked on, giving a more realistic feeling to the user.

For more information see our documentation on sounds and effects.

Surface scene: gyroscope tracking and autoload.

In this kind of experience where it is not necessary to have any kind of concrete marker (neither an image, nor a specific surface), the use of an AR mode in which the phone’s gyroscope is the most effective way. The scene is loaded using a Surface-like scene feature: autoload. With this the user does not have to make any decision where to place the content, it simply appears in front of them and they can start interacting with the content. The advantage of this type of scenes is that they can be placed anywhere, indoors or outdoors, and do not require any physical reference for proper consumption.