Ako vytvoriť gif vo Photoshope?

Program "Photoshop" je univerzálny nástroj, ktorý vám umožňuje pracovať s rôznymi formátmi grafických súborov. Medzi nimi - GIF, pomocou ktorého môžete vytvárať tzv. Gify. Čo je na týchto súboroch zvláštne? Ako vytvoriť gif vo Photoshope?

Môžeme na túto otázku odpovedať:

• skúmanie špecifík gif;
• Po preskúmaní základných nástrojov na vytvorenie tohto typu súboru, ktoré sú vo Photoshope.

Začnime od prvého bodu.

Obsah článku

• Čo sú to GIFy??
• Algoritmus na vytváranie animovaných GIFov vo Photoshope

Čo sú to GIFy??

Pod GIF chápajte najčastejšie animované obrázky v grafickom formáte GIF. Vo väčšine prípadov sú umiestnené na webových stránkach a môžu sa použiť napríklad ako reklamný banner, dizajnový prvok na webovej stránke alebo ako médium na multimediálny obsah. GIF je jedným z najbežnejších formátov obrazových súborov spolu s jpeg, png, BMP. Medzi jeho hlavné výhody, ktoré určujú najmä popularitu GIF medzi návrhármi webových stránok, patria:

• je možné vytvárať malé obrazové súbory (čo môže výrazne znížiť zdroje internetových serverov znížením prenosu);
• Vytváranie animovaných obrázkov vo forme gif pri používaní populárnych programov, najmä Photoshop, je veľmi jednoduché - dokonca aj neskúsený používateľ to môže začať;
• príslušný grafický formát je univerzálny (súbory GIF sú podporované takmer všetkými modernými počítačovými platformami, prehliadačmi a väčšinou grafických spracovateľských programov).

Gify dokážu zobraziť nie príliš veľa farieb - iba 256 (na porovnanie, v jpeg je to asi 16,7 milióna), ale v mnohých prípadoch to stačí na vytvorenie tematických „klipartov“, odznakov, animovaných bannerov alebo videí. Mimochodom, v niektorých prípadoch pôvodne farebné obrázky preformátované ako GIF vyzerajú pôsobivo svojím spôsobom..

Preto by sa uvedený znak GIF, ktorý má obmedzený počet farieb, nemal vždy považovať za chybu formátu.

Najčastejšie sa však GIF stávajú populárnymi vďaka schopnosti vytvárať animácie, keď sa používajú. Ich štruktúru je možné reprezentovať niekoľkými snímkami v danej sekvencii, ako aj algoritmami, podľa ktorých sa určuje trvanie zobrazenia jednotlivých obrazov na obrazovke. Animácie pomocou gifov sú často nakonfigurované tak, aby prechádzajú jednotlivými snímkami (keď sa prvý obrázok spustí po dokončení prehrávania série). Je možné poznamenať, že klipy v štandardných multimediálnych formátoch, ako sú napríklad AVI, Quick Time, MPEG-4, neobsahujú interné algoritmy, ktoré umožňujú prehrávanie slučky - zodpovedajúcu funkciu vykonáva prehrávač..

Formát GIF má analógy - napríklad Apng. Norma Apng je však menej bežná a nie je tak univerzálna. Photoshop to najmä nepodporuje. Na rozdiel od GIF - ktoré tento program dokáže spracovať rôznymi spôsobmi. Budeme študovať najjednoduchší algoritmus na vytvorenie zodpovedajúceho typu animácie vo Photoshope.

Algoritmus na vytváranie animovaných GIFov vo Photoshope

Kľúčový princíp presunu GIF do pohybu je rovnaký ako v konvenčnom filme. Jeho štruktúru predstavuje, ako je známe, postupnosť rámov umiestnených na plastovom nosiči. Film zase hrá na obrazovke danou rýchlosťou.

Preto, aby sme vytvorili animovaný gif, budeme potrebovať predovšetkým „snímky“, z ktorých potom zostavíme požadovanú sekvenciu, „film“, na ktorý budú musieť byť umiestnené, ako aj mechanizmus „reprodukcie“ snímok.

Prvým komponentom z vyššie uvedeného čísla môžu byť bežné obrázky. Je možné ich vytvárať v ľubovoľnom formáte súborov - skutočne sa do nich môžu zapojiť GIF, jpg alebo napríklad png a samotný photoshop..

Na zváženie algoritmu na vytváranie gif používame Photoshop vo verzii CS6, jeden z najbežnejších v Rusku a na svete. Nech je to v anglickej verzii - mnoho milovníkov počítačovej grafiky ho preferuje, pretože obrovské množstvo dokumentácie pre Photoshop je zostavené v Shakespearovom jazyku.

Preto otvoríme Photoshop, vyberieme položku File a potom - New. Nechajte veľkosť vytvoreného obrázka 800 x 200 pixlov.

Potom pomocou nástroja Gradient, ktorý sa nachádza na ľavom paneli, môžeme dať pozadiu obrázka určitý efekt. Jeho aktivácia sa vykonáva jednoducho - musíte kliknutím na príslušnú ikonu a podržaním ľavého tlačidla myši nakresliť čiaru priamo na obrázok. V závislosti od jeho dĺžky sa gradient v jednom alebo druhom pomere rozloží na obrázok.

Potom môžete na pozadí, ktoré je vyplnené označenou metódou, napísať text pomocou príslušného nástroja - Text, ktorý sa tiež nachádza na paneli, ktorý sa nachádza na ľavej strane okna Photoshopu. Nech je slovo na prvom ráme nášho gifu. Jeho napísaním môžete upravovať farbu písma, veľkosť (príslušné možnosti po výbere nástroja Text sa otvoria v hornej časti okna programu) a pridať ťah (kliknutím pravým tlačidlom myši na textovú vrstvu, ktorá sa bude volať, rovnako ako text, výberom možnosti Blending Options a potom zdvih).

Prvý rám je pripravený. Musí sa správne uložiť. Vyberte Súbor a potom Uložiť ako. Optimálnym formátom uloženého súboru je v tomto prípade png (keď je aktivovaný, písmená sa zobrazujú relatívne plynulo). Pred výberom zo zoznamu navrhovaných rozšírení by ste však určite mali začiarknuť políčko vedľa položky Uložiť kópiu. To znamená, že v okne Photoshopu zostane „zdroj“ tohto súboru, ktorý je možné editovať. Po uložení prvého rámca budeme pokračovať v práci s týmto „zdrojom“.

Tím sa rozhodol rozlišovať podľa kvality. Preto znova vyberieme nástroj Text, namiesto slova píšeme „Rozlišuj“. Toto bude druhý rámec - uložte ho vhodným spôsobom vo formáte png.

Potom sa vrátime k „zdroju“ a namiesto „rozlíšenia“ zadáme slovo „kvalita“. Uložte súbor.

Teraz máme k dispozícii 3 snímky, z ktorých je celkom možné vytvoriť animáciu formulára „- kvalita sa líši“.

Zatvorte všetky okná vo Photoshope (program môžete dokonca úplne ukončiť kvôli spoľahlivosti a potom ho znova stiahnuť). Po - kliknite na Súbor, potom na Otvoriť a vyberte všetky 3 uložené súbory. Na obrazovke sa objavia 3 snímky -, „Rozlišujte“, „Kvalita“.

Teraz musíme vykonať jednu nezvyčajnú operáciu - usporiadať tieto snímky nad sebou. Najnižšia bude samozrejme. Zvyšok mu uložíme. Je to veľmi ľahké..

Je potrebné, aby ste vybrali nástroj na presun - tiež na ľavom paneli kliknite na rámček „Rozlišovať“. Potom pomocou klávesových skratiek Ctrl a A musíte vybrať celú oblasť obrázka a skopírovať ju - pomocou klávesov Ctrl a C a potom - Ctrl a V, do rámčeka. Keďže majú rovnakú veľkosť, skopírovaný obrázok úplne uzavrie prvý. Rovnaký postup sa musí vykonať s rámčekom „Kvalita“ - skopírujte ho a zatvorte obrázkom „Rozlišovať“. Teraz budú všetky predchádzajúce snímky uzavreté slovom „Kvalita“.

Potom prejdite na panel vrstiev, ktorý sa nachádza na pravej strane okna Photoshopu, a urobte rámčeky umiestnené na hornom okraji neviditeľnými. Ak to chcete urobiť, kliknite ľavým tlačidlom myši na obrázky malých „očí“ umiestnených naľavo od názvu vrstvy (vrstva 1 a vrstva 2).

V dôsledku toho bude viditeľný iba rám. V takom prípade sa označí ako Pozadie, to znamená, že ide o pozadie. Naproti nemu by sa malo zobraziť „oko“. Okná s dvoma ďalšími súbormi - „Rozlišovať“ a „Kvalita“, pôvodne načítané do programu spolu s rámom - je možné zatvoriť..

Ďalším krokom je aktivácia najdôležitejšieho nástroja Photoshop, konkrétne časovej osi alebo časovej osi. Dá sa považovať za analóg „filmu“ - druhej zložky animácie. Bude potrebné uverejniť rámce, ktoré sme vytvorili. Ak chcete aktivovať nástroj Časová os, vyberte položku ponuky Okno a potom - Časová os.

Potom sa v dolnej časti okna photoshopu otvorí nový panel (pod pracovným priestorom, na ktorom je rám umiestnený, ako aj dva skryté panely - „Rozlišovať“ a „Kvalita“). Toto je časová os. Bude mať tlačidlo Vytvoriť video časovú os. Mali by ste naň kliknúť, potom sa načíta mierka animácie a v nej sú tri snímky, s ktorými sme pracovali vyššie. Pre jednoduchšie prepnutie do režimu snímok - kliknutím na ikonu v tvare troch obdĺžnikov, ktoré sú umiestnené vľavo..

Každý rámec bude obsahovať špecifický rámec. Prvý riadok bude ten, ktorý sa zhoduje s obrázkom na obrazovke - na ktorom je obrázok viditeľný, a „Rozlišovať“ a „Kvalita“ - neviditeľné obrázky..

Našou úlohou je vytvoriť ďalšie rámce umiestnením do zodpovedajúcich rámcov. Kliknite na ikonu vo forme štyroch vodorovných pruhov a vyberte Nový rám.

Nový rámec - nasledujúci po prvom - bude teda druhým rámcom. V ňom je potrebné zasa aktivovať obraz „Rozlišovať“ - tak, aby sa objavil v popredí a zakryl sa. Vyberte myšou druhý rámček a potom kliknite na malý štvorec oproti názvu zodpovedajúcej vrstvy - vrstva 1. Mala by sa zmeniť na „oko“, v dôsledku čoho bude slovo „rozlíšiť“ viditeľný obrázok na druhom rámčeku..

Ďalším krokom je vytvorenie tretieho rámca. Podobne pomocou možnosti Nový rám. Tretí rámec umiestni rám „Kvalita“. V ňom musíte zase deaktivovať „oko“ oproti obrázku „Rozlišovať“ a aktivovať zodpovedajúci prvok, ktorý sa nachádza oproti požadovanej vrstve, tj vrstve 2..

Všetky tri snímky sa tak postupne umiestnia na „film“, ktorý je nástrojom časovej osi.

Teraz môžete nakonfigurovať niektoré možnosti pre prehrávanie budúcich animácií. Napríklad trvanie každého rámca. Je potrebné vybrať postupne všetky snímky - je to ľahké urobiť pomocou myši, držaním Ctrl, potom - kliknite na šípku umiestnenú na pravom okraji snímky, potom - vyberte požadovanú hodnotu pre zodpovedajúci parameter. Napríklad - 2 sekundy.

Ďalším krokom je použitie mechanizmu „prehrávania“ animácie. V skutočnosti bude samotný súbor GIF fungovať ako taký. Ak ju chcete vytvoriť, musíte našu animáciu uložiť v tomto formáte. Kliknite na položku Súbor po - vyberte položku ponuky Uložiť pre web. Otvorí sa okno nastavení GIF.

Má obrovské množstvo možností. Voliteľne môžete s nimi experimentovať. Ale zatiaľ nič nemeníme, nech je všetko nastavené ako predvolené. Kliknite na Uložiť, zadajte názov súboru GIF a miesto, kam by mal byť uložený.

Otváranie hotových animovaných gif je najlepšie v každom prehliadači. Faktom je, že ak spustíte súbor GIF v editore, snímky sa pravdepodobne nebudú prehrávať..

Ak otvoríte gif v prehliadači - napríklad Opera, Mozilla, Chrome, Internet Explorer, spustí sa animácia, v ktorej sa budú postupne prehrávať slová „Rozlišovať“, „Kvalita“..

Takže sme sa vo Photoshope naučili vyrábať gify. Namiesto nami používaných snímok je možné použiť akýkoľvek druh obrázkov a ich počet môže byť veľmi veľký - bude obmedzený iba výkonom počítača. Ak chcete, vo Photoshope je ľahké ho vytvoriť pomocou dostupných nástrojov na prácu s animáciou GIF, celej karikatúry alebo napríklad prezentácie..