Je vais créer une page d'atterrissage moderne et animée avec gsap et webgl


À propos de ce service
Traduction automatique
La plupart des sites défilent. Quelques bougent.
Vous en percevez la différence dès que vous en atterrissez sur un. Une section reste en place pendant que l’histoire continue. Un produit tourne au défilement et revient en arrière lorsque vous faites défiler vers le haut. Le texte arrive au lieu d’apparaître.
C’est ce que je crée : du mouvement lié à la position de défilement, pas à une horloge. Sections fixées, timelines ajustées, galeries horizontales pilotées par le défilement vertical, révélations de texte masqué, et WebGL quand l’idée le mérite.
STACK
GSAP + ScrollTrigger, Lenis, Three.js, JS vanilla ou Next.js. Pas de constructeurs de pages. Pas de modèles.
VOIR EN PREMIER
Ça tourne ici : ataberkyildiz.netlify.app
Faites défiler. C’est le vrai travail, pas une maquette.
POURQUOI LA PLUPART DES SITES ANIMÉS ÉCHOUENT
Chaque élément a sa propre révélation, cinq effets s’empilent sur un seul écran, et cela devient du bruit. Le mouvement sans hiérarchie n’est que mouvement.
Je travaille selon une limite : deux ou trois mouvements signature par site, choisis pour l’histoire. Tout le reste reste immobile exprès.
Chaque création est livrée avec un budget de performance et un support pour le mouvement réduit. Le mouvement doit sembler coûteux, pas coûter cher à exécuter.
AVANT DE COMMANDER
Envoyez-moi un site de référence que vous aimez. Je vous dirai comment je le construirais et ce dont il a vraiment besoin. C’est gratuit.
Respectez les droits des tiers
Veuillez noter qu’il est contraire aux politiques de Fiverr pour les freelances d’inclure des thèmes, des modèles ou tout autre élément d'autrui qui enfreint les droits de tiers ou les lois applicables pour les livrables. En savoir plus en lisant notre Guide pour une création numérique responsable.
Découvrez Ataberk
I build websites that move when you scroll
- DeTurquie
- Membre depuisjuil. 2026
- Temps de réponse moy.1 heure
Langues
Anglais
Traduction automatique
Mon portfolio
FAQ
Traduction automatique
Est-ce que cela fonctionnera sur mobile ?
Oui, et pas en réduisant la version desktop. Les séquences de défilement lourdes sont remplacées par des équivalents plus légers sur petits écrans — une scène WebGL fixée devient une composition statique avec une révélation simple. Un mouvement qui paraît haut de gamme sur un ordinateur portable peut sembler cassé sur un téléphone, donc ils sont conçus séparément.
Est-ce que toute cette animation ralentira mon site ?
Seulement si c’est mal fait. J’anime uniquement la transformation et l’opacité, qui restent hors du thread principal et n’activent pas le layout. Les assets sont dimensionnés et chargés paresseusement. Je réalise une vérification de performance sur Standard et Premium et je vous montrerai les chiffres.
Dois-je fournir du contenu et des images ?
Pour un meilleur résultat, oui — de vraies copies et de vraies photos surpassent toujours les placeholders. Si vous ne les avez pas encore, je peux construire avec des placeholders structurés et les échanger plus tard, mais un site n’est aussi bon que ce qu’il contient.
De quoi avez-vous besoin de ma part pour commencer ?
1. Un ou deux sites de référence que vous aimez 2. Votre contenu — texte et images, ou une note indiquant qu’ils arrivent 3. Les sections dont vous avez besoin 4. Où il sera hébergé C’est tout. Je reviendrai avec le plan de mouvement avant d’écrire du code.
Et si un visiteur a une sensibilité au mouvement ?
Chaque création respecte prefers-reduced-motion. Lorsqu’il est activé, le pinning et le scrubbing s’éteignent et le contenu reste immobile, complet et lisible. Ce n’est pas une option de dernière minute — c’est intégré dans la construction.
Utilisez-vous l’IA dans votre processus ?
Oui, comme outil — pour l’échafaudage et l’itération. La direction artistique, les décisions de mouvement et la finition finale sont les miennes, et chaque création est faite spécifiquement pour votre marque. Je peux vous expliquer précisément où cela est utilisé.

