Creative Dev Three.js 2024

DOS AU MUR

Une expérience web immersive sur la philosophie de l'Attaque des Titans.

Hero

🎯 Le Concept

Transformer une analyse sociologique de l'anime L'Attaque des Titans en une expérience interactive. L'objectif était de briser la barrière entre le spectateur et l'écran en utilisant la 3D pour simuler des dilemmes moraux.

L'utilisateur n'est pas spectateur, il est acteur : il doit physiquement "gratter" la surface pour trouver la vérité et explorer une scène 3D pour choisir son camp.

Rôle

Creative Developer & Front-End

Stack Technique

Three.jsWebGLCanvasJS

Type

Webdocumentaire Immersif

🛠 Challenges Techniques & Solutions

01. L'Effet "Reveal" Fluide

Défi : Créer une intro où l'utilisateur révèle une vidéo d'arrière-plan en déplaçant sa souris, sans lag.

Solution :
  • Algorithme de masquage via l'API Canvas 2D.
  • Utilisation de globalCompositeOperation = 'destination-out'.

02. Immersion 3D & Narration

Défi : Passer d'une interface 2D à une chambre 3D atmosphérique sans coupure brutale.

Solution :
  • Scène interactive avec lumières volumétriques.
  • Système de Raycasting pour détecter les interactions.

03. Caméra Cinématographique

Défi : Guider l'œil de l'utilisateur de manière fluide lors du choix d'une carte.

Solution :
  • Fonction d'interpolation personnalisée (Lerp).
  • La caméra suit une courbe de Bézier fluide.

Projet Suivant

Jeu PHP

Me contacter

✉️
EMAIL nasution.baginda94@gmail.com
📱
(263) 382-8067