Chillbase: a Fast 3D Careers Website for a Gamedev Studio

Chillbase is a game development studio with a strong identity and an eye for detail. The goal was to create a careers website that truly helps the team hire — one that quickly communicates who they are, what they do, how their process works, and what a candidate should do next. We combined a showcase of the studio’s projects and culture with a clear, transparent path to application. Design and development worked as one team, ensuring every solution stayed consistent — from idea to implementation.
 

Chillbase is actively growing and competing for the attention of top specialists. That’s why the website focuses not on loud slogans, but on clarity and structure. In just a few minutes, visitors can get a sense of the studio and decide whether they want to move forward. Our aim was to build a technological 3D website without pretension — one that genuinely supports the HR funnel and helps the brand connect with people.

The visual language is built around particles — they form images ranging from the studio’s logo to the silhouette of a developer at a computer. The animation lives in the background layer, setting the mood without overshadowing the content.

The particle field subtly responds to cursor movement (and on touch devices, to scrolling and gestures). This gentle drift and dispersion create a sense of liveliness while keeping the focus on reading and interaction.

We maintained a balance between technology and simplicity: clean typography, concise copy, consistent card patterns, and clear calls to action. Each section of the site is designed as part of a seamless journey — from the studio overview to projects, roles, hiring process, and application.

Page transitions are cinematic yet restrained: particles scatter and reassemble smoothly, keeping users oriented and engaged. The result is a modern gamedev studio website — dynamic in a gamer’s way, yet friendly, accessible, and easy to navigate.

The design was delivered as a Blender scene built with geometry nodes, and we translated its logic into the Three.js Shading Language (TSL) — essentially a node-based system for defining behavior. This was our first production project using WebGPU and TSL. The WebGPU-first approach, with a fallback to WebGL2, provided a single codebase with strong modularity and reusable nodes.

All particle movement is computed using WebGPU compute shaders; where only WebGL2 is available, we use Transform Feedback to achieve a similar effect. This allows us to maintain both the concept and the fluid motion across different environments.

Morphing between models was linked to scrolling, with additional interaction responding to cursor movement. The same shader can generate particle clouds from either 3D model vertices or image pixels — a flexible approach that works well across multiple scenes. During production, the system evolved from about 25,000 particles to over 41,000, and on the Career page, we displayed five full-size characters accompanied by a moving camera and a glowing “spark” that follows the user’s journey. The total vertex count increased to roughly 81,000, and while WebGPU handled the load confidently, WebGL required slight optimization — we simplified some vertex shader calculations (notably curl-noise), restoring smoothness without compromising the original motion style.

To ensure 3D performance never interfered with the interface, we moved three.js into a Web Worker, where heavy computations run in a separate thread, keeping the main thread responsive. The canvas was placed outside the routing scope, so the 3D scene persists between pages — making page transitions on three.js look natural and seamless.

Visual quality automatically adapts to the user’s device: with WebGPU support, users experience the full visual fidelity; otherwise, they see a simplified yet stylistically consistent version. The result is a three.js website that achieves rich visual effects without sacrificing UX or speed.

After launch, we saw higher engagement in the careers section and a shorter time to first interaction. The key achievement is a precise balance between the visible and the invisible: 3D animation creates a recognizable brand atmosphere without disrupting reading or applications. Performance remains stable across typical devices, and navigation feels consistently smooth.

The TSL/WebGPU architecture is designed to scale — new scenes, visuals, and special projects can be added without rewriting the core. As a result, this isn’t just a visually impressive three.js website, but a functional employer branding tool that helps the studio attract talent and communicate its culture.

If you’re looking for a technologically advanced yet lightweight 3D website — built on three.js/WebGPU, optimized for PageSpeed, and designed with clear UX logic — we’d love to talk. Let’s discuss your goals and find a production-ready solution that’s fast, elegant, and true to your brand.

Why would a brand or studio need a website with 3D?
3D helps express a brand’s character, stand out, and create a memorable first impression. When animation carries meaning — as in our Chillbase project — it doesn’t distract; it enhances perception and emotion.

Why are three.js and WebGPU more than just “technology for technology’s sake”?
They bring a sense of modernity and craftsmanship without overloading the user. For visitors, it’s smooth, interactive motion that feels effortless; for the brand, it’s a signal of innovation and technical excellence.

Can you make a 3D website that doesn’t slow down or frustrate users?
Absolutely. By moving rendering to a separate thread, adapting visuals to each device, and keeping scenes lightweight, even a feature-rich three.js website can be fast, stable, and intuitive.

How can you tell if this approach fits your brand?
If your website should act as both a presentation and an engagement tool — yes. When your goal is conversion, hiring, or strengthening your employer brand, a well-designed 3D experience can significantly boost results.