Aurel's Grand Theater

2025

"Aurel’s Grand Theater" is an unconventional portfolio where you can read the case studies, solve mysteries to unlock the secret page or explore freely the theater, jump around & even smash things! Keep your eyes open, you might see some of the many hidden details about my projects or myself! 🦝

Cinematic Page Transition

Inspired by techniques from the film industry, the transitions between the 3D game and the more traditionally structured case study pages were carefully crafted to feel seamless and cinematic. Without these custom transitions, moving from the immersive, real-time 3D environment of the game to a conventional web layout would have felt abrupt and jarring, like jumping between two entirely different worlds. To avoid this kind of basic, hard-cut page transition, I implemented a fluid, animated bridge that softens the shift between contexts. This approach maintains narrative and emotional continuity, preserving immersion while guiding the users naturally from one experience to the next.

Audio & SFX

Aside from the music and in-game sound effects such as footsteps for walking and running, the sound of objects falling and chests opening, SFX has also been integrated to enhance various UI animations. These include subtle yet impactful sounds accompanying the tearing of tickets, the dynamic reveal of titles, the interaction with game buttons, and the satisfying audio cues that follow when a mystery is solved. This layered use of audio helps bring the game world to life, making both gameplay and navigation feel more immersive and responsive.

Tutorial

To help first-time users to get comfortable with the controls, paw prints appear on the floor to guide the player on where to go next. Starting from the orchestra pit, users learn how to move around, jump, and push objects. Once they reach the stage, they are next to the menu, which they can explore, or they can continue following the paw prints to learn how to open the case studies.

The bird also plays a playful role, teasing the user to follow him from the orchestra pit, to the menu, to the case studies, and finally into the game.

Performance

With over 100 models and approximately 150 physics items loaded in the main scene, Aurel’s Grand Theater required performance-minded coding from the start. Aside from low-poly models and all the classic tricks, instanced meshes were used extensively for all small reusable items, even those with physics.

The frame rate was capped at 60, 30, or 10 FPS, depending on how often logic/items required updates without hurting the visual quality. Some items only update at strategic moments to ease the load on the user’s machine.

Many other small tricks exist under the hood, some targeting lower-tier machines, others aimed at mobile performance. These include design patterns like singletons, conditional logic throttling, selective animation playback, and optimized asset loading (e.g., reduced texture and model resolutions based on device type).