Animations de site Web : profitez de la Saint-Valentin pour relooker votre site Web

Le jour de la Saint-Valentin approche à grands pas. En témoignent les cœurs roses présents à chaque coin de rue. Profitez de cette occasion pour partager votre amour avec le monde entier. Nous allons vous expliquer comment créer une pluie magique de cœurs pour votre site Web.

Pour les anti-romantiques parmi vous : les cœurs peuvent être également remplacés en hiver par des flocons de neige ou en automne par des feuilles colorées. Vous pouvez également utiliser nos indications de base pour concevoir votre propre création. Conception d'une animation :

Étant donné qu'une animation est composée de plusieurs images isolées (frames), vous devez d'abord créer chacune de ces frames. Si vous souhaitez par exemple faire déplacer un cercle du bord inférieur gauche vers le bord supérieur droit du site Web, vous devez placer le cercle en bas à gauche dans la première frame et en haut à droite dans la deuxième frame.

Lorsque vous exportez le fichier comme fichier Flash ou visualisez l'aperçu, le programme calcule automatiquement toutes les images intermédiaires afin de créer un mouvement fluide.

En général, vous pouvez animer un objet de différentes manières :

→ Déplacement : déplacer les objets d'un endroit vers un autre

→ Redimensionnement : agrandir ou réduire les objets

→ Déformation : compresser ou incliner les objets

→ Transparence : modifier uniformément la transparence des objets

→ Modification des couleurs : faire changer les objets progressivement de couleur

Création de la 1ère frame :

→ Pour créer un document d'animation, cliquez dans le menu " Fichier " sur " Nouveau ", puis sur " Animation ".

→ Sur l'espace de travail blanc, dessinez les objets de votre choix pour la position initiale (pour notre pluie de cœurs, nous utilisons une série de cœurs).

→ Avec ce symbole : (ICON), attribuez à chaque objet un nom afin que le programme puisse les associer sans problème à leurs positions respectives dans la deuxième frame.

Création de la deuxième frame :

Dans la deuxième frame, vous pouvez appliquer tous les effets qui vont se produire pendant l'animation. Nous souhaitons que la couleur devienne plus sombre et que l'élément change de position pour simuler une pluie.

→ Dans la " galerie des frames d'animation ", cliquez sur " Copier ".

La deuxième frame est d'abord identique à la première. Vous pouvez à présent déplacer, faire pivoter, colorer et déformer les objets.

Nous colorons les cœurs dans une nuance plus sombre et nous déplaçons la série de cœurs vers le bord inférieur de l'image.

Pour visualiser l'apparence de notre création, nous utilisons l'aperçu de la " galerie des frames d'animation ".

Le dégradé de couleurs et le mouvement des cœurs ont été calculés automatiquement par le programme. En effectuant un clic droit et en cliquant sur " Propriétés de la frame ", vous pouvez configurer la durée d'affichage des frames.

Notre pluie de cœurs est terminée et nous devons encore la sauvegarder comme fichier Flash. Vous avez également la possibilité d'ajouter des frames supplémentaires pour créer d'autres animations tendance.

Intégration d'animations sur le site Web :

Pour incorporer votre animation sur votre site Web, vous devez créer un emplacement au-dessus de l'objet sur lequel l'animation doit être affichée.

Comme nous souhaitons que notre pluie de cœurs ruisselle dans le site Web entier, nous allons le recouvrir en dessinant par-dessus un rectangle.

Il ne reste plus qu'à effectuer les étapes suivantes :

→ Sélectionnez un objet

→ Dans " Services > Propriétés Web ", cliquez sur " Emplacement "

→ Cliquez sur " Remplacer par Flash " et ouvrez le fichier Flash sauvegardé

→ Cliquez sur " Appliquer " et " OK "

À votre tour maintenant ! Relookez votre site Web avec des animations tendance dans un style Saint-Valentin. Vous n'avez pas encore de site Web ? Pas de problème ! Téléchargez simplement la version d'essai gratuite du logiciel et testez l'un des nombreux modèles de sites Web proposés.