À propos de ce modèle

LTX Video est une référence de travail pour un produit IA ou SaaS, un exemple de landing page entièrement mesuré et prêt à reproduire. Le titre affiché est « The world model », et le reste de landing page s’organise autour de lui. La palette est rouge sourd #FFD7E6 en fond, bleu profond #0B1A26 pour le texte et sarcelle #7FE3FF pour les accents, composée en Manrope. La livraison est en un seul fichier HTML autonome, capturée en 1920x1400 pour que le cadre soit fixé avant la première ligne de code. Le brief consacre son budget d’animation à 420ms de transitions, cubic-bezier(0.22, 1, 0.36, 1) et un fond vidéo en boucle. Gardez-la ouverte pendant la rédaction, car le brief de 21 298 caractères est la partie qui se transfère à votre page.

Conçu pour

  • Cette composition convient aux agences qui défendent des projets SaaS et doivent citer un seul fichier HTML autonome dès la première réponse au client.
  • Ce design de landing page vise les équipes qui connaissent déjà un seul fichier HTML autonome et veulent simplement retrouver un breakpoint à 700px par écrit.
  • Ce design de landing page sert aux fondateurs qui ont besoin d’un seul écran pour prouver que le texte SaaS peut porter 7,8s de vidéo en boucle.

Ce qui est inclus

  • Une ligne, aucun tiroir. La rangée du haut réunit le nom de marque, quatre ou cinq liens et une seule action teintée #7FE3FF, dimensionnée pour rester discrète face au reste de la page. Sous 700px, les liens se replient dans une surcouche plein écran. Sous 700px, les liens se replient au lieu de passer sur une seconde ligne.
  • Un seul clip fait le travail. Un unique clip muet en boucle remplit le cadre en 1920x1400 sur 7,8s, cadré en cover avec le texte empilé par-dessus. Le brief écarte toute surcouche du fond vidéo pour ne pas en ternir les couleurs. Une image d’attente en 1920x1400 tient la composition quand la lecture automatique est indisponible, la mise en page ne s’effondre donc jamais.
  • L’interlettrage se resserre. La typographie est Manrope, et le brief assigne un rôle à la fonte plutôt que de mélanger pour varier. Graisses, interlettrage et paliers de taille sont spécifiés, la hiérarchie survit donc à un remplacement. L’interlettrage se resserre à mesure que le corps grandit, c’est pourquoi la ligne display tient sur toute la plage 18–23px. Une seule fonte, des rôles clairs.
  • Rangée du haut, une action. Les libellés tiennent sur une ligne à 700px, et l’élément actif se signale par la graisse et non par une pastille.

Animation et interaction

Une ambiance sans bibliothèque de scroll

Un clip de 7,8s suffit à toute la couche d’ambiance, il joue derrière le texte, boucle sans coupure visible et ne réagit jamais au pointeur. Le clip est en sourdine et en inline, donc la première image est disponible sans interaction.

La position, pas un minuteur

Parallaxe est le seul comportement de scroll de la page, donc l’effet a une place définie dans la composition. En mouvement réduit, l’effet disparaît sans changer l’état final de la composition. Gardez un seul comportement de scroll, pas trois.

Comment LTX Video ordonne la première lecture

Rien ici ne concurrence la première décision. « The world model » fait ce travail dès la première image. Le contenu d’appui attend sous la ligne de flottaison, et rien d’autre que la navigation, la ligne de statistiques, la liste de fonctionnalités, le compte à rebours et le clip de fond n’occupe le haut de la page. Un lecteur SaaS reçoit l’offre avant les options.

L’argument de landing page

Comptez les décisions de landing page, elles remontent toutes à un seul document, 21 298 caractères qui nomment le cadre en 1920x1400, la typographie et le rythme. LTX Video énonce la promesse une fois et laisse la composition la répéter au lieu d’ajouter une seconde affirmation.

Le réagencement de landing page

La composition desktop est résolue contre 1920x1400, et la mise en page étroite est dessinée au lieu d’être héritée, la typographie est bornée entre 18px et 23px, la mise en page bascule à 700px et la section est tenue à 100vh. L’animation dispose d’une branche reduced-motion et le média porte une image d’attente, la page communique donc encore quand la lecture automatique est indisponible. Rien d’important n’est supprimé en largeur étroite.

Questions fréquentes

Puis-je reconstruire ce type de landing page de LTX Video avec une autre stack?

La fiche indique un seul fichier HTML autonome pour la provenance, parce que LTX Video a été réalisé avec cette pile technique. Le brief ne décrit que des positions, des tailles et des durées, donc il se reconstruit dans n’importe quel framework capable de composer du texte et de placer des éléments.

Que recevez-vous en copiant le brief de LTX Video?

Ce n’est pas une description d’ambiance mais un brief de construction, avec la composition en 1920x1400, les espacements et les valeurs d’animation. Aucun passage ne prend l’image rendue pour la source de vérité.

D’où vient le design de LTX Video?

Le brief est une description, pas une autorisation de redistribuer les ressources d’un tiers. Gardez la structure et les chiffres, remplacez les médias et les marques, et citez la source si un client demande d’où vient la mise en page. La référence a été capturée en 1920x1400.

Le reproduire dans Studio

Partez de la référence, puis adaptez le contenu et les détails visuels dans Studio.