Produire un GIF animé avec GIMP

Table des matières:

Produire un GIF animé avec GIMP
Produire un GIF animé avec GIMP
Anonim

GIMP est un logiciel remarquablement puissant étant donné qu'il est gratuit. Les concepteurs Web, en particulier, peuvent être reconnaissants de sa capacité à produire des-g.webp

Les-g.webp

Comment créer un-g.webp" />

Les étapes suivantes montrent une animation de la taille d'une bannière Web simple utilisant quelques graphiques de base, du texte et un logo.

Les instructions de cet article s'appliquent à GIMP version 2.10.12.

  1. Ouvrir un nouveau document. Dans cet exemple, nous avons sélectionné le modèle prédéfini Web banner large mobile 320x100.

    Pour votre animation, vous pouvez sélectionner une taille prédéfinie ou définir des dimensions personnalisées en fonction de la manière dont vous utiliserez votre animation finale.

    Pour ce didacticiel, l'animation sera composée de sept images et chaque image sera représentée par un calque individuel, ce qui signifie que le fichier GIMP final aura sept calques, y compris l'arrière-plan.

  2. Définir la première image. L'animation commencera par un espace vide, donc aucune modification du calque Background réel n'est nécessaire car il est déjà blanc.

    Cependant, une modification du nom du calque dans la palette Layers est nécessaire. Faites un clic droit sur le calque Arrière-plan dans la palette et sélectionnez Modifier les attributs du calque.

    Image
    Image
  3. Dans la boîte de dialogue Edit Layer Attributes qui s'ouvre, ajoutez (250ms) à la fin du nom du calque. Cela définit la durée d'affichage de cette image dans l'animation. Le ms signifie millisecondes et chaque milliseconde est un millième de seconde. Cette première image s'affichera pendant un quart de seconde.

    Image
    Image
  4. Définir la deuxième image. Pour le didacticiel, un graphique d'empreinte est utilisé pour ce cadre. Accédez à Fichier > Ouvrir en tant que calques et sélectionnez le fichier graphique. Cela place l'empreinte sur un nouveau calque qui peut être positionné selon les besoins à l'aide de l'outil Move Tool.

    Image
    Image
  5. Comme pour le calque d'arrière-plan, ce nouveau calque doit être renommé pour attribuer le temps d'affichage de l'image. Dans ce cas, 750 ms.

    Dans la palette Calques, l'aperçu du nouveau calque apparaît pour montrer un fond noir autour du graphique, mais en réalité cette zone est transparente.

    Image
    Image
  6. Définissez les images trois, quatre et cinq. Les trois images suivantes sont d'autres empreintes de pas qui traverseront la bannière. Ceux-ci sont insérés de la même manière que le cadre deux, en utilisant les mêmes graphiques et un autre graphique pour l'autre pied. Comme avant, le temps est fixé à 750 ms pour chaque image.

    Chacun des calques d'empreinte a besoin d'un arrière-plan blanc pour qu'un seul cadre soit visible - actuellement, chacun a un arrière-plan transparent. Nous pouvons le faire en créant un nouveau calque immédiatement sous un calque d'empreinte, en remplissant le nouveau calque de blanc, puis en cliquant avec le bouton droit sur le calque d'empreinte et en cliquant sur Merge Down

  7. Set Frame Six. Ce cadre est juste un cadre vide rempli de blanc qui donnera l'apparence de l'empreinte finale qui disparaît avant que le cadre final n'apparaisse. Nous avons nommé cette couche Intervalle et avons choisi d'avoir cet affichage pendant seulement 250 ms.

    Vous n'avez pas besoin de nommer les calques, mais cela peut faciliter le travail avec les fichiers en couches.

    Image
    Image
  8. Set Frame Seven. Ceci est la dernière image et affiche du texte avec le logo Lifewire.com. La première étape consiste à ajouter un autre calque avec un fond blanc.

    Image
    Image
  9. Ensuite, utilisez l' Outil Texte pour ajouter le texte. Ceci est appliqué à un nouveau calque, mais nous nous en occuperons une fois que vous aurez ajouté le logo ou la nouvelle image, ce qui peut être fait de la même manière que les graphiques d'empreinte ont été ajoutés précédemment.

    Image
    Image
  10. Lorsque nous les avons disposés comme vous le souhaitez, nous pouvons utiliser Merge Down pour combiner les calques de logo et de texte, puis fusionner ce calque combiné avec le calque blanc qui a été ajouté précédemment. Cela produit une seule couche qui formera l'image finale et nous avons choisi de l'afficher pendant 4000 ms.

    Image
    Image
  11. Preview the Animation Avant d'enregistrer le-g.webp" />Filters >Animation > Lecture Cela ouvre une boîte de dialogue de prévisualisation avec des boutons explicites pour lire l'animation. Si quelque chose ne semble pas correct, il peut être modifié à ce stade. Sinon, il peut être enregistré en tant que-g.webp" />.

    La séquence d'animation est définie dans l'ordre dans lequel les calques sont empilés dans la palette Layers, en commençant par l'arrière-plan ou le calque le plus bas et en remontant. Si votre animation se déroule dans le désordre, vous devrez ajuster l'ordre de vos calques, en cliquant sur un calque pour le sélectionner et en utilisant les flèches haut et bas dans la barre inférieure de la palette Calques pour changer sa position.

    Image
    Image
  12. Enregistrer le-g.webp" />. Enregistrer un-g.webp" />Fichier > Enregistrer une copie et donnez à votre fichier un nom pertinent et sélectionnez où vous voulez enregistrer votre fichier.

    Image
    Image
  13. Ensuite, allez à Fichier > Exporter sous pour l'enregistrer en tant que-g.webp" />.

    Image
    Image
  14. Dans la boîte de dialogue Export Image qui s'ouvre, sélectionnez Select File Type et faites défiler jusqu'à l'image-g.webp" />. Si vous recevez un avertissement concernant des calques dépassant les bordures réelles de l'image, sélectionnez le bouton Crop.

    Image
    Image
  15. Cela mènera maintenant à la boîte de dialogue Enregistrer au format GIF avec une section Options-g.webp" />. Vous pouvez les laisser par défaut, mais si vous voulez que l'animation ne soit lue qu'une seule fois, vous devez décocher Loop forever.

    Image
    Image
  16. Maintenant, vous pouvez partager votre-g.webp

Conclusion

Les étapes présentées ici vous donneront les outils de base pour produire vos propres animations simples, en utilisant différents graphiques et tailles de document. Bien que le résultat final soit assez basique en termes d'animation, il s'agit d'un processus très simple que toute personne ayant une connaissance de base de GIMP peut réaliser.

Conseillé: