The Creative Pass Watch all courses for just $12/month

Dec 17, 2025

Case Study - Orage

Case Study - Orage

A Modular, System-Driven Digital Identity Rooted in Code and Control

A behind-the-scenes look at how system aesthetics, data-driven visual logic, and a custom WebGL canvas-masking engine shaped a new digital identity for Orage Studio.

Context

Orage Studio is a high-end VFX and 3D production studio, creating striking visual worlds through cutting-edge techniques and bold artistic thinking. Their work blends advanced technical workflows with creative intuition, resulting in innovative films and digital experiences.

They needed more than a simple portfolio, they wanted a platform that reflected their identity as a tech-driven creative engine, mixing precision and imagination through a visual language inspired by data visualization, retro terminals, and system logic.

The goal: build a website that behaves like a living tool, modular, dynamic, and engineered.

The Vision

We set out to create an experience that felt inventive, immersive, and deeply tied to their craft. As an emerging studio with strong technical expertise, Orage needed a website that felt like an extension of their production tools, a digital equivalent of their VFX pipelines.

Creative Direction

The art direction blends the aesthetic of old computer terminals (monospace type, blinking cursors, command-line rhythm) with elements inspired by new media art, such as point tracking, surveillance-style windows, and controlled glitch behavior.

The result: a hybrid identity that feels both nostalgic and forward-thinking.

The Modular WebGL Homepage

The homepage is built around a modular WebGL grid, acting as the heart of the system.

Each tile is a dynamic canvas masking video fragments, creating a living patchwork of motion controlled through shaders and time-based offsets. The grid behaves like a unified engine:

  • cells flicker like data packets
  • video tiles sync and desync in rhythmic pattern
  • drag & drop interaction

It feels less like an animation and more like a responsive visual operating system.

The Modular Menu

To stay consistent with the system logic, the menu is fully modular. It adapts based on the page, revealing more or fewer details as needed.

A drag-and-drop interaction lets users reposition the menu anywhere, turning navigation into a customizable interface component.

Grid projects - Card & List

To showcase a large and growing body of work, we designed a dual project display system.

The visual card grid offers a cinematic overview, with thumbnails behaving like modular tiles. On hover, each card reveals masked video fragments, giving a quick sense of motion and atmosphere.

The terminal-inspired list view provides a more data-driven way to navigate projects, compact rows, monospaced type, and a layout optimized for scanning large volumes of references.

This two-mode system lets users browse either visually or analytically, striking a balance between creative impact and technical clarity.

Loader

The loader mimics a system boot sequence.

A grid compiles, cells initialize, the Orage “signature” appears like a terminal authentication badge. It introduces the user to the system’s logic before the interface even loads.

Technology

CMS

– WordPress as a flexible backend with custom fields structured like modules

Front-End

– GSAP for micro-interaction timing
– Taxi.js for view-based transitions
– Lenis for smooth, controlled scrolling
– Three.js for the homepage grid masking system, with canvas textures
for dynamic visual behavior

Outcome

The final experience is not simply a website, it’s a designed environment, a controlled system that mirrors Orage’s methodology. Technical yet atmospheric, engineered yet emotional, it gives visitors the sense of interacting with a digital instrument rather than a portfolio.

About Beaucoup

Beaucoup is a digital design studio based in France, working at the intersection of design, technology, and motion. We build immersive digital systems where structure meets emotion; helping brands express the depth, precision, and personality behind their craft.

We believe digital experiences should feel intentional, engineered, and alive, revealing the essence of a brand through the precision of the interface.

Unforgettable interactions start with a spark; sometimes as simple as a keystroke.

Beaucoup - Instagram - Linkedin - X/Twitter