DJ Tricz - Immersive Digital Experience

Building an Interactive 3D Artist World
My Role
Full Stack Developer
3D Web Development (WebGL)
UX/UI Designer
Product Designer
Teammate
Tools
Three js
Blendar
Spline
Webflow
Figma
HTML
CSS
JavaScript
Timeline
2025
Overview

The DJ Tricz project was designed to reimagine how fans connect with an artist online. The challenge was to build an interactive digital environment that mirrored the DJ’s creative energy — moving beyond a static website into an immersive, story-driven world.

I created a 3D apartment environment where visitors navigate through objects tied to the DJ’s world: vinyls scattered across the floor, decks set up for mixing, and a wall calendar that reveals upcoming events. Each section of the experience was designed as an environment-based navigation point, blending music, visuals, and interactivity into one cohesive journey.

Technically, the project combined Webflow for the main website with Three.js and Blender models for the immersive sections. I built custom interactive elements such as camera transitions (e.g. moving from the DJ desk to the event wall), hover-based interactions for vinyls and crates, and animated scene lighting to reflect different moods. Assets were modelled in Blender and optimised for WebGL performance, while Spline was used to prototype and test spatial interactions quickly.

This project taught me how to merge traditional web design (Webflow CMS) with immersive 3D storytelling, balancing performance constraints with artistic detail. It was also a collaborative exercise with the DJ herself — iterating on visual styling, the atmosphere of the room, and interactive flow to ensure it aligned with her brand and live performance energy.

Ultimately, the DJ Tricz project marked a breakthrough in my portfolio as it blended immersive digital design, technical 3D development, and brand storytelling, creating a living, explorable world instead of a conventional artist site.

Live Project

Problem

DJ Tricz - Immersive Digital Experience

Design Strategy

Technical Approach & System Flow

Registration & Approval

Members begin by registering through a custom-designed Divi form, which is captured by MemberPress. Each submission is held in review, pending admin approval via the New User Approve plugin.

Technical Application

Summary