Création de site web 3D et interactif
Création de site web 3D : des sites dessinés en direct dans le navigateur avec WebGL, où le défilement déplace une caméra, où une histoire se joue pendant la lecture, ou où l’on visite un bâtiment. Le site sur lequel vous êtes en est l’exemple : une ville dans le brouillard que l’on parcourt en faisant défiler la page, et Room 404, un bâtiment que l’on visite pièce par pièce. Les deux restent fluides sur un téléphone, et les moteurs de recherche en lisent chaque page.
Sites web interactifs
Un site interactif répond à ce que fait le visiteur. Sur ce site, les cartes de « What I do » tournent sur une roue au défilement, chaque projet se verrouille sur un circuit imprimé qui s’allume, et dans la pile de compétences vous choisissez un projet pour voir le courant rejoindre chaque compétence qu’il a utilisée. Le son en fait partie : un signal discret pour chaque action, derrière un seul interrupteur.
Animation au scroll et scrollytelling
Le scrollytelling transforme une page en une suite de scènes, jouées par le défilement. La version classique de ce portfolio en est un : la caméra traverse le brouillard jusqu’à mon nom, la devise se met en place en blocs de néon, les projets s’alignent le long d’une rue, et après le dernier, la caméra fonce dans la rue et tourne au coin vers la section suivante.
3D immersive dans le navigateur : WebGL et Three.js
Room 404 est un bâtiment de nuit à parcourir pièce par pièce : un hall, un atelier, une salle pour les projets, des archives et un toit, avec la pluie sur les vitres et des éclairs sur la ville. Il est construit avec Three.js et React Three Fiber, avec des modèles faits dans Blender, et lit le même contenu que le reste du site : un nouveau projet apparaît dans les deux sans toucher au code. Il s’adapte à l’appareil, pour que la visite reste fluide sur mobile.
Exemples de sites web 3D
Chaque exemple ci-dessous est sur ce site, à un clic :
- L’arrivée : la caméra traverse une ville dans le brouillard dessinée en direct dans le navigateur, et le point du i est la braise qui montre le chemin.
- Ma philosophie : trois enseignes au néon faites de blocs de verre portant des lettres, qui roulent vers vous au défilement et se tournent vers le pointeur.
- Les projets : chaque projet est une fenêtre sur un circuit imprimé, et les projets s’alignent le long de la rue, un pâté de maisons d’écart.
- La pile de compétences : une tour dans le brouillard, un étage par couche d’un système et une fenêtre allumée par compétence.
- Room 404 : tout le portfolio en bâtiment à visiter.
Rapide sur mobile, lisible par les moteurs de recherche
Un site 3D doit quand même se charger sur un téléphone, et quand même être trouvé. Celui-ci a son propre rythme pour le tactile, une version plus calme pour les visiteurs qui demandent à leur navigateur de réduire les animations, et une page simple et lisible pour chaque adresse, pour que moteurs de recherche et modèles de langage le lisent entièrement sans exécuter une ligne de script. L’étude de cas explique comment il est construit.
Tarifs
Clients en Tunisie (TND)
| Site web 3D ou animé au scroll | 3 000 – 7 500 TND |
|---|---|
| Maintenance mensuelle : mises à jour, sauvegardes, supervision | 50 – 200 TND par mois |
Europe (EUR)
| Site web 3D ou animé au scroll | 1 500 – 4 500 € |
|---|---|
| Maintenance mensuelle : mises à jour, sauvegardes, supervision | 40 – 150 € par mois |
Reste du monde (USD)
| Site web 3D ou animé au scroll | 1 650 – 5 000 $ |
|---|---|
| Maintenance mensuelle : mises à jour, sauvegardes, supervision | 40 – 170 $ par mois |
Tarifs pour les clients en Tunisie, les clients en Europe, les clients hors de Tunisie et d’Europe. Chaque fourchette correspond à la plupart des projets de ce type ; vous recevez un devis écrit après un premier appel sur votre besoin. Nom de domaine, hébergement, services payants et frais des stores sont réglés directement aux fournisseurs, à votre nom.
Réalisations
- This Portfolio: Ce site : une ville dans le brouillard dessinée en direct dans le navigateur, et Room 404, un bâtiment à visiter en 3D.
Questions
Combien coûte un site web 3D ?
La plupart des sites 3D ou animés au scroll coûtent 3 000 – 7 500 TND pour les clients en Tunisie, 1 500 – 4 500 € en Europe et 1 650 – 5 000 $ ailleurs. Ce qui fait varier le prix, c’est le nombre de scènes et la nécessité de créer des modèles sur mesure. Vous recevez un devis écrit après un premier appel.
Un site 3D nuit-il au référencement ?
Il le peut, quand toute la page vit dans un canvas que les robots ne savent pas lire. La solution est de servir aussi chaque adresse en HTML simple. Ce site est une scène WebGL, et chacune de ses pages existe aussi en page lisible, avec son titre, sa description et ses données structurées : c’est ce que les moteurs de recherche indexent.
Un site 3D fonctionne-t-il sur mobile ?
Oui, quand il est pensé pour le mobile dès le départ. Ce site rythme ses scènes pour le pouce et dessine moins sur un écran de téléphone, et Room 404 adapte son niveau de détail à l’appareil pour que la visite reste fluide.
Et les visiteurs sensibles au mal des transports ?
Leur navigateur peut demander moins d’animations, et ce site affiche alors une version calme de chaque section, avec le même contenu et rien qui bouge au défilement.
Parlez-moi de votre projet
Dites-moi à quoi il doit servir, ce que vous avez déjà et pour quand. Je réponds avec mes questions, ou avec un créneau pour un premier appel.
- E-mail: [email protected]
- Téléphone: +(216) 44 674 320