Jak vytvořit gif ve Photoshopu?

Program "Photoshop" je univerzální nástroj, který vám umožní pracovat s různými formáty grafických souborů. Mezi nimi - GIF, pomocí kterého můžete vytvářet tzv. Gify. Co je na těchto souborech zvláštní? Jak vytvořit gif ve Photoshopu?

Můžeme odpovědět na tuto otázku:

  • zkoumání specifik gif;
  • Po prozkoumání základních nástrojů pro vytvoření tohoto typu souboru, které jsou ve Photoshopu.

Začněme od prvního bodu.

Obsah článku

  • Co jsou to GIFy??
  • Algoritmus pro vytváření animovaných gif ve Photoshopu

Co jsou to GIFy??

Pod GIF chápejte nejčastěji animované obrázky v grafickém formátu GIF. Ve většině případů jsou umístěny na webových stránkách a lze je použít například jako reklamní banner, designový prvek na webové stránce nebo jako médium pro multimediální obsah. GIF je jedním z nejběžnějších formátů obrazových souborů, spolu s jpeg, png, BMP. Jeho hlavní výhody, které určují zejména popularitu GIF mezi webovými designéry, jsou:

  • je možné vytvářet malé obrazové soubory (to může výrazně snížit zdroje internetových serverů snížením provozu);
  • Vytváření animovaných obrázků ve formě gifů při používání populárních programů, zejména Photoshopu, je velmi jednoduché - to může začít i nezkušený uživatel;
  • dotyčný grafický formát je univerzální (soubory GIF podporují téměř všechny moderní počítačové platformy, prohlížeče a většina programů pro zpracování grafiky).

Gify dokážou zobrazit ne příliš mnoho barev - pouze 256 (pro srovnání, v jpeg je odpovídající číslo asi 16,7 milionu), ale to je v mnoha případech dostačující pro vytvoření tematických „klipartů“, odznaků, animovaných bannerů nebo videí. Mimochodem, v některých případech zpočátku plně barevné obrázky přeformátované jako GIF vypadají efektně svým způsobem..

Reklama

Známý rys GIF - zobrazující omezený počet barev - by proto neměl být vždy považován za vadu formátu.

Nejčastěji se však GIF stávají populárními díky schopnosti vytvářet animace, když jsou použity. Jejich strukturu lze reprezentovat několika snímky v dané posloupnosti, jakož i algoritmy, podle nichž se určuje doba zobrazení jednotlivých obrazů na obrazovce. Animace pomocí gifů je často konfigurována tak, aby procházela rámy (když se první snímek spustí po skončení přehrávání série). Je třeba poznamenat, že videa ve standardních multimediálních formátech, jako jsou například AVI, Quick Time, MPEG-4, neobsahují interní algoritmy, které umožňují cyklické přehrávání - odpovídající funkci provádí přehrávačový program..

Formát GIF obsahuje analogy - například Apng. Standard Apng je však méně běžný a není tak univerzální. Photoshop to zejména nepodporuje. Na rozdíl od GIF - které tento program dokáže zpracovat různými způsoby. Budeme studovat nejjednodušší algoritmus pro vytvoření odpovídajícího typu animace ve Photoshopu.

na obsah ↑

Algoritmus pro vytváření animovaných gif ve Photoshopu

Klíčový princip pro přesun GIF do pohybu je stejný jako v konvenčním filmu. Jeho struktura je, jak je známo, reprezentována sledem rámců umístěných na plastovém nosiči. Film zase hraje na obrazovce danou rychlostí.

Abychom tedy mohli vytvořit animovaný gif, budeme potřebovat především „snímky“, ze kterých poté sestavíme požadovanou sekvenci, „film“, na který budou muset být umístěny, a mechanismus „reprodukce“ snímků.

První složkou z výše uvedeného čísla mohou být běžné obrázky. Je přípustné je vytvářet v jakémkoli formátu souborů - ve skutečnosti se mohou velmi dobře zapojit GIF, jpg nebo například png a photoshop samotný..

Abychom zvážili algoritmus pro vytváření gifů, používáme Photoshop ve verzi CS6, jeden z nejběžnějších v Rusku a na světě. Ať je to v anglické verzi - mnoho milovníků počítačové grafiky ji preferuje, protože obrovské množství dokumentace pro Photoshop je sestaveno v Shakespearově jazyce.

Otevříme tedy Photoshop, vybereme položku Soubor a poté - Nový. Velikost vytvořeného obrázku je 800 x 200 pixelů.

Poté pomocí nástroje Přechod umístěného na levém panelu můžeme na pozadí obrázku dát nějaký efekt. Jeho aktivace se provádí jednoduše - musíte kliknutím na odpovídající ikonu a podržením levého tlačítka myši nakreslit čáru přímo na obrázek. V závislosti na jeho délce se gradient rozprostírá přes obrázek v jednom nebo druhém poměru.

Pak můžete psát na pozadí, které je vyplněno označenou metodou, nějaký text pomocí vhodného nástroje - Text, který se také nachází na panelu, který je umístěn na levé straně okna Photoshopu. Nechť je slovo na prvním snímku našeho gifu. Jeho zapsáním můžete upravit barvu písma, velikost (odpovídající možnosti po výběru nástroje Text se otevře v horní části okna programu) a přidat tah (kliknutím pravého tlačítka myši na textovou vrstvu, která bude vyvolána, stejně jako text, výběrem možnosti prolnutí a pak tah).

První snímek je připraven. Musí být správně uložen. Vyberte Soubor a poté Uložit jako. Optimálním formátem uloženého souboru je v tomto případě png (pokud je aktivován, jsou písmena relativně hladce zobrazena). Než ji však vyberete ze seznamu navrhovaných rozšíření, měli byste určitě zaškrtnout políčko vedle Uložit kopii. To bude znamenat, že v okně Photoshopu zůstane „zdroj“ tohoto souboru, který lze upravit. Po uložení prvního snímku budeme pokračovat v práci s tímto „zdrojem“.

Tým se rozhodl odlišit kvalitou. Proto opět zvolíme textový nástroj, místo slova píšeme „Rozlišuj“. Bude to druhý snímek - uložte jej vhodným způsobem ve formátu png.

Poté se vrátíme k „zdroji“ a místo slova „Rozlišovat“ zadáme slovo „Kvalita“. Uložte soubor.

Nyní máme k dispozici 3 snímky, ze kterých je docela možné vytvořit animaci formuláře „- liší se jsme v kvalitě“.

Zavřete všechna okna ve Photoshopu (můžete dokonce zcela spolehlivě ukončit program a znovu jej stáhnout). Po - klikněte na Soubor, poté Otevřít a vyberte všechny 3 uložené soubory. Na obrazovce se objeví 3 snímky -, „Rozlišovat“, „Kvalita“.

Nyní musíme provést jednu neobvyklou operaci - uspořádat tyto rámy na sebe. Nejnižší bude samozřejmě. Zbytek mu uložíme. Je to velmi snadné..

Je nutné vybrat nástrojem Move - také v levém panelu klikněte na rámeček „Distinguish“. Poté pomocí klávesové zkratky Ctrl a A musíte vybrat celou oblast obrazu a zkopírovat ji - pomocí Ctrl a C a poté - Ctrl a V, do rámečku. Protože mají stejnou velikost, zkopírovaný obrázek úplně uzavře první. Stejný postup musí být proveden s rámečkem „Kvalita“ - zkopírujte do, uzavřený obrázkem „Rozlišovat“. Nyní budou všechny předchozí snímky uzavřeny slovem „Kvalita“.

Poté přejděte na panel Vrstvy, který se nachází na pravé straně okna Photoshopu, a udělejte neviditelné rámečky umístěné nahoře. Chcete-li to provést, klikněte levým tlačítkem na obrázky malých „očí“ umístěných nalevo od názvu vrstvy (vrstva 1 a vrstva 2).

V důsledku toho bude viditelný pouze rámeček. V tomto případě to bude označeno jako Pozadí, to znamená, že je to pozadí. Naproti němu by mělo být zobrazeno „oko“. Okna se dvěma dalšími soubory - „Rozlišovat“ a „Kvalita“, původně nahranými do programu spolu s rámečkem - lze zavřít.

Dalším krokem je aktivace nejdůležitějšího nástroje Photoshopu, konkrétně časové osy nebo časové osy. Lze to považovat za analog „filmu“ - druhé složky animace. Bude nutné zveřejňovat rámečky, které jsme vytvořili. Chcete-li aktivovat nástroj Časová osa, vyberte položku nabídky Okno a poté - Časová osa.

Poté se ve spodní části okna Photoshopu (pod pracovním prostorem, na kterém je rámeček umístěn, a také dva skryté - „Rozlišovat“ a „Kvalita“) otevře nový panel. Toto je časová osa. Bude mít tlačítko Vytvořit video časovou osu. Měli byste na něj kliknout, poté se načte měřítko animace a v něm jsou tři snímky, se kterými jsme pracovali výše. Pro větší přehlednost můžete přepnout do režimu rámečku - kliknutím na ikonu ve tvaru tří obdélníků, které jsou umístěny vlevo.

Každý snímek bude obsahovat konkrétní snímek. První v řadě bude ten, který odpovídá tomu na obrazovce - na kterém je obraz viditelný, a „Rozlišovat“ a „Kvalita“ - neviditelné obrázky.

Naším úkolem je vytvořit následující snímky jejich umístěním do příslušných rámců. Chcete-li to provést, klikněte na ikonu ve formě čtyř vodorovných pruhů a vyberte Nový rámeček.

Nový rámeček - následující za prvním - bude tedy druhým rámcem. V něm je nutné zase aktivovat obrázek „Rozlišovat“ - tak, aby se objevil v popředí a pokrýval se sám. Chcete-li to provést, vyberte pomocí myši druhý snímek a poté klikněte na malý čtvereček naproti názvu odpovídající vrstvy - vrstva 1. Mělo by se změnit na „oko“, v důsledku čehož bude slovo „rozlišit“ viditelný obrázek na druhém snímku..

Dalším krokem je vytvoření třetího snímku. Podobně pomocí možnosti Nový rámeček. Třetí snímek umístí, respektive, snímek „Kvalita“. V něm musíte zase deaktivovat „oko“ naproti obrázku „Rozlišovat“ a aktivovat odpovídající prvek, který je umístěn naproti požadované vrstvě, tj. Vrstvě 2..

Takto budou všechny tři snímky umístěny postupně na „film“, což je nástroj Časová osa.

Nyní můžete nakonfigurovat některé možnosti pro přehrávání budoucích animací. Například doba trvání každého snímku. Je nutné postupně vybrat všechny snímky - to je snadné udělat pomocí myši, podržením klávesy Ctrl, poté - kliknutím na šipku umístěnou na pravém okraji snímku, poté - vyberte požadovanou hodnotu pro odpovídající parametr. Například - 2 sekundy.

Dalším krokem je použití mechanismu „přehrávání“ animace. Ve skutečnosti bude samotný soubor GIF jako takový fungovat. Abyste ji mohli vytvořit, musíte uložit naši animaci v tomto formátu. Klikněte na Soubor po - vyberte položku nabídky Uložit pro web. Otevře se okno nastavení GIF.

Má obrovské množství možností. Můžete s nimi experimentovat. Ale zatím nic neměníme, ať je vše nastaveno jako výchozí. Klikněte na Uložit, zadejte název souboru GIF a místo, kam by měl být uložen.

Otevírání hotových animovaných gifů je nejlepší v každém prohlížeči. Faktem je, že pokud spustíte soubor GIF v editoru, snímky se pravděpodobně nebudou přehrávat..

Pokud v prohlížeči otevřete gif - například Opera, Mozilla, Chrome, Internet Explorer, spustí se animace, ve které se budou postupně přehrávat slova „Rozlišovat“, „Kvalita“..

Takže jsme se naučili, jak ve Photoshopu dělat gify. Namísto rámců, které používáme, lze použít jakýkoli druh obrázků a jejich počet může být velmi velký - bude omezen pouze výkonem počítače. Pokud si přejete, je snadné vytvořit ve Photoshopu pomocí dostupných nástrojů pro práci s animací GIF, celou karikaturu nebo například prezentaci.