Vytváření animovaného GIF pomocí GIMPu

Obsah:

Vytváření animovaného GIF pomocí GIMPu
Vytváření animovaného GIF pomocí GIMPu
Anonim

GIMP je pozoruhodně výkonný software na to, že je zdarma. Zejména weboví designéři mohou být vděční za jeho schopnost vytvářet jednoduché animované GIFy.

Animované GIFy jsou jednoduché animace, které uvidíte na mnoha webových stránkách, a přestože jsou mnohem méně sofistikované než animace Flash, je velmi snadné je vytvořit každým, kdo má základní znalosti GIMPu.

Jak vytvořit animovaný-g.webp" />

Následující kroky ukazují jednoduchou animaci velikosti webového banneru s několika základními grafikami, trochou textu a logem.

Pokyny v tomto článku platí pro GIMP verze 2.10.12.

  1. Otevřete nový dokument. V tomto příkladu jsme vybrali přednastavenou šablonu Webový banner velký mobilní 320x100.

    Pro svou animaci si můžete vybrat přednastavenou velikost nebo nastavit vlastní rozměry podle toho, jak budete finální animaci používat.

    V tomto tutoriálu se animace bude skládat ze sedmi snímků a každý snímek bude reprezentován samostatnou vrstvou, což znamená, že konečný soubor GIMPu bude mít sedm vrstev včetně pozadí.

  2. Nastavit první snímek. Animace začne prázdným místem, takže není potřeba měnit skutečnou vrstvu Background, protože je již čistě bílá.

    Je však potřeba změnit název vrstvy v paletě Layers. Klikněte pravým tlačítkem na vrstvu Background v paletě a vyberte Upravit atributy vrstvy.

    Image
    Image
  3. V dialogovém okně Upravit atributy vrstvy, které se otevře, přidejte na konec názvu vrstvy (250 ms). Tím se nastaví doba, po kterou bude tento snímek zobrazen v animaci. ms znamená milisekundy a každá milisekunda je tisícina sekundy. Tento první snímek se zobrazí na čtvrt sekundy.

    Image
    Image
  4. Nastavit snímek dva. Pro tutoriál je pro tento rám použita grafika stopy. Přejděte na File > Otevřít jako vrstvy a vyberte grafický soubor. Tím se půda umístí na novou vrstvu, kterou lze umístit podle potřeby pomocí Nástroje pro přesun.

    Image
    Image
  5. Stejně jako u vrstvy pozadí, i tato nová vrstva musí být přejmenována, aby bylo možné přiřadit čas zobrazení snímku. V tomto případě 750 ms.

    V paletě Layers se zdá, že náhled nové vrstvy zobrazuje kolem grafiky černé pozadí, ale ve skutečnosti je tato oblast průhledná.

    Image
    Image
  6. Nastavte snímky tři, čtyři a pět. Další tři snímky jsou další stopy, které projdou bannerem. Ty se vkládají stejným způsobem jako rám dva, s použitím stejné grafiky a další grafiky pro druhou nohu. Stejně jako dříve je čas nastaven na 750 ms pro každý snímek.

    Každá z vrstev footprintu potřebuje bílé pozadí, aby byl vždy viditelný pouze jeden snímek – v současnosti má každá z nich průhledné pozadí. Můžeme to udělat tak, že vytvoříme novou vrstvu bezprostředně pod vrstvou footprintu, vyplníme novou vrstvu bílou barvou a poté klikneme pravým tlačítkem myši na vrstvu footprintu a klikneme na Sloučit dolů

  7. Nastavit snímek šest. Tento rámeček je pouze prázdný rámeček vyplněný bílou barvou, která dodá vzhled, že konečná stopa zmizí dříve, než se objeví konečný rámeček. Tuto vrstvu jsme nazvali Interval a rozhodli jsme se mít toto zobrazení pouze 250 ms.

    Vrstvy nemusíte pojmenovávat, ale může to usnadnit práci se soubory s vrstvami.

    Image
    Image
  8. Nastavit snímek sedm. Toto je poslední rámeček a zobrazuje text spolu s logem Lifewire.com. Prvním krokem je přidat další vrstvu s bílým pozadím.

    Image
    Image
  9. Poté použijte textový nástroj k přidání textu. Toto se aplikuje na novou vrstvu, ale s tím se vypořádáme, jakmile přidáte logo nebo nový obrázek, což lze provést stejným způsobem, jakým byla dříve přidána grafika stopy.

    Image
    Image
  10. Když to máme uspořádané podle přání, můžeme použít Merge Down ke zkombinování vrstev loga a textu a poté sloučit tuto kombinovanou vrstvu s bílou vrstvou, která byla přidána dříve. To vytvoří jednu vrstvu, která bude tvořit konečný snímek, a rozhodli jsme se ji zobrazit po dobu 4000 ms.

    Image
    Image
  11. Náhled animace Před uložením animovaného-g.webp" />Filtry >Animace > Přehrávání Otevře se dialogové okno náhledu se samovysvětlujícími tlačítky pro přehrání animace. Pokud něco nevypadá správně, lze to v tomto bodě upravit. Jinak jej lze uložit jako animovaný GIF.

    Sekvence animace je nastavena v pořadí, ve kterém jsou vrstvy naskládány na paletě Layers, počínaje pozadím nebo nejnižší vrstvou a směrem nahoru. Pokud se vaše animace přehrává mimo pořadí, budete muset upravit pořadí vrstev tak, že na vrstvu kliknete a vyberete ji a pomocí šipek nahoru a dolů ve spodní liště palety Vrstvy změníte její pozici.

    Image
    Image
  12. Uložte animovaný GIF. Uložení animovaného-g.webp" />File > Uložit kopii a dejte souboru relevantní název a vyberte, kam chcete soubor uložit.

    Image
    Image
  13. Poté přejděte na File > Exportovat jako a uložte jej jako animovaný GIF.

    Image
    Image
  14. V dialogu Exportovat obrázek, který se otevře, vyberte Vyberte typ souboru a přejděte na obrázek-g.webp" />. Pokud se zobrazí upozornění na vrstvy přesahující skutečné okraje obrázku, vyberte tlačítko Crop.

    Image
    Image
  15. To nyní povede k dialogu Uložit jako GIF s částí Možnosti animovaného GIF. Můžete je ponechat na výchozích hodnotách, ale pokud chcete, aby se animace přehrála pouze jednou, zrušte zaškrtnutí Opakovat navždy.

    Image
    Image
  16. Nyní můžete sdílet svůj animovaný GIF.

Závěr

Zde uvedené kroky vám poskytnou základní nástroje pro vytváření vlastních jednoduchých animací s použitím různých grafik a velikostí dokumentů. I když je konečný výsledek z hlediska animace zcela základní, je to velmi snadný proces, kterého může dosáhnout každý se základními znalostmi GIMPu.

Doporučuje: