Deeplocal's
Virtual Office

Deeplocal | 2020
A data driven world that visualizes company activity, achievements and culture.

Due to the onset of COVID-19, my internship at Deeplocal became fully remote and my hours were cut in half. Despite these setbacks, I was eager to prove myself and show off what I can do—so I initiated, led and managed an internal intern project with my fellow interns. In our team of three interns, I took on a role of 3D designer/art director.

In collaboration with Roshan Benefo and Elena Bremner.

How can we keep work culture alive during WFH times?

Challenge

COVID-19 has forced people to think about new and creative ways to continue workplace engagement and maintain a sense of community that is entirely online and physically distant. In the matter of weeks, companies had to depend on digital tools such as Slack and videoconferencing more than ever, and for some accept working from home as the new reality for the foreseeable future.

Strategy

We accessed commonly used wprk platforms like Slack, and 15-Five to trigger playful animations in a virtual replica of the Deeplocal office. By simulating company culture through curated colors, style and motion, the goal was to create a visual aid and shared experience that helps bring back the office energy that has been lost during lockdowns in the age of the Covid pandemic.

Log in to view
With data collection comes privacy. Any feature polling private company information will only be accessible to Deeplocal employees through their gmail login.
UX Controls
A top navigation bar instructs users how to interact with the model, and an info button tells users a bit more background info about the project.
Explore to discover
Both internal staff and external public visitors can hover over objects to uncover hidden easter eggs to learn more about Deeplocal's culture, history and values.
Real time ainimations
Since all these data driven animations happen in real time, to review past activity, employees can use the timeline to see what happened throughout the day.
Who's online?
Company activity is represented through slack enabled windows. The front windows turn on and off throughout the day to display the percentage of employees active on slack.
highlight achievements
When employees receive “high fives” on Slack, their names are projected on a flying banner to celebrate their achievements and hard work.


Process

3D assets modeled and animated with 3ds Max and Blender, and were exported as GLB files, which is a binary format representation of 3D models, making it easier to implement in javascript. Data was polled through the company Slack API to access online activity through messages and checking user status. The 3D assets and data came together in WebGL rendered in Three.js

UX Blueprint
View the process book below