Zamów stronę

Augmented Reality z AR.js

Wróć do wpisów
Grudzień 12, 2018

Lubimy testować nowe rozwiązania. Jedną z najciekawszych, ale nadal mało popularnych, technologii jest Augmented Reality, a więc wzbogacenie rzeczywistości o elementy cyfrowe z zastosowaniem np. Googli VR lub obiektywu smartfona. Technologia może znaleźć swoje zastosowanie, np. w oznaczaniu magazynów, dróg dojazdowych, działań marketingowych lub po prostu w branży aplikacji gier.

Sprawdziliśmy w działaniu bibliotekę Open Source o nazwie AR.js.

  1. W pierwszym kroku wejdźcie w link za pomocą smartfona i wyraźcie zgodę na korzystanie z kamery (nie bójcie się, to żadna inwigilacja): tenseapp.pl/tense_3d
  2. W kolejnym kroku skierujcie kamerę swojego telefonu na poniższy symbol:

Marker

Efekt, który właśnie udało Ci się zobaczyć wykorzystuje:

  1. https://jeromeetienne.github.io/AR.js/ – biblioteka Java Script
  2. https://github.com/aframevr/aframe/ – biblioteka do 3D
  3. https://jeromeetienne.github.io/AR.js/three.js/examples/marker-training/examples/generator.html – generator markerów

Model 3D naszego logo wykonaliśmy w Blenderze na podstawie pliku SVG.

Zaawansowane zastosowanie technologii tego typu pokazuje Google na przykładzie gry:

Spodobało Ci się? Może masz pomysł na ciekawe zastosowanie tej technologii w praktyce?

Za wspólne testy dziękuję Jakubowi Malczewskiemu :)

Wojciech Popiela
Wojciech Popiela
Project Manager i developer z ośmioletnim stażem. Doświadczenie zdobywał przy realizacji dużych projektów aplikacji internetowych. W TenseApp! czuwa nad jakością wdrożeń i rozwojem usługi jako członek zarządu.
Komentarze