À propos de ce portfolio

Pourquoi ce portfolio

Ce projet a commencé comme un moyen de construire quelque chose de vraiment intéressant plutôt qu'une page statique. Les objectifs : explorer des technologies que je n'avais pas encore utilisées dans un vrai projet, créer un portfolio qui reflète vraiment ma façon de travailler, et expérimenter le développement assisté par IA avec des agents pour la génération de code et l'itération.


Comment ça fonctionne

Naviguer avec le gizmo

Le cube en haut à gauche est un gizmo d'orientation 3D. Cliquez sur une face pour basculer vers la section correspondante. Une transition iris joue entre les vues.

Déplacer votre cube

Cliquez n'importe où sur le sol pour faire sauter votre cube rouge vers ce point. Cliquer en l'air met la destination suivante en file. Les objets bloquent l'atterrissage : une croix rouge indique l'obstacle.

Interagir avec les cubes

Approchez-vous d'un cube non-mobile et cliquez dessus pour ouvrir son panneau de contenu. Si vous êtes trop loin, un message vous le signale. Chaque cube correspond à une section du portfolio.

Mini-jeu (face arrière)

Passez sur la face arrière pour accéder au mini-jeu. Une barre de vie et une barre de mana apparaissent en bas à gauche. Cliquez sur Start Game pour faire apparaître des ennemis. Clic droit ou Espace pour tirer, en dépensant de la mana. Des orbes de mana apparaissent autour de vous à collecter.

Langue

Le bouton FR / EN en haut à gauche bascule la langue dans tous les panneaux et les étiquettes de la scène.


Stack technique

Three.js / WebGLScène 3D, objets, lumières, caméra
React + TypeScriptInterface, panneaux, HUD, état
FastAPI (Python)API REST — objets de scène, livres, positions
PostgreSQLStockage persistant de l'état de la scène
Docker + nginxDéploiement conteneurisé, proxy inverse
AnubisProtection anti-bot devant nginx

← Fermer pour revenir à la scène 3D.