Animácia rozhrania - kurz 31 900 RUB. z Uprocku, tréning 4 mesiace, dátum 28.11.2023.

instagram viewer

TEÓRIA

Úvod

V tejto lekcii získate predstavu o tom, čo je webová animácia, aké funkcie vykonáva pri návrhu rozhrania a v akých prípadoch sa používa. Dozviete sa, aké dva typy animácií sa používajú na reálnych weboch. Získajte kľúčové tipy, ako vytvoriť plynulé, jednoduché a vždy relevantné animácie. Dozviete sa, ktoré techniky je najlepšie nepoužívať v realistických animáciách a prečo. Rozoberieme základné animačné akcie a pozrieme sa na ne s príkladmi. Poďme zistiť, aké programy je potrebné nainštalovať na školenie a pohodlnú prácu. Kde a ako sa zaregistrovať, ktorý tarifný plán si vybrať. Dostanete dva užitočné pluginy – AEUX a Motion Tool, ktoré vám umožňujú optimalizovať niektoré kľúčové pracovné procesy v Adobe After Effects a výrazne uľahčíte proces vytvárania animácií a zoznámite sa s programom After Účinky.

• Úvod do webovej animácie
• teória
• Inštalácia programov
• Rozhranie a nastavenie After Effects

PRAXE

Animácia vzhľadu

V tejto lekcii sa naučíte najzákladnejšiu a najpopulárnejšiu animáciu – animáciu vzhľadu a vlastnosť Opacity. Tento praktický návod je štruktúrovaný tak, aby ste dostali podrobné pokyny, ako krok za krokom vytvoriť animáciu vzhľadu. Povieme si, čo je to rendering a prečo je to potrebné. Pozrime sa na funkciu Track Matte a jej prvú vlastnosť – Alpha Matte (alfa maska). Vďaka tomu získate základnú zručnosť práce s vlastnosťami Opacity, Alpha Matte (alfa maska) a vytvoríte záber s krásnou animáciou vzhľadu.

PRAXE

Scéna s komplikovaným vzhľadom

Pozrime sa na kombináciu, ktorá pozostáva z dvoch animácií: vzhľadu (už ho poznáte) a pohybu (toto je pre vás nový typ animácie). Tomu poslednému sa budeme venovať podrobnejšie. Na animáciu pohybu využijete parameter Position, ktorý určuje polohu objektu v kompozícii. Tiež sa zoznámite s možnosťou vrstvy Kotviaci bod a naučíte sa ju správne používať. Nakoniec budete animovať záber a naučíte sa vytvárať pôsobivé animácie z rôznych typov animácií.

PRAXE

Práca s pohybovými nástrojmi

V lekcii si podrobne preštudujete skript Motion Tools. V praxi sa presvedčte, aký pohodlný je tento nástroj. V skutočnosti výrazne urýchľuje pracovný proces. Dôkladne pochopíte, čo je Velocity Graph, Easing, ako fungujú Bezierove krivky v After Effects a ako ovplyvňujú animáciu. Nakoniec sa podrobne naučíte, ako prispôsobiť svoju animáciu pomocou Motion Tools, čo výrazne optimalizuje váš zážitok z animácie.

• Všeobecné pojmy
• Motion Tools v2.0

PRAXE

Animácia priblíženia (pomocou masky alfa)

Dozviete sa, ako môžete zobraziť animácie zobrazovaných fotografií. Kľúčovou vlastnosťou, ktorú sa naučíte v tomto návode, je parameter Mierka vrstvy. S jeho pomocou môžete zmeniť veľkosť objektu. Táto animácia sa nazýva animácia zmeny mierky (pomocou Alpha Matte). Zmenšíme samotný Alpha Matte (alfa masku) a obrázok v ňom spolu s animáciou vzhľadu, ktorú ste si už naštudovali. Vďaka tomu sa naučíte efektívne animovať fotografie.

PRAXE

Paralaxná animácia

Dôkladne pochopíte, ako aplikovať jeden z najpopulárnejších efektov – paralaxu. Na jeho implementáciu budete potrebovať 3 dizajnové prvky a už známu vlastnosť Position. Po vytvorení efektu paralaxy prídete na to, ako použiť reverznú animáciu, aby sa zacyklila. Nakoniec sa naučíte vytvárať zábery, ktoré využívajú efekt paralaxy na vytvorenie pocitu hĺbky a rozmeru, ktorý na divákov zanechá silný dojem.

PRAXE

Komplexná scéna s aplikáciou paralaxy, pohybu a masky

V tomto návode sa naučíte, ako vytvárať zložité animácie, ktoré zahŕňajú animácie, ktoré ste sa naučili v predchádzajúcich kapitolách. šprinty, a to: Vzhľad – Nepriehľadnosť, Pohyb – Pozícia, Škálovanie – Mierka, aplikácia Alpha Matte (alfa masky) a Efekt paralaxa. Novým typom animácie pre vás bude vzhľad nadpisu v oblasti masky. Naučíte sa vytvárať zložité scény s prechodmi pomocou všetkých týchto typov animácií, ktoré pomôžu vašim záberom vyniknúť od ostatných.

PRAXE

Adaptívna animácia

Pozrieme sa na koncept adaptívnej animácie. Toto je už známa animácia priblíženia, ktorú použijete na demonštráciu responzívnych verzií webu, keď sa rozloženie pracovnej plochy plynulo premení na rozloženie mobilného telefónu. Na jej vytvorenie využijete predtým naučené vlastnosti, ako je pohyb – poloha, mierka – mierka, zmiznutie/vzhľad – nepriehľadnosť, spätná animácia – pohybové nástroje 2/klon. Vedieť, ako správne implementovať adaptívnu animáciu, vám umožní efektívne prezentovať vaše projekty.

PRAXE

Animácia rotácie

Naučíte sa jednoduchú animáciu – rotácie a vlastnosť Rotation object, ktorá má na starosti rotáciu vrstvy okolo jej kotviaceho bodu. Pozrieme sa na tri parametre Rotation: počet otáčok, množstvo, o ktoré chceme prvok otočiť (v stupňoch), otáčanie v smere/proti smeru hodinových ručičiek. Po prejdení každého z opakujúcich sa animačných cyklov krok za krokom si časom osvojíte zručnosť práce s vlastnosťou Rotation a vytvoríte záber s animáciou rotácie, ktorý upúta pozornosť divákov.

PRAXE

Komplexná animácia pozostávajúca zo všetkých základných animácií

Pozrime sa na zložitejšiu kombináciu, ktorá pozostáva zo všetkých základných animácií, ktoré poznáte. V tejto lekcii sa dotkneme témy vytvorenia efektu simulácie kliknutia na obrázok pomocou animácie zmenšenia a miznutia kruhu (Ellipse Tool). Vďaka tomu sa naučíte postupnosť rôznych animácií, čo vám umožní vytvárať komplexnejšie a pôsobivejšie animácie.

PRAXE

Práca so scénami

Táto lekcia je cyklus, ktorý pozostáva z 3 šprintov. Zameriava sa na alternatívne prechody scén. Najprv sa bližšie pozrieme na pojem „scéna“ a prediskutujeme, aké prechody medzi scénami existujú. Naučíte sa, ako používať 3 neštandardné možnosti zmeny scén: výmena masky, výmena závesu a výmena diapozitívov. Na vytvorenie prechodu „zmeny masky“ pochopíte a naučíte sa pracovať s novým parametrom Track Matte – Alpha Inverted Matte alebo Inverted Alpha Mask. A naučte sa, ako importovať video do kompozície animácie.

PRAXE

Animácia zmeny farby

V tomto návode sa naučíte pracovať s farebnou animáciou a vlastnosťou Color layer. Jednoduchá animácia, ktorú možno použiť na demonštráciu pohybu tlačidiel alebo odkazov. My sa však pozrieme na zaujímavejšiu možnosť, ako môžete svoj projekt krásne prezentovať pomocou animácie zmeny farieb.

PRAXE

Animácia cesty (orezanie)

Naučíte sa nový parameter Trim Path, ktorý sa dá použiť na vytvorenie veľmi cool efektov pohybu po dráhe, alebo inými slovami, efektov orezania cesty. Napríklad, keď chcú zobraziť predbežné načítanie, indikátor priebehu v prehrávači videa atď.

PRAXE

Komplexná animácia

V tejto lekcii budete opäť pracovať s komplexnou animáciou, upevníte si predtým nadobudnuté zručnosti a vytvoríte záberovú animáciu s novými efektmi s využitím všetkých rovnaké základné vlastnosti animácie: vzhľad, pohyb, maska, mierka, prechod medzi scénou 1 (zmena masky), prechod medzi scénou 2 (zmena záves).

PRAXE

Ozdobná animácia textu (chyba)

Táto lekcia začína ďalší malý cyklus pozostávajúci z 3 lekcií o dekoratívnej animácii textu. V tejto lekcii sa naučíte, ako urobiť taký mimoriadny efekt, akým je Glitch – efekt „rozbitého“ obrazu alebo televízneho rušenia. Tento efekt v animácii vyzerá celkom módne a vytvára efekt wow. Je celkom jednoduché vytvoriť

PRAXE

Ozdobná animácia textu (skript)

V tejto lekcii sa naučíte, ako vytvoriť animáciu, ktorá simuluje veľký text. Táto technika sa často používa na umiestnenie akcentov na webovú stránku a vyzerá celkom esteticky. Na túto animáciu použijete nový nástroj Pero. Buďte pripravení na tvrdú prácu a buďte trpezliví. V dôsledku toho získate krásnu animáciu, ktorú môžete použiť na prezentáciu svojich projektov.

PRAXE

Kreatívna textová animácia

V tejto lekcii opäť nájdete animáciu textu, ale kreatívnejšiu a nezvyčajnú. Jeho zaujímavý efekt spočíva v kombinácii rôznych animácií pomocou dvoch alfa masiek – jednoduchej a inverznej. V dôsledku toho vytvoríte skvelý záber a túto metódu môžete použiť vo svojich projektoch na efektívne prezentácie.

PRAXE

Komplexná animácia

V tomto návode použijeme typy animácií, ktoré už poznáte, no niektoré z nich použijeme na vytvorenie zložitejších a neštandardných efektov. Výsledkom je komplexná, komplexná animácia, ktorá pozostáva z troch scén s prechodmi, posúvaním a zmenami snímok.

PRAXE

Animácia pomocou Luma Matte

V predchádzajúcich lekciách sme diskutovali o parametroch Track Matte a už máte dobrú predstavu o princípe fungovania Alpha Matte a Alpha Inverted Matte. V tomto návode preskúmame nasledujúce dve možnosti Track Matte: Luma Matte a Luma Inverted Matte a naučíme sa, ako ich aplikovať na naše projekty.

PRAXE

Animácia pomocou Turbulent Displace

Poďme študovať animáciu pomocou efektu skreslenia fotografie. Turbulent Displace je jedným z nástrojov parametra Distort. Technicky ide o mierny posun pixelov, ktorý pomáha vytvárať vlnový efekt a často sa používa na efekt na fotografiách.

PRAXE

Komplexná komplexná animácia

Posledná tréningová lekcia, kde vytvoríme komplexnú komplexnú animáciu s využitím predtým naučených typy animácií a nový – parameter Text a jeho vlastnosť „Zdrojový text“, ktorá umožňuje meniť obsah textu vrstva. Samostatná praktická časť, kde vymyslíte a vytvoríte animáciu pre svoj záber od nuly, ako aj niekoľko zaujímavých a užitočných bonusových video lekcií

PRAXE

Vytváranie animácií od začiatku

Určenie štýlu, vyhľadávanie referencií, tvorba skriptu. Princíp tvorby nápadov na scény a prechody medzi nimi, príprava zdrojového kódu, vytvorenie animácie 1 scény, zverejnenie záberu na sieťach.

PRAXE

Správa a propagácia driblingového účtu

Správa a propagácia driblingového účtu. Animácie pre prezentácie a Behance. Použitie animácie z After Effects na webovej stránke.