Exploring Extended Reality.

This is a collection of personal AR projects that I've built for learning purposes. They all have distinct looks, but they are experiments and exploration of how to use AR in a functional way.

My main goal was to build a simple project while learning about Google's Model Viewer web component, which allows you to easily implement 3D objects in web and AR. I also wanted to learn about different implementations on both iOS and Android.

One of the challenges was to learn this new technology (new to me that is 😁). I've used ThreeJS in the past and for a newcomer, the library might be a little overwhelming. That is not the case with Google's Object Viewer and 8th Wall.

Some of my initial questions were:

  • Do I need to add interactivity on the web?
  • Do I need to add a “View AR button”?
  • If so, how do I access the device's camera?
  • What kind of 3D models does it support?
  • Does it support animations?
  • And a bunch of other questions.

The great thing is that Google and Niantic provide very robust API documentation and examples.

My approach was simple: I started by visiting websites that currently use some kind of 3D view or AR feature. After reading Google's and Niantic’s documentation, I found that you need a few things to make this work:

  • HTML, CSS, and JavaScript knowledge.
  • A 3D modeling application to model and texture. In this case, I used Cinema 4D, Blender, Gestaltor.
  • The assets also have file size limits, so I used Draco to compress my files.
  • The ability to export a GLTF file.

What if you were able to experience an advertisement? I don’t mean just view it or hear it, but be a part of an adventure that a brand is inviting you to join.

It would open a portal to another world.

Team: Oz DeLeon, Art Director | Oz DeLeon, AR Designer.