Unbearably cute networking with AR
What’re AR Filters & WebAR?
They are immersive solutions for Atlassian’s offline event built using SparkAR, WebAR, and JavaScript technologies. Masks with a gummy bear and WebAR portal were used to create an interactive environment for the event attendees.
Client’s Wants & Needs
An Immersive Solution for an Offline Corporate Event
Atlassian needed something extra for an offline corporate event it was planning. So they came to WE/AR Studio in search of an immersive solution.
Fun, Networking, and More Fun
The company wanted the product to create an interactive environment for people that attended the event. The purpose of this was to prevent the guests from becoming bored before the main event began.
Improving Brand Awareness
The product was also required to provide participants with an insight into the brand’s identity. This would then create a better connection between the company and its employees.
Bringing Gummy Bears into the Corporate World
To achieve its goal, the company gave WE/AR Studio a mascot for the event — a gummy bear. What roles did the gummy bears play? Did they have any superpowers? The WE/AR Studio team took Atlassian’s ideas and brought them to life in the cutest way possible.
How WE/AR Studio Did It
1. Client’s Needs
The successful execution of the project would have been impossible without a clear understanding of Atlassian’s goals. Even when plans had to be changed due to the lockdown, WE/AR Studio remained in touch with the company’s team to find a suitable solution.
2. Creating Masks with SparkAR
WE/AR Studio designed the Atlassian masks using Spark AR Studio. The SparkAR Studio is a platform that allows users to develop AR effects for mobile cameras. However, this technology is updated frequently (sometimes even weekly), so WE/AR Studio had to put in more effort to keep up with the updates and level up our expertise.
WE/AR Studio’s first idea was to create an ‘inverse’ mask. The AR experience was to be activated by the rear camera of smartphones rather than front cameras.
Once the experience began, a gummy bear would appear on the shoulder of the person in the camera. The person would then try to win a guessing name known as ‘Tap the Bear’.
A participant wins by guessing the shoulder the bear is sitting on correctly. But since shoulders couldn’t be tracked, users were to position the gummy bears by adjusting their phone’s angle.
3. WebAR Portal
WE/AR Studio designed a portal that users can go through to enter a 360-degree video using WebAR technology. Also known as web-based augmented reality, this technology allows users to share AR experiences through their browsers. Hence, no application has to be installed.
WE/AR Studio faced two challenges at this stage. First, the animated doors had to be built using JavaScript. They don’t have much expertise with this technology since they mostly use Unity for their projects. Luckily, they had an expert on the team who got the job done.
Another issue WE/AR Studio encountered was that Atlassian wanted high-resolution videos which were too large to support WebAR technology. As a result, they had to utilize the optimal video codec and the file size to satisfy the client’s needs.
4. Adapting to Lockdown
Unfortunately, the offline event had to be canceled due to the lockdown. So, WE/AR Studio had to develop solo experiences for the participants.
The gummy bears remain on the shoulders of the users, but this time, they have a superpower. They shoot beams out of their bellies, and when the users click on them, they move along with the company’s logo.
Additionally, the speed of the beam increases with every click (up to four or five times before starting over). Atlassian designed the custom background used in the filter.
Sounds very interesting, right? But that’s not the end of the fun. WE/AR Studio created another filter that utilized head tracking for a game!
In this game, users are required to collect letters by flying rockets over them. The rockets fly as the users tilt their heads left and right. A point is rewarded for each letter a user collects, and the game continues until there is an unsuccessful flight.
5. Testing Process
Before presenting the final product to WE/AR Studio’s client, they carried out several quality tests. The importance of this test was to ensure that it performs smoothly and meets all the requirements of their clients.
Challenges That WE/AR Studio Overcame
Identifying the initial goals of our client
Adjusting our solution to the reality of lockdown
Creating high-resolution videos with optimal video codec
Designing the animated doors using JavaScript
Playing with materials and shades of the portal to make them look real
Project Results
Despite the challenges WE/AR Studio faced during the execution of this project, they managed to exceed Atlassian’s expectations. The numbers speak for themselves:
4000+
WebAR activations
800+
masks activations
Thanks to the success of this project, WE/AR Studio have been rewarded with the opportunity to work with Atlassian again
COMPANY: WE/AR Studio
