Ozone : landing page avec vidéo au scroll
- Template HTML / CSS / JS
- Intermédiaire
Une landing page produit dont la vidéo avance au fil du scroll, avec des indications sur l'image. HTML, CSS et JS, sans framework, en français et en anglais.
Prêt pour les assistants de code
Tu télécharges, tu ouvres, tu demandes.
Ce template est fait pour être personnalisé avec Claude Code, Cursor ou Antigravity. Il contient ses propres consignes : ton assistant comprend tout de suite comment il est construit et ce qu'il peut modifier.
Claude Code- Cursor
Antigravity
- 01
Télécharge le zip
Juste après l'achat, depuis cette page ou ton espace. Décompresse-le où tu veux.
- 02
Ouvre le dossier dans ton assistant
Claude Code, Cursor, Antigravity : ouvre simplement le dossier du template, rien à installer.
- 03
Demande ce que tu veux
En langage courant. Il modifie le code, tu vérifies le rendu, tu ajustes, puis tu mets en ligne.
Ce que tu peux lui demander
- « Mets mes textes et mon logo »
- « Change les couleurs pour mon identité »
- « Remplace les images par les miennes »
- « Ajoute une section témoignages »
Tu restes aux commandes : tu décris ce que tu veux, ton assistant fait les modifications, tu valides.
Ce que tu obtiens
- Fait pour Claude Code, Cursor et Antigravity : tu ouvres le dossier et tu demandes
- Un hero dont la vidéo avance au scroll, fluide sur téléphone
- Des indications qui apparaissent sur l'image au bon moment
- Une page complète : caractéristiques, avant / après, détails, avis, prix, FAQ, newsletter
- Deux pages, en français et en anglais, prêtes pour Google
- Des outils inclus pour transformer ta vidéo en images et placer les indications
- HTML, CSS et JS : aucun framework, aucune dépendance, hébergeable partout
- Autant de sites que tu veux, pour toi ou pour tes clients
L'effet qui fait la différence
En haut de la page, ta vidéo ne se lance pas toute seule : elle avance au rythme du scroll. Le visiteur fait défiler, le produit se transforme, et des indications apparaissent sur l'image pour expliquer chaque détail. C'est le genre d'effet qu'on voit sur les sites des grandes marques, et qui retient l'attention.
Ce qu'il y a dans le template
- Le hero avec la vidéo au scroll, ses indications et une version allégée pour les téléphones
- Toute la page de vente : présentation, caractéristiques avec gros plans, curseur avant / après, détails, avis, prix, FAQ, newsletter
- Une page en français et une en anglais, avec les balises pour Google et le partage sur les réseaux
- Un outil qui transforme ta propre vidéo en suite d'images, directement dans ton navigateur
- Un outil pour placer les indications sur l'image en cliquant
- Un guide complet, de la vidéo à la mise en ligne
Fait pour être personnalisé
Les couleurs, la police et les textes se changent en quelques lignes. Le code est du HTML, du CSS et du JavaScript classiques : aucun framework, aucune installation, et ça s'héberge partout (Netlify, Vercel, Hostinger, OVH...).
La licence
Tu peux créer autant de sites que tu veux avec, pour toi ou pour tes clients, et tout modifier. Tu ne peux pas revendre ni partager le template. Les visuels de démonstration (OZONE) servent à essayer le template : tu les remplaces par les tiens avant la mise en ligne.