Retour aux projets
Hub 3D Commerce Local
Hub full 3D / Commerce immersif

Hub3DCommerceLocal

Hub central full 3D pour commerces locaux avec atrium, scènes boulangerie, boucherie, cave à vin, restaurant et boutique mode, plus interactions panier, réservation et fiches scène.

Next.js 16React 19Three.jsReact Three FiberZustand
00

Un carrousel pour parcourir l'identité, le stack et les choix produit sans quitter l'étude de cas.

Hub 3D Commerce Local - Un atrium central pour entrer dans chaque commerce
Hub01 / 06
Next.js 16React 19Three.jsReact Three Fiber
Hub

Un atrium central pour entrer dans chaque commerce

Le hub sert de point d’entrée premium avec des portes visuelles vers la boulangerie, la boucherie, la cave à vin, le restaurant et la boutique mode.

5scènes 3D
  • Navigation centrale claire
  • Accès rapides par commerce
  • Immersion 3D et fiche hub
01

Tech Stack Complet

🎨

Front-end

9
Next.js 16
⚛️React 19
📘TypeScript 5.7
🔺Three.js 0.185
🔺React Three Fiber 9
🔺Drei 10
🧭Zustand
🎨CSS Modules
🎨Lucide React
⚙️

Back-end

3
Next.js API Routes
🛡️Zod 4
🍽️Restaurant CMS
🗄️

Base de données

2
🧊3D assets
🧊GLB optimization
🚀

Infrastructure

5
Vercel
🖼️Responsive Images
Lazy loading
🏁Lighthouse 13
🧹ESLint 9
02

À propos du projet

Le Hub 3D Commerce Local est une expérience immersive pensée comme un centre commercial digital premium. L’utilisateur arrive dans un atrium central, puis navigue vers plusieurs scènes 3D dédiées : boulangerie, boucherie, cave à vin, restaurant et boutique mode. Chaque espace possède son identité, ses produits, ses points interactifs, ses contrôles et son parcours métier. La valeur du projet est de montrer comment un commerce local peut dépasser la simple page vitrine : immersion 3D, fiches scène, panier, hotspots produits, réservation de table, mode 360 degrés, retours au hub et navigation fluide entre les univers. La stack repose sur Next.js, React, TypeScript, Three.js, React Three Fiber, Drei, Zustand, assets GLB optimisés et chargement progressif pour garder l’expérience utilisable sur desktop comme sur mobile.

03

Fonctionnalités clés

  • 01Atrium central full 3D avec accès aux commerces locaux
  • 02Scènes dédiées : boulangerie, boucherie, cave à vin, restaurant et boutique mode
  • 03Hotspots produits, panier, fiches scène, immersion 3D et mode 360 degrés
  • 04Réservation de table dans la scène restaurant avec date, heure et couverts
  • 05Assets GLB optimisés, chargement progressif et interface responsive
04

Liens