gran

active

development for sites

Digital Agency

How it works

Augmented reality for web

01
Development of 3D objects and scenarios for interacting with them
02
Animation and programming interactions with 3D objects
03
Creating a web page and placing a WebAR object on it
04
A customer sees a link or a QR code on the website or in an advertisement
05
The user goes to the page and gives it access to the phone's camera
06
Magic! An interactive object (product, character, etc.) appears next to the user in the space

Features & Benefits

AR for web

The user only needs a browser

To see augmented reality elements, the user does not need to download any additional applications. It just opens a page in Chrome or Safari.

Absolutely new way to interact with the user

On the site page, the user can try on sneakers, watches or glasses, see the new layout in his/her kitchen or bedroom, check out the car's finish, and much more.

Posts with AR get a lot of likes and reposts

People are happy to post about their interaction with AR, as it causes a wow effect. AR improves any advertising campaign.

Gamification increases your sales

The use of game mechanisms and entertaining elements increases sales and customer loyalty, involves them in the purchase process, turning it into a game.

Web AR Cases

Examples of usage by global brands

Interactive printing

Toyota drift

A Toyota dealer placed an AR object with a Toyota Supra GR car in the Road & Track magazine. You can change the color of the car, and it also shows the drift right on the magazine page.

Ecommerce

Corolla constructor

A Toyota dealer created an AR object with a real-size Toyota Corolla that can be parked in a parking lot. The user can change the headlights, sunroof, and alloy wheels.

Promo games

Spiderman on the wall

To promote the animated series The Spider-Verse, an AR object with superheroes was used. Each of the superheroes can climb the wall and jump to the ground. In addition, the user can take a picture with him.

Real estate

Miller Lite Piper

If the user points the phone's camera at a Miller Lite beer can, a character appears out of it: he is playing the pipe, dancing, and performing tricks with a snake.

Our experience

Portfolio

AR tank for Men’s Day

This project was made for Men’s Day (February, 23). Augmented reality is launched after scanning the QR code. When you point the camera at the image on the mug, a toy tank appears. Its cannon can be controlled with buttons to aim and then fire, exploding fireworks.

AR clown for the candy brand Ricolino

The clown is the main symbol of the company. The idea of the project is that a person scans the QR code that is located on an advertising poster for sweets. After that, the camera opens and the clown appears in augmented reality, after the animation he calls to download the application of the company.

AR bear for Ozuna's song promotion

Augmented reality was uploaded to the site caramelo-ozuna.com. When users visit the website, AR-bear appears next to them, dancing to the music. Then users can take a photo with the bear and share this photo on Instagram.

AR game for book

The AR object was placed on a book page. The game begins when the camera is pointed at the graphic mark. After the end of the game, the user has the opportunity to save the results on the site.

Trying on a helmet in AR

Using the phone's selfie camera, the user can try on a branded space helmet. After this he can take a photo and share it on Instagram.

AR fortune cup

To see the prediction, a person goes to the site and then points the camera at the cup. The image on the mug triggers a 3D animation, and after clicking the button, it shows the user a random prediction.

AR map of company's branches

The AR object was placed on a book page. It launches when the camera is pointed at the graphic mark. AR object is an interactive 3D map with pins. When the user clicks on a pin, detailed information about the corresponding branch appears: statistics, a photo gallery, and a detailed map.

AR report for shareholders

The AR object was placed on a book page. It launches when the camera is pointed at the graphic mark. Augmented reality is an interactive 3D chip with buttons and a screen. When the button is clicked, the corresponding animation and video fragment is launched.

Captain Morgan

The user scans the QR code and gets into augmented reality. After confirming the age of majority, the user has to do the scavenger hunt: hack the secret code of the safe. When the safe is opened, a luxurious bottle of Captain Morgan rum appears inside of it, followed by an advertising screen with a video of the brand.

Technologies

WebGL
8th wall
A-Frame
three.js
AR.js
PlayCanvas
Blender
HTML5+CSS3+JS
3DS Max