Vous pouvez ajouter du mouvement à votre site 😎 Que ce soit pour offrir une meilleure expérience utilisateur, mettre en valeur votre contenu, améliorer la compréhension de vos visiteurs, ou renforcer votre marque, il y a toujours une bonne raison de faire du motion design !
Découvrez les clés de création de votre design et de son intégration sur Webflow 👇
Il s'agit d'une technique qui consiste à animer des designs. Tout simplement. De cette façon, les illustrations, les typographies et autres éléments visuels peuvent prendre vie, transmettre des émotions, une histoire ou un message. Pour créer du motion design, on utilise des logiciels de conception graphique, de montage vidéo et de création d'animation pour produire des designs animés de haute qualité.
À force de lire des articles sur Webflow, je pense que vous connaissez l'outil. Si ce n'est pas encore le cas, je vous donne un cours de rattrapage : Webflow est un outil no-code de conception et de développement de sites web. En utilisant cet outil, les utilisateurs peuvent créer un site sans écrire une seule ligne de code. Et pas n'importe quel site ! Si vous souhaitez avoir un site ultra-personnalisé, avec un design réalisé au pixel près et qui provoque un effet wahou auprès de vos visiteurs, Webflow est un très bon choix 🤩
Et si vous souhaitez creuser le sujet, je vous redirige vers cet article sur les raisons d'utiliser Webflow !
Vous souhaitez réaliser votre motion design pour votre site Webflow, mais vous n'avez pas envie d'y passer des heures ? Vous cherchez un outil no-code pour le créer ? Une réponse : Jitter👇
.gif)
Jitter est un outil no-code qui permet de créer du motion design. Cette plateforme est facile à prendre en main pour les utilisateurs qui souhaitent créer des vidéos animées sans compétences en programmation ou en montage vidéo. On peut y télécharger ses propres images, clips vidéos, ajouter des textes, des transitions, de la musique pour ensuite télécharger sa création. Plus concrètement, vous retrouverez sur Jitter des templates éditables pour des visuels animés pour les réseaux sociaux, les sites web, les logos, les stickers, les présentations ...
Vous l'aurez compris, Jitter est un outil utile pour les entreprises, les éducateurs et les créateurs de contenu qui cherchent à produire des vidéos animées de qualité professionnelle sans investir dans des logiciels de montage coûteux.
Lottie est un format de fichier pour le motion design. Il permet aux développeurs d'ajouter facilement des animations sophistiquées dans leurs applications et sites web sans avoir à les créer à partir de zéro 😍!
C'est un format qui est devenu très courant car non seulement il est pris en charge par iOS et Android, et par les navigateurs populaires tels que Chrome, Safari et Firefox mais aussi parce qu'il offre une alternative plus efficace et plus souple aux animations GIF et aux vidéos. Les designs créés dans ce format sont légers et peuvent être intégrés sans impacter significativement les performances de l'application ou du site web.
Le Lottie se transforme en fichier .Json. Ce format vous permettra d'utiliser votre design avec des outils tels qu'Adobe After Effects si vous souhaitez créer des animations complexes à intégrer à votre site Webflow.
Arrivé sur Webflow, vous pourrez retrouver un bloc « Lottie Animation » qui accepte toutes les animations générées en « .json ». Il vous suffira d'ajouter le bloc, de charger votre animation et vous pourrez le manipuler comme n’importe quel bloc sous Webflow 🔥
Maintenant que vous savez comment ajouter de magnifiques designs animés à votre site web, peut-être qu'à côté, vos textes font pâle figure 😅
Pour le savoir, je vous partage un article pour améliorer le copywriting de votre landing page Webflow !
On y va ? 🏃♂️
