Neta
ExploreWorksWorldsToolsGuides
ExploreToolsGuides
Créer mon site 3D
Créateur de site 3D au scroll

Créateur de site 3D au scroll — sans Three.js

Décrivez un lieu en une phrase : le scroll fait avancer une vraie caméra dedans. Scènes générées, plongée dans chacune, sorties invisibles. Sans Three.js ni GSAP.

Liyue, la ruelle des lanternes — Genshin Impact. En pleine plongée : les lanternes glissent devant l’objectif, le marché garde sa profondeur.Fontaine, le grand escalier — Le vol démarre dehors et entre dans l’arcade d’un seul trait, sans coupe.Katagiri High, la cage d’escalier — Horimiya. Hori sort, le couloir garde sa profondeur derrière elle.Shibuya, le carrefour — Réalisé pour cette page : une phrase, trois plans, un seul vol continu.

Propulsé par la compétence Scroll World Video.

✦Site 3D au scroll
Créer un site 3D au scroll sur un marché de nuit sous une seule longue lanterne
Le terminal des aquabus — Premier arrêt : titre, texte et tags posés sur l’eau. Seul le scroll déplace la caméra.
Le terminal des aquabus — Premier arrêt : titre, texte et tags posés sur l’eau. Seul le scroll déplace la caméra.
Le toit de l’opéra — Troisième arrêt. Les portes, la lumière, le même vol, toujours aucune coupe.
Le toit de l’opéra — Troisième arrêt. Les portes, la lumière, le même vol, toujours aucune coupe.
Les étals à marée basse — Xiangling derrière le comptoir ; marée et prise sont des données, pas un décor.
Les étals à marée basse — Xiangling derrière le comptoir ; marée et prise sont des données, pas un décor.
Le terrain d’entraînement — The Hollow Star. Un rail de douze chapitres et une descente aérienne dans l’arène.
Le terrain d’entraînement — The Hollow Star. Un rail de douze chapitres et une descente aérienne dans l’arène.
La dernière cloche — Hori et Miyamura aux casiers, le titre tient sur la gauche.
La dernière cloche — Hori et Miyamura aux casiers, le titre tient sur la gauche.
Au-dessus des salles — Dernier arrêt : deux personnages à la rambarde, la ville qui vire à l’or.
Au-dessus des salles — Dernier arrêt : deux personnages à la rambarde, la ville qui vire à l’or.
Le carrefour — Réalisé pour cette page. Au niveau de la rue, la caméra descend au-dessus de la foule.
Le carrefour — Réalisé pour cette page. Au niveau de la rue, la caméra descend au-dessus de la foule.
La descente — Deuxième plan : la bouche du métro, les rampes qui glissent, les portiques au fond.
La descente — Deuxième plan : la bouche du métro, les rampes qui glissent, les portiques au fond.
Au-dessus du rideau — Dernier plan : le toit, la silhouette, tout le carrefour en dessous.
Au-dessus du rideau — Dernier plan : le toit, la silhouette, tout le carrefour en dessous.
01 / 03

Fontaine, la nuit

Trois arrêts d’un seul trait : le terminal, l’arcade, le toit de l’opéra.

Fontaine, la nuitOpen in new tab
Want your own?

Une phrase, et la page défile comme une caméra.

Neta Studio génère chaque scène, tient une seule étalonnage sur toutes, et fait voler la caméra entre elles. La page publiée ne fait que scruter ces images : la position de scroll devient l’horloge de la caméra, et les textes restent modifiables là où vit la page.

  • De la profondeur, pas une fausse parallaxe — une scène est générée en image fixe, puis un modèle y fait entrer la caméra. Rien n’est simulé avec des PNG superposés ou une transformation CSS.
  • Des coutures introuvables — chaque raccord est calé sur la dernière image du clip précédent, donc le vol se lit comme une seule prise.
  • Modifiable après publication — titre, texte, tags et ordre des scènes sont de simples champs. Changez-les, republiez, la caméra ne bouge pas.

Questions fréquentes

Est-ce vraiment de la 3D, ou une vidéo sur une page ?

C’est pré-rendu. Chaque scène est une image générée, le mouvement est un clip généré, et la position de scroll scrute ce clip. La profondeur et le mouvement sont réels pour quelques mégaoctets par scène — mais on ne peut pas tourner autour du modèle ni sortir du trajet.

Faut-il Three.js, GSAP ou un designer ?

Non. Vous écrivez une phrase. Pas de bibliothèque, pas de timeline, pas de graphe de scène, et pas de budget tournage.

Quel poids au premier chargement ?

Trois scènes, environ 23–25 Mo, derrière une barre de progression avant l’ouverture. Chaque scène en plus ajoute environ 9 Mo à cette attente.

Puis-je utiliser mes photos ou ma marque ?

Oui. Passez-les en références : chaque scène en dérive et un lieu réel garde son aspect et sa lumière. Pour un monde qui n’existe pas encore, une phrase suffit.

Que peut-on changer ensuite ?

Le titre, une ligne de texte et jusqu’à trois tags par scène, plus l’ordre des scènes. Le travail de caméra reste tel qu’il a été rendu.

Est-ce que ça marche sur téléphone ?

La page s’ouvre et défile, avec des encodages plus légers et un recadrage central. Le scrubbing reste un geste de bureau ; sur un réseau lent, c’est le premier chargement qu’on sent.

En quoi est-ce différent d’un template avec animations au scroll ?

Un template anime des éléments que vous avez déjà. Ici la scène, la profondeur et le trajet de caméra sont générés : la page peut traverser un lieu qui n’a jamais existé.

Où vit le site terminé ?

Il est publié comme une œuvre avec son propre lien public. Envoyez-le, intégrez-le, ou dupliquez-le pour changer les scènes.

Une phrase, un seul vol.

Trois scènes, une caméra qui les traverse, un lien à envoyer.

Créer mon site 3D
×