VoxelCraft - Documentation Technique

Guide pour etudiants en informatique : stack, architecture, et panorama du developpement de jeux video

Sommaire
Partie 1 : Stack technique de VoxelCraft Architecture du moteur Competences techniques mobilisees Partie 2 : Panorama du developpement de jeux Types de jeux et leurs stacks Plateformes cibles Matrice Jeu x Plateforme x Stack Environnements et outils

Partie 1 : Stack Technique de VoxelCraft

VoxelCraft est un clone de Minecraft jouable dans le navigateur, construit sans aucun asset externe (zero images, zero sons, zero modeles 3D). Tout est genere proceduralement au runtime.

28
Builds
0
Assets externes
~50
Fichiers source
7000+
Lignes TypeScript
60
FPS cible
21
Types de blocs
5
Biomes
1
Dep. runtime

Stack choisie

CoucheTechnologiePourquoi ce choix
Langage TypeScript (strict mode) Typage statique pour une architecture modulaire. Detecte les bugs a la compilation. IntelliSense dans l'IDE.
Rendu 3D Three.js Seule dependance runtime. Abstraction WebGL mature, acces bas niveau aux shaders, BufferGeometry, post-processing. Pas React Three Fiber (overhead inutile pour du voxel).
Bundler Vite HMR instantane, ES modules natifs, build rapide. Zero configuration pour TypeScript.
Shaders GLSL (via ShaderMaterial) Shaders custom pour l'AO, le fog, le tiling UV, la casse progressive, l'eau animee. Controle total du pipeline GPU.
Audio Web Audio API Synthese sonore procedurale (oscillateurs, noise buffers, filtres). Musique generative. Zero fichiers audio.
Textures Canvas 2D API Generation pixel-par-pixel de toutes les textures (16x16) au lancement. Atlas texture unique.
Persistance IndexedDB Sauvegarde des chunks modifies et etat du joueur. Async, pas de limite de taille pratique.
UI DOM + CSS HUD, menus, overlays en HTML/CSS pur. Pas de framework UI (overhead inutile). Manipulation DOM minimale.

Architecture du moteur

┌─────────────────┐ │ Engine.ts │ Game loop orchestrator │ (60fps loop) │ └──────┬──────────┘ ┌───────────────┼───────────────────┐ ▼ ▼ ▼ ┌──────────┐ ┌──────────┐ ┌──────────┐ │ Input │ │ Player │ │ Rendering│ │ Manager │ │Controller│ │ Pipeline │ └──────────┘ └────┬─────┘ └────┬─────┘ │ │ ┌──────────┼──────┐ ┌───────┼────────┐ ▼ ▼ ▼ ▼ ▼ ▼ ┌────────┐ ┌────────┐ ┌─────────┐ ┌──────┐ ┌──────┐ │Physics │ │ Block │ │Chunk │ │ Sky │ │Post │ │AABB │ │Interact│ │Manager │ │Clouds│ │Proc │ │Raycast │ │ │ │WorldGen │ │ │ │Bloom │ └────────┘ └────────┘ └────┬────┘ └──────┘ └──────┘ │ ┌─────┼─────┐ ▼ ▼ ▼ ┌───────┐┌─────┐┌───────┐ │Greedy ││ AO ││Chunk │ │Mesher ││ ││ Mesh │ └───────┘└─────┘└───────┘ ┌────────────┐ ┌────────────┐ ┌────────────┐ ┌──────────┐ │ Textures │ │ Audio │ │ Entities │ │ Weather │ │ Atlas Gen │ │ Sound+Music│ │ Mob AI │ │ Rain/Snow│ │ Procedural │ │ Procedural │ │ Sheep │ │ Particles│ └────────────┘ └────────────┘ └────────────┘ └──────────┘

Principe cle : separation stricte des domaines. Le module world/ ne connait pas Three.js. Le module meshing/ transforme les donnees monde en geometrie. Le module rendering/ gere uniquement l'affichage. Pas de dependances circulaires.

Competences techniques mobilisees

Mathematiques 3D

Vecteurs, matrices, quaternions, produit vectoriel (winding order des faces), bruit de Perlin/Simplex (FBM), trigonometrie (orbite soleil/lune, mouvement camera).

Algebre lineaire Noise functions Trigonometrie
Algorithmique

Greedy meshing (fusion de faces voisines), DDA raycast (traversee de grille voxel), swept AABB collision (physique), flood fill (propagation de lumiere), generation procedurale de terrain.

Greedy meshing DDA raycast Collision AABB
Programmation GPU (Shaders)

Vertex shaders (deformation des vagues d'eau), fragment shaders (AO, eclairage, fog, fissures de casse), uniforms dynamiques, texture atlas sampling avec fract().

GLSL Vertex displacement Per-pixel lighting
Optimisation Temps Reel

Budget de frame adaptatif, pre-allocation d'objets (zero GC dans le hot path), swap-with-last au lieu de splice, rendu conditionnel (fallback sans bloom), frustum culling.

60fps target GC pressure Frame budgeting
Architecture Logicielle

Modularite par domaine, separation donnees/rendu, event callbacks (onBreak, onPlace), pattern generateur (preload progressif), singleton (engine), composition (pas d'heritage).

Clean architecture SOLID Composition
Audio Procedurale

Synthese sonore via oscillateurs Web Audio, noise buffers pour les bruitages, filtrage passe-bas pour le vent, gamme pentatonique pour la musique, reverb par delay feedback.

Web Audio API Synthese DSP basique

🎮 Partie 2 : Panorama du Developpement de Jeux Video

Ce rapport couvre les principaux types de jeux, les plateformes cibles, les stacks technologiques adaptees, et la complexite de chacun. L'objectif : donner une vision exhaustive des possibilites pour un developpeur ou une equipe etudiante.

Types de jeux et leurs stacks

1. Platformer 2D Facile-Moyen

Exemples : Super Mario, Celeste, Hollow Knight

Competences requises

Physique 2D (gravite, collision AABB/tilemap), animation sprite, level design, state machine pour le personnage, camera follow, parallax scrolling.

Stacks recommandees

PlateformeStackNotes
WebPhaser 3 ou PixiJS + TypeScriptPhaser a un moteur physique integre. PixiJS pour plus de controle.
DesktopGodot (GDScript/C#) ou Unity (C#)Godot est gratuit et leger, ideal pour du 2D.
MobileFlutter Flame ou UnityFlame pour du cross-platform Dart. Unity pour le AAA mobile.
ConsoleUnity ou GodotUnity a le meilleur support console.

Environnement

Editeur de niveaux (Tiled, LDtk), logiciel de pixel art (Aseprite, Piskel), IDE (VS Code).

2. RPG (Tour par tour / Action) Difficile

Exemples : Pokemon, Final Fantasy, Zelda, Stardew Valley

Competences requises

Systeme de dialogue, inventaire, quetes, combat (tour par tour ou temps reel), sauvegarde/chargement, tilemaps, NPC AI, systeme d'experience/progression.

Stacks recommandees

PlateformeStackNotes
WebPhaser 3 + TypeScriptPlugin RPG, tilemap support natif.
DesktopRPG Maker, Godot, UnityRPG Maker pour le prototypage rapide. Godot/Unity pour du custom.
MobileUnity ou GodotUnity dominant sur mobile pour les RPGs.
MultiGodot 4Export Web, Desktop, Mobile depuis un seul projet.
3. FPS / TPS (Tir premiere/troisieme personne) Expert

Exemples : Counter-Strike, Fortnite, DOOM

Competences requises

Rendu 3D avance, physique 3D (raycasting, balistique), netcode (interpolation, prediction), animation squelettique, systeme d'armes, AI ennemis, level design 3D, optimisation GPU.

Stacks recommandees

PlateformeStackNotes
WebThree.js / Babylon.js + TypeScriptPossible mais limite (pas de multithreading natif, WebGL).
DesktopUnreal Engine 5 (C++) ou Unity (C#)Unreal pour le AAA (Nanite, Lumen). Unity pour l'indie.
ConsoleUnreal Engine 5Pipeline de certification console integre.
CustomC++ / Vulkan / DirectX 12Moteur custom pour un controle total (DOOM approach).

Environnement

Blender (modeles 3D), Substance Painter (textures), Wwise/FMOD (audio), Git LFS (assets volumineux).

4. Puzzle / Reflexion Facile

Exemples : Tetris, 2048, Baba Is You, Portal

Competences requises

Logique de jeu, grille/matrice, algorithmes de recherche (BFS/DFS pour la validation), UI/UX, animation de transitions. Pour Portal : physique 3D avancee.

Stacks recommandees

PlateformeStackNotes
WebVanilla JS/TS + Canvas 2DPas besoin de moteur pour du 2D simple.
MobileReact Native, Flutter, Swift/KotlinUI native performante pour les puzzles tactiles.
DesktopGodot, ElectronGodot pour du puzzle plus complexe.
5. Strategie (RTS / Tour par tour / 4X) Difficile

Exemples : Age of Empires, Civilization, Factorio, Rimworld

Competences requises

Pathfinding (A*), AI strategique (arbres de decision, utility AI), gestion de ressources, fog of war, systeme de construction, simulation economique, multijoueur deterministe.

Stacks recommandees

PlateformeStackNotes
WebPixiJS ou Phaser (2D), Three.js (3D)Factorio-like faisable en web. RTS 3D plus difficile.
DesktopUnity, Godot, C++ customUnity/DOTS pour la simulation massive.
MobileUnityClash of Clans-style, simplifie pour tactile.
6. Sandbox / Voxel Difficile

Exemples : Minecraft, Terraria, Roblox — c'est VoxelCraft !

Competences requises

Generation procedurale (noise), gestion de chunks, greedy meshing, systeme de blocs, physique voxel, eclairage, persistance monde, optimisation memoire (TypedArrays).

Stacks recommandees

PlateformeStackNotes
WebThree.js + TypeScript + ViteC'est notre stack ! Prouve viable pour un voxel engine complet.
DesktopC++/OpenGL, Rust/wgpu, Java (LWJGL)Minecraft orignal est en Java. Les mods utilisent LWJGL.
MobileUnity (C#) ou C++/OpenGL ESPerformance critique sur mobile, LOD obligatoire.
7. Roguelike / Roguelite Moyen

Exemples : Hades, Dead Cells, Slay the Spire, Binding of Isaac

Competences requises

Generation procedurale de niveaux (BSP, drunkard's walk), systeme de loot/drop, permadeath, meta-progression, combat dynamique, balance/randomisation.

Stacks recommandees

PlateformeStackNotes
WebPhaser 3 ou rot.js (roguelike ASCII)rot.js est specialise roguelike (FOV, pathfinding, RNG).
DesktopGodot, Unity, GameMakerGameMaker pour du 2D rapide (Dead Cells l'utilise).
MultiGodot 4Export partout, ideal pour les roguelikes indie.
8. Simulation / Gestion Moyen-Difficile

Exemples : SimCity, Cities Skylines, Theme Hospital, Two Point Hospital

Competences requises

Simulation economique, graphes de dependances, systeme de grille/placement, IA de population (agents), rendu isometrique ou 3D, UI complexe (panneaux, stats).

Stacks recommandees

PlateformeStackNotes
WebReact + PixiJS ou Three.jsReact pour l'UI complexe, Pixi/Three pour le rendu.
DesktopUnity, GodotUnity pour les sims 3D complexes.
MobileUnityDominant pour les sims mobile (Township, SimCity BuildIt).
9. Multijoueur en ligne (MMO / Battle Royale) Expert

Exemples : World of Warcraft, Fortnite, Among Us, Valorant

Competences requises

Netcode (TCP/UDP, WebSocket, WebRTC), synchronisation d'etat, prediction client, compensation de lag, serveur autoritatif, base de donnees (comptes, progression), anti-triche, scalabilite, DevOps.

Stacks recommandees

CoucheStackNotes
Client WebThree.js / Babylon.js + WebSocketAmong Us-style faisable en web.
Client DesktopUnreal / UnityNetcode integre (Netcode for GameObjects, Unreal Replication).
ServeurNode.js, Go, Rust, C#Go/Rust pour la performance. Node.js pour le prototypage.
InfraDocker + Kubernetes + Redis + PostgreSQLScaling horizontal, matchmaking, persistence.
Temps reelColyseus, Socket.io, PhotonColyseus = framework Node.js specialise jeu multijoueur.
10. Visual Novel / Narratif Facile

Exemples : Ace Attorney, Doki Doki Literature Club, Life is Strange

Competences requises

Systeme de dialogue branche (arbre/graphe), gestion d'etats/flags, affichage de sprites/backgrounds, musique d'ambiance, choix qui impactent l'histoire, sauvegarde d'etat narratif.

Stacks recommandees

PlateformeStackNotes
WebRen'Py (Python) ou Twine (HTML)Ren'Py est LE standard. Twine pour du texte interactif pur.
DesktopRen'Py, Unity + InkInk = langage de script narratif par Inkle (80 Days).
MobileRen'Py (export Android/iOS)Support natif mobile.
11. Jeu de rythme Moyen

Exemples : Guitar Hero, Beat Saber, Osu!, Friday Night Funkin'

Competences requises

Synchronisation audio/visuel precise (audio clock vs frame clock), parsing de beatmaps, detection d'input timing, scoring, effets visuels synchronises, analyse audio (FFT optionnel).

Stacks recommandees

PlateformeStackNotes
WebWeb Audio API + Canvas/WebGLFNF est en HaxeFlixel mais portage web existe.
VRUnity + XR ToolkitBeat Saber approach.
DesktopUnity, Godot, LÖVE (Lua)LÖVE est ultra-leger pour du 2D rythme.
12. Tower Defense Moyen

Exemples : Bloons TD, Kingdom Rush, Plants vs Zombies

Competences requises

Pathfinding (vagues d'ennemis), systeme de tours (placement, upgrade, range), gestion de vagues, balance economique, targeting AI (closest, strongest, first).

Stacks recommandees

PlateformeStackNotes
WebPhaser 3 ou PixiJSParfait pour du TD 2D en navigateur.
MobileUnity, GodotGenre tres populaire sur mobile.
DesktopGodotLeger et rapide a prototyper.
13. Course / Racing Moyen-Difficile

Exemples : Mario Kart, Forza, TrackMania

Competences requises

Physique vehicule (suspension, friction, drift), rendu de piste, camera dynamique, AI de course (waypoints, rubber-banding), effets (particules, motion blur), multijoueur (netcode predicitf).

Stacks recommandees

PlateformeStackNotes
WebThree.js + Cannon.js (physique)Faisable pour du low-poly racing.
DesktopUnity, UnrealUnity pour arcade, Unreal pour sim.
MobileUnityGenre populaire mobile (Asphalt, Mario Kart Tour).
14. Horreur / Survival Horror Moyen

Exemples : Resident Evil, Amnesia, Phasmophobia, Five Nights at Freddy's

Competences requises

Ambiance (eclairage, son), AI ennemie (patrouilles, detection), gestion de ressources limitees, jump scares programmes, level design claustrophobe, post-processing (grain, vignette).

Stacks recommandees

PlateformeStackNotes
WebThree.js + Web AudioFNAF-style est faisable en web. 3D horreur aussi.
DesktopUnreal (rendu photoreal), UnityUnreal excelle pour l'ambiance visuelle.
VRUnity + XRL'horreur en VR est un genre a part (Phasmophobia VR).
15. Educatif / Serious Game Facile-Moyen

Exemples : Duolingo (gamifie), CodeCombat, Human Resource Machine

Competences requises

Design pedagogique, progression adaptative, feedback immediat, gamification (XP, badges, streaks), analytics d'apprentissage, accessibilite.

Stacks recommandees

PlateformeStackNotes
WebReact/Vue + Canvas ou PhaserWeb = distribution instantanee, pas d'installation.
MobileReact Native, FlutterApps educatives = mobile first.
MultiGodot + GDScriptGodot lui-meme est educatif (simple a apprendre).

Plateformes cibles

PlateformeTechnologiesDistributionConsiderations
Web (navigateur) HTML5, WebGL/WebGPU, Web Audio, WASM URL directe, pas d'installation Accessibilite maximale, performances limitees (single thread, pas d'acces fichier direct). Pas de store fees.
Desktop (PC/Mac/Linux) C++, C#, Rust, Java, Electron/Tauri Steam, Epic, itch.io, standalone Performances maximales, acces GPU/CPU complet. Steam prend 30%.
Mobile (iOS/Android) Swift, Kotlin, Unity, Flutter, React Native App Store, Google Play Input tactile, batterie, tailles d'ecran variables. Store fees 15-30%. Review process iOS.
Console (Switch/PS/Xbox) C++, Unity, Unreal Nintendo eShop, PSN, Xbox Store Dev kits requis ($$$), certification stricte, performances fixes. Accord NDA avec le constructeur.
VR/AR (Quest, PCVR) Unity + XR, Unreal, WebXR Meta Quest Store, SteamVR Performance critique (90fps min), motion sickness, interaction spatiale. WebXR pour du VR web.
Embarque (Raspberry Pi, retro) C, C++, SDL2, Raylib Image SD, ROM Ressources tres limitees, optimisation extreme. Raylib est ideal (C, leger, multiplateforme).

Matrice de complexite : Type x Plateforme

Type de jeu Web Desktop Mobile Console VR
Platformer 2D Facile Facile Moyen Moyen Difficile
RPG Moyen Difficile Difficile Expert Expert
FPS 3D Difficile Difficile Expert Expert Expert
Puzzle Facile Facile Facile Moyen Moyen
Strategie Difficile Difficile Difficile Expert Expert
Sandbox/Voxel Difficile Difficile Expert Expert Expert
Roguelike Moyen Moyen Moyen Difficile Difficile
Multijoueur (MMO) Expert Expert Expert Expert Expert
Visual Novel Facile Facile Facile Moyen Moyen
Racing Moyen Difficile Difficile Expert Expert

Environnements et outils essentiels

IDE & Editeurs

VS Code (universel), JetBrains Rider (C#/Unity), Visual Studio (C++/Unreal), Cursor (AI-assisted).

Controle de version

Git + GitHub/GitLab. Git LFS pour les assets volumineux. Branching strategy (feature branches, trunk-based).

Art 2D

Aseprite (pixel art), Krita (peinture), Piskel (web, gratuit), Photoshop/GIMP, TexturePacker (atlas).

Art 3D

Blender (modelisation, animation, rigging), MagicaVoxel (voxel art), Substance Painter/Designer (textures PBR).

Audio

Audacity (edition), LMMS/FL Studio (musique), sfxr/jsfxr (bruitages retro), Wwise/FMOD (audio middleware AAA).

Level Design

Tiled (tilemaps 2D), LDtk (moderne, entites), Trenchbroom (BSP/Quake-style), editeurs integres (Unity/Unreal/Godot).

CI/CD & Deploiement

GitHub Actions, Vercel/Netlify (web), Steam Build Pipeline, Fastlane (mobile). Tests automatises, builds multi-plateforme.

Profiling & Debug

Chrome DevTools (web), RenderDoc (GPU), Tracy (C++ profiler), Unity Profiler, Unreal Insights. Stat overlays in-game.


Conclusion

VoxelCraft demontre qu'un moteur de jeu voxel complet est realisable avec une stack web moderne (Three.js + TypeScript + Vite) et zero assets externes. Les competences mobilisees — algorithmique, mathematiques 3D, shaders, optimisation temps reel, architecture logicielle — sont directement transposables a tout type de developpement de jeu video.

Le choix de la stack depend toujours du type de jeu, de la plateforme cible, et de la taille de l'equipe. Pour un etudiant ou une petite equipe :

Document genere pour VoxelCraft Build #28 — 2026-03-19
Stack : Three.js + TypeScript + Vite | Zero external assets