← Portefeuille immersif

Construire
sur du solide.

Chaque bloc compte.

Réutiliser cette idée Voir les autres

01

Le terrain.

Votre activité telle qu'elle est aujourd'hui, sans fard.

02

Les fondations.

Un site, un outil, une automatisation : on pose un bloc à la fois.

03

La ville.

Et un jour, ça tient debout tout seul.

Réutiliser cette idée

Réutiliser « La ville de cubes »

Un champ de cubes ondule comme une mer, puis se dresse en une ville éclairée.

Idéal pour : Croissance, construction, bâtiment, « on part de ce que vous avez et on l'élève ».

Fichiers
06-cubes/scene.js (la mise en scène), 06-cubes/index.html (textes), 06-cubes/page.css (ajustements), plus le socle src/commun/.
Réglages
  • Grille : COTE (40 × 40 blocs) ; profils vague() puis villes[]
  • Crépuscule : nuit dans rendre() (soleil, ciel, fenêtres)
  • Matières : pbr('concrete_wall_008'), sol concrete_floor_worn_001
Performance
InstancedMesh unique + ombres portées 2048² + bloom sur ordinateur ; sans ombres sur mobile.
Sources
Textures béton Poly Haven (CC0), ciel HDR Poly Haven (CC0).
Repli
Sans WebGL, sans JavaScript ou avec « réduire les animations » : les mêmes textes et liens, en page statique.
  1. Copier le dossier 06-cubes/ et src/commun/ dans le projet cible (Vite + three + gsap + lenis).
  2. Remplacer les textes des quatre étapes dans index.html ; garder les attributs data-*.
  3. Ajuster les réglages ci-dessus dans scene.js ; la progression p va de 0 (haut) à 1 (bas).