Анимация появления в обложке
в обложке оживит первый экран, придаст ему выразительность и создаст первое впечатление от страницы
КАКИЕ ВИДЫ АНИМАЦИИ БЫВАЮТ :
Fondu enchaîné
Появление элемента из прозрачности
Fade in Up
Fondu à gauche
Fondu à droite
Zoom avant
Появление элемента через прозрачность снизу
Появление элемента через прозрачность справа
Появление элемента через прозрачность слева
Появление элемента через увеличение
Появление элемента через прозрачность сверху
Fondu enchaîné vers le bas
ПРИМЕРЫ АНИМАЦИИ
Чаще всего на обложках анимируют заголовок, подзаголовок и кнопки
Une meilleure voie pour votre entreprise
Nous fournissons de nouvelles technologies aux entreprises et aux startups
Sous-titre - Fondu enchaîné
Durée - 1 sec.
Délai - 0,1 sec.
Titre - Fade in Up.
Distance -100 px,
Durée - 1 sec.
Sous-titre - Fade in Up
Durée - 1 sec.
Distance - 30 px
Délai - 0,1 sec.
Titre - Fade In
Durée - 2 sec.
Bouton 1 - Fade in Up
Durée - 1 sec.
Distance - 30 px
Délai - 0,7 sec.
Bouton 2 - Fade in Up
Durée - 1 sec.
Distance - 30 px
Délai - 0,8 sec.
Se sentir chez soi
Un coin café et nourriture au centre ville.
Wineer 12A str., Minereed
Notre menu
Nos contacts
Une nouvelle pizzeria dans la ville
Rue Wineer, 12A, Minereed
Logo - Zoom In
Durée - 1 sec.
Échelle - 90%
Titre - Fade in Up
Durée - 4 sec.
Distance - 100 px
Sous-titre - Fade in Up
Durée - 1 sec.
Distance - 50 px
Délai - 0,3 sec.
Créez votre nouveau site
Essayez l'animation sur la couverture pour créer quelque chose de très spécial
Démarrage
Sous-titre - Fade in Up.
Durée - 0,9 sec.
Distance - 100px
Délai - 0.2
Titre - Fade in Up.
Durée - 1,1 sec.
Distance - 100 px
Bouton - Zoom avant.
Durée - 0,9
Échelle - 30 %
Délai - 1,1 sec
Je suis illustrateur et animateur numérique. Consultez mon portfolio
Sous-titre - Fondu à droite
Durée - 1,4 sec.
Distance - 50 px
Délai - 0,5 sec.
Nom - Fondu enchaîné
Durée - 5 sec.
NOUVEAU
Un magasin de vêtements en ligne à New York
Magasin
Sous-titre - Fade in Up
Durée - 0,6 sec.
Distance - 50 px
Délai - 0,3 sec.
Titre - Zoom In
Durée - 1 sec.
Échelle - 30px
Bouton 1 - Fade in Up
Durée - 1,2 sec.
Distance - 50 px
Délai - 0,4 sec.
Céramiques faites à la main
SAMMO
Nous créons des produits faits main avec amour
Titre - Fade in Down.
Durée - 1,5 sec.
Distance - 150 px
Délai - 0,6 sec.
Logo - Fondu enchaîné.
Durée - 1.7 sec.
Sous-titre - Fondu enchaîné.
Durée - 1,4 sec.
Délai - 1 sec.
zone d'accueil
VOYAGER ENSEMBLE SUR LA TERRE
A propos du projet
Bouton - Fade in Up
Durée - 1sec.
Distance - 30 px
Délai - 0,6 ec.
Logo - fondu enchaîné
Durée - 1,5
Titre - Fondu enchaîné vers le haut.
Durée - 1,5
Distance - 100 px
Délai - 0,3
Traditions de yoga, nouvelles méthodes
Prix
Adresse
A propos de nous
Suivre un cours
Contacts
Titre - Fondu à gauche
Durée - 1,3 sec.
Distance - 150 px
Take class - Fade in
Durée - 1,7 sec.
Délai - 1 sec.
Bouton de contact - Fondu enchaîné
Distance - 100 px
Durée - 1,4 sec.
Jamais
Prix
Adresse
A propos de nous
arrêter
l'amélioration
choses
VIEW CASE
"Never" - Fade in Right
Durée - 1 sec.
Distance - 100 px
Délai - 0 sec.
"View case" - Fade in
Durée - 1,6 sec.
Délai - 0,6 sec.
"Stop" - Fondu à droite
Durée - 1 sec.
Distance - 100 px
Délai - 0,2 sec.
"Improving" - Fade in Right
Durée - 1 sec.
Distance - 100 px
Délai - 0,2 sec.
"Things" - Fade in Right
Durée - 1,6 sec.
Distance - 100 px
Délai - 0,4 sec.
HEBERT
Biographie
Personnages
Chronologie
INTERVIEW
JULIEN
1. JULIEN - Fondu à gauche
Durée - 1 sec.
Distance - 100 px
5. Flèche vers le bas - Fondu vers le bas
Durée - 0,5 sec.
Distance - 100 px
Délai - 1,4 sec.
2. HEBERT - Fade in Left
Durée - 1 sec.
Distance - 100 px
Délai - 0.1 sec.
3. "Interview" - Fondu à gauche
Durée - 0,5 sec.
Distance - 100 px
Délai - 1 sec.
4. Réseaux sociaux - Fade in Down
Durée - 0,5 sec.
Distance - 100 px
Délai - 1,2 sec.
6. "All interviews" - Fade in Down
Durée - 0,5 sec.
Distance - 100 px
Délai - 1,4 sec.
7. Logo, menu, hamburger - Fondu à gauche
Durée - 1 sec.
Distance - 100 px
Délai 1,7-1,9sec.
Tous les entretiens
ВИДЕО УРОК
Как повторить анимацию в редакторе Тильды