A Virtual 3D Art Gallery using three.js

<aside> 👉 Visit Site

</aside>

The Vision

The vision for the project was quite simple yet technologically challenging. We had to come up with a virtual gallery experience as the people weren’t able to attend the physical galleries. We took on the challenges and started the research, what came next was quite fascinating.

Kushal-Kahar-Chromomatrix.jpg

Kushal-Kahar-3D-Art-Gallery.webp

My Role

I was responsible for managing the project, coordinate with the relevant team members, and client. Also, designing the whole experience in Figma & Blender. The project was a first attempt in building a 3D environment on web. This is a breakdown of 6 months long project including Branding, Website, Launching & Marketing.

The Insights

None except one

During our research to find virtual galleries we came up with pretty boring and underwhelming projects until one that sparked our attention. It was the Netflix’s Queen Gambit virtual exhibition that caught our attention. We soon took it as our inspiration and started working on few concepts.

Kushal-Kahar-Queen-Gambit.webp

Technology

During the research we soon understood that the tech stack needed some additions. For all the Web GL stuff we narrowed our search to three.js library and for the 3D compositing we planned to use Blender being open source in nature.

Kushal-Kahar-three-js.webp

The Concepts

The layout

We worked with many pre-fabs of museums and galleries but none suited our taste. Eventually we decided to build our own layout that catered our needs. As blender was easy to pick, our skills of modeling grew as well. We finalized couple of layouts and then started working on the paintings placeholders.

Kushal-Kahar-3d-museum-blender.webp

The Textures

As our clients paintings can be molded into different shapes and sizes, we used that to our advantage and created pillars as our focal point to represent the art in a different perspective.

Kushal-Kahar-chromomatrix-texture.webp

The Results

A Virtual Gallery