Animacija logotipa je postopek uvajanja gibanja ali sprememb vizualnih elementov v logotipu, da postane bolj dinamičen in privlačen. Uporablja se lahko za različne dele logotipa, kot so besedilo, slike, barve in oblike, in ima lahko različne stopnje kompleksnosti, od preprostih animacij, kot je utripanje besedila ali bledenje barv, do zapletenih animacij, ki vključujejo premikajoče se ali interaktivne predmete. učinki.
Animacija logotipa je vse pogostejša. Med pametnimi telefoni in splošnim razvojem internetne tehnologije so logotipi zdaj veliko pogostejši v digitalnem prostoru, kar odpira vrata vizualnim učinkom, kot je animacija, ki pri fizičnih izdelkih ni mogoča. Seveda naraščajoča priljubljenost animacije logotipov pomeni, da jo bo potrebovalo vse več blagovnih znamk, da bodo ostale konkurenčne. Učenje animiranja logotipa je torej lahko dragocena veščina, ki bo vaš logotip ponesla na višjo raven.
Hkrati je programska oprema za animacijo postala bolj vseprisotna, poenostavljena in intuitivna za podporo tej vse večji bazi uporabnikov. Ne glede na to, kako tehnično in zapleteno se sliši animacija logotipa, lahko zdaj tudi začetniki ustvarijo preproste, a učinkovite animacije.
Animacija logotipa v After Effects -
1. korak. Pripravite datoteko z logotipom.
Pravzaprav bomo začeli našo vadnico o tem, kako animirati logotip v Adobe Illustratorju (ali podobni programski opremi za oblikovanje logotipov). To je potrebno za zagotovitev, da je naša datoteka logotip nastavljen za animacijo.
Čeprav je sama programska oprema za animacijo rastrska, morajo biti izvirne datoteke logotipa v vektorski obliki. To vam omogoča, da jih spremenite brez poškodbe za kakovost slike (povečanje obsega rastrskega logotipa na primer povzroči pikselacijo), kar bo kasneje uporabno pri delu s plastmi oblik.
Prepričajte se, da je vaš logotip razdeljen na plasti s pomočjo plošče Sloji.
Tudi logotip mora biti večplasten, ne pa združen v en predmet. To olajša ustvarjanje kompleksnejših animacij z animiranjem posameznih delov logotipa. Nove plasti lahko ustvarite z uporabo " Dodaj nov sloj" na dnu plošče Sloji, nato pa vanje kopirajte in prilepite dele svojega logotipa.
Končno, ker je animacija digitalne narave, delamo tudi z barvami RGB. Če je vaša datoteka Illustrator nastavljena na CMYK, lahko to spremenite tako, da izberete svoj logotip in se pomaknete na Uredi > Uredi barve > Pretvori v RGB.
Ko ste pripravljeni, izvozite svoj logotip kot vektorsko datoteko s polnimi plastmi. Ker so vrste datotek After Effects del družine programske opreme Adobe, bom logotip, ki sem ga ustvaril, shranil kot datoteko AI (Adobe Illustrator), vendar obstaja več različnih vrst vektorskih datotek, med katerimi lahko izbirate, če uporabljate drugo programsko opremo.
2. korak: uvozite svoj logotip v After Effects. Animacija logotipa
Odprite After Effects. Vmesnik se na prvi pogled morda zdi zapleten, zato razčlenimo osnove:
- Orodna vrstica : tukaj lahko dostopate do glavnega grafična orodjakot so orodje Pen, orodje Type itd.
- Projektna plošča : Tukaj upravljate in organizirate medijske datoteke za celoten projekt.
- Okno za sestavo : To je okno za predogled videa, kjer si lahko predogledate animacijo za trenutno kompozicijo (pogosto imenovano kompozicija), na kateri delate. Kompozicije so v bistvu prizori, od katerih ima vsak svojo ločeno časovnico animacije. O kompozicijah bomo podrobneje razpravljali v naslednjem razdelku.
- Časovnica : Tukaj boste ustvarili svojo animacijo. Sestavljen je iz dobesedne časovnice na desni (kjer boste nastavili animacijske dogodke za izvajanje na časovnici) in območja postavitve na levi (kjer boste prekrivali in urejali atribute svojih medijskih sredstev).
- Nadzorna plošča : Tukaj lahko dostopate do različnih podpornih funkcij, kot so medijske informacije, možnosti odstavkov in poravnave ter vnaprej zgrajene knjižnice animacij in vizualnih učinkov, vgrajene v After Effects.
Če niste prepričani o orodju ali gumbu, boste z miško nad njim dobili opis.
Če želite uvoziti datoteko z logotipom, jo preprosto povlecite na ploščo Project ali izberite Mapa" > " Uvozi" > " Mapa" . V naslednjem pogovornem oknu izberite Uvozi predstavnost kot posnetke in združene plasti .
3. korak: Nastavite svojo kompozicijo. Animacija logotipa.
Kompozicija (comp) je vsebnik, ki vam omogoča sestavljanje, urejanje in uporabo animacije v predstavnostnih datotekah. Večja produkcija, kot je film, bo vsebovala več skladb, organiziranih v projektni plošči. Tako si lahko skladbe predstavljate kot en sam prizor v tem filmu in vsaka skladba bo imela svojo ločeno časovnico. V našem primeru animacija logotipa, ki traja manj kot pet sekund, zahteva zelo malo kompozicij.
Če želite prilagoditi svojo kompozicijo, povlecite predstavnostne datoteke na levo stran plošče s časovno osjo.
Začnimo s preprostim ozadjem. Z desno miškino tipko kliknite ploščo postavitve in izberite " Ustvari " > " trdno" . Ker je moj logotip bel, sem izbral enobarvno črna barva, lahko pa izberete poljubno barvo. V naslednjem oknu poimenujte trdno snov (v mojem primeru "BG"), kliknite " Naredi velikost računalnik" in izberite " V REDU" . Zdaj povlecite datoteko z logotipom s plošče Project na ploščo Timeline in v oknu za sestavo bi morali videti predogled vašega logotipa. Če ne, prerazporedite plasti tako, da povlečete trdno ozadje pod datoteko logotipa.
Z desno miškino tipko kliknite datoteko logotipa na plošči postavitve in izberite Ustvari " > " Pretvori v večplastno kompozicijo" . S tem boste datoteko z logotipom spremenili v drugačno sestavo (videli boste, da se je ikona spremenila). Dvoklik na datoteko logotipa bo zdaj odprl nov zavihek in vas popeljal do te nove kompozicije, ki vsebuje vse posamezne plasti, ki ste jih nastavili v Illustratorju. Zdaj lahko vidite, kako kompi delujejo: v bistvu so kot podmape.
Animacija logotipa
Če želite, lahko vsako od teh plasti pretvorite v ločene kompozicije z desnim klikom in izbiro Predhodna sestava" . To bo tej plasti dalo lastno časovnico animacije, ugnezdeno znotraj prejšnje kompozicije. In če želite animirati celoten logotip hkrati, morate uporabiti časovnico, povezano z glavno kompozicijo.
Če tega ne naredimo, poglejmo, kako te časovnice delujejo pri animaciji.
4. korak: Animirajte logotip s ključnimi okvirji
After Effects (in večina programske opreme za animacijo) deluje z uporabo ključnih sličic. Ključni okvirji so v bistvu označevalci, ki jih lahko nastavite na časovni premici, da določite, kdaj naj nastopita začetno in končno stanje vaše animacije.
Na primer, začnimo z zelo preprosto animacijo: bledenje. Objektu so pripeti različni atributi, atributi, ki se spreminjajo v določenem časovnem obdobju, pa so v bistvu animacija. Če si želite ogledati te atribute, kliknite ikono Razširi poleg logotipa, ki ji sledi lastnost "Pretvori" .
Ustvarite ključne sličice tako, da kliknete ikono štoparice poleg Lastnosti na plošči Časovnica.
Za bledečo animacijo želite delati z atributom, ki meri vidnost predmeta: neprozornost. Motnost je nastavljena na 100 %, ker je privzeto logotip v celoti viden.
Kliknite ikono štoparice poleg možnosti Motnost in videli boste romb, kjer je nastavljena oznaka predvajalne glave (bleda modra črta, ki prečka časovnico). To je ključni okvir, v bistvu posnetek trenutne vrednosti določenega atributa. Premaknite ključno sličico tako, da jo kliknete in povlečete do oznake 2 sekundi na časovnici. Povlecite drsnik nazaj na oznako 0 sekund, nato ustvarite še en ključni okvir in nastavite motnost na 0 %. Pritisnite preslednico, da si ogledate animacijo v oknu za kompozicijo.
Po učinkih
Videli boste, da ste ustvarili gladko zatemnitveno animacijo s spremembo motnosti z 0 % na 100 % v 2 sekundah s samo dvema ključnima slikama. Tako je narejena vsa animacija v After Effects. Ustvarite lahko začetni ključni okvir in končni ključni okvir v različnih intervalih vzdolž časovne premice, After Effects pa samodejno izračuna potrebne prehode okvirjev, da pridete od točke A do točke B (tradicionalno imenovani med okvirji v animacijskem poslu).
Preprosta gladka animacija je ustvarjena z uporabo dveh ključnih sličic za lastnost Opacity.
Vidite lahko, da obstaja več atributov, s katerimi lahko delate Preoblikovanje lastnine, ki jih bomo tukaj na kratko razložili. Preizkusite lahko s ključnimi okvirji in spremenite vsakega od njih, da boste občutili njihove animacijske zmogljivosti:
- Položaj : Ta atribut opisuje položaj logotipa v prostoru X, Y na zaslonu postavitve in omogoča animiranje linearnega gibanja.
- Lestvica : ta atribut opisuje velikost logotipa (kot odstotek celotne velikosti izvirne datoteke) in omogoča ustvarjanje animacij za povečavo ali pomanjšanje.
- Rotacija : ta atribut opisuje orientacijo v stopinjah in vam omogoča ustvarjanje rotacijskih animacij.
Nasvet strokovnjaka :
Ko gre za animiranje logotipa, je smiselno delati nazaj (kot smo storili pri zatemnitvi), saj se mora animacija končati na končnem, celotnem logotipu. To pomeni, da morate ustvariti ključne okvirje, preden karkoli spremenite, tako da boste imeli posnetke vrednosti atributov v privzetem stanju. Nato lahko te ključne sličice premaknete na želeno končno točko na časovni premici (ne glede na to, kako dolgo želite, da animacija traja) in ustvarite nove ključne sličice za spremembe na začetku časovne premice.
Korak 5. Animirajte logotip z uporabo plasti oblike.
Zdaj pa preidimo na bolj zanimive tehnike animacije z uporabo plasti oblik. Sloji oblik so predmeti, ki vsebujejo informacije o poti, kot so sidrne točke in povezovalne črte (podobne tistim v vektorskih programih), in manipuliranje z njimi odpre vrata celi vrsti možnosti animacije, ki presegajo Lastnosti transformacije .
Kako izbrati pravo barvo za vaš logotip?
Najprej bomo pretvorili logotip v plast oblike. Na plošči Večplastna kompozicija (plasti, ustvarjene v 3. koraku), izberite vse svoje plasti, kliknite z desno miškino tipko in izberite " Ustvari " > " Ustvarite oblike iz vektorske plasti" . Videli boste, da je vsaka plast podvojena z zvezdico zraven - to je plast oblike. Ugnezdeni pod plastjo oblike boste našli Lastnost vsebine poleg Preoblikovanje lastnine . Desno od Lastnosti vsebine videli boste tudi gumb " dodaj" , ki vam bo omogočil, da izberete še več atributov za animiranje.
Sloji oblik vsebujejo gumb Dodaj (desno od lastnosti Vsebina), ki vam omogoča dodajanje vseh vrst animiranih lastnosti, kot so izrezovalne poti.
Skaliranje predmeta v programu Adobe Illustrator
Obrežite poti
Za svoj logotip sem uporabil dokaj običajno in uporabno animacijo z uporabo lastnosti Trim Paths. Za to sem dodal "Crop Paths" z uporabo gumba " dodaj" na plasti oblike za vsako črko nastavite ključni okvir atributa End na 0 % na začetku časovnice in 100 % po približno 1 sekundi. Kot lahko vidite, se zdi, da obris črk nariše nevidna roka v realnem času.
Z lastnostjo Trim Paths lahko animirate črte, tako da se same narišejo v realnem času.
Poleg tega sem želel ozadju dodati nekaj poudarjene animacije. Ker delam črno-belo, sem izbral učinek zankastega tunela, ki spominja na Twilight Zone. Da bi to naredil, sem uporabil orodje za poligon na plošči Orodja, da sem narisal obliko v središču svoje kompozicije in ustvaril novo plast oblike.
Nato sem dodal lastnost Repeater, centriral položaj in povečal število kopij. To podvaja obliko in ustvarja na videz neskončen predor. Prilagajanje merila poveča prostor med posameznimi kopijami, spreminjanje rotacije pa usmeri kopije v različne smeri za vizualno zanimivost.
Za popestritev sem na začetku časovne premice postavil ključni okvir za odmik 0 in ga pozneje na časovni premici nastavil na negativno vrednost.
Z uporabo plasti poligonalne oblike in lastnosti Repeater sem lahko ustvaril animirano ozadje.
Verjetno ste uganili, da obstaja veliko možnosti za plasti oblik. Res je: na internetu obstajajo popolni spletni tečaji na to temo in vzemite si čas za eksperimentiranje, vajo in učenje.
Prav tako vam ne morem povedati, kateri slog animacije vam ustreza logotip ali kakšna posebna orodja animacij, ki jih boste potrebovali za doseganje tega sloga. Lahko pa vam svetujem, kako to odkriti sami. Poiščite navdih pri drugih animiranih logotipih, kot so vaši konkurenti, blagovne znamke, ki jih občudujete, in/ali spletna mesta, kot sta Pinterest ali Dribbble – tako kot ste storili, ko ste prvotno ustvarili logotip.
Ugotovili boste, da ko jih začnete analizirati z uporabo svojega novega znanja o tem, kako animirati logotip, mnogi od njih temeljijo na preprostih manipulacije z oblikami in transformacijami (tudi tistimi, ki so jasno razplasteni z naprednimi stiliziranimi učinki). Ko najdete nekaj takih, ki so vam všeč, lahko v After Effects delate nazaj in poskusite te animacije narediti obratno za vajo.
6. korak: Nastavite čas.
Pogovorimo se o času, ki opisuje hitrost sličic animacije skozi celotno animacijo. Vizualno predstavitev časa si lahko ogledate v urejevalniku grafov. Če želite to narediti, kliknite ikono grafa (z oznako Urejevalnik grafov, ko miškin kazalec premaknete nad njo) na vrhu plošče s časovno osjo in s tem boste spremenili časovnico v črtni graf.
Če kliknete enega od atributov ključne sličice, boste videli ravno črto od ene ključne sličice do druge. Trenutno, ker smo vključevali samo začetno in končno točko, smo After Effects prepustili merjenju časa. Brez usmerjanja After Effects enakomerno premakne vsak okvir animacije, kar ima za posledico popolnoma ravno črto.
Urejevalnik grafov prikazuje časovno razporeditev ključnih sličic, kot je prikazano v črtnem grafu.
Vendar je namensko spreminjanje časa tisto, kar daje animaciji občutek realizma. Na primer, v animaciji odbijajoče se žoge se žoga zaradi zagona in gravitacije premika počasneje na višini odboja in hitreje, ko se približuje tlom. Z drugimi besedami, skozi celotno animacijo se ne premika z enako hitrostjo, in če bi se, bi izstopal kot robot.
Bezierjeva orodja, ki se nahajajo na dnu urejevalnika grafov, vam omogočajo prilagajanje ukrivljenosti črte grafa.
Pretvori ključne sličice v Auto Bezier
Urejevalnik grafov vam omogoča prilagajanje časa lastne animacije z uporabo tako imenovanih Bezierjevih ročajev za pretvorbo črte grafa v krivuljo. V spodnjem desnem kotu urejevalnika grafov boste videli nekaj ikon s kvadratnimi pikami, pritrjenih na črte – to so orodja Bezier.
Kliknite eno od ključnih sličic in premaknite miškin kazalec nad Bezierjeva orodja, dokler ne najdete tistega z oznako " Pretvori ključne sličice v Auto Bezier" . Ko kliknete na to, se na grafu prikaže rumena oznaka. Če povlečete ta ročaj, se bo črta upognila in to bo spremenilo čas vaše animacije. Kjer je krivulja bolj izrazita, se bodo sličice predvajale hitreje, kjer pa je krivulja bolj gladka, se bodo sličice predvajale počasneje.
Ostrejša krivulja ustreza hitrejši sinhronizaciji, bolj gladka krivulja pa počasnejši sinhronizaciji.
Če želite resnično razumeti nianse prilagajanja lastnega časa, potrebujete izkušnje z animacijo, zato je ročno prilagajanje Bezierjevih krivulj naprednejša tema. V tem vodniku za začetnike priporočam uporabo orodja Bezier Easy Ease (ki uporabi samodejno krivuljo za ključni okvir, ki ga izberete) za vse časovne intervale animacije. Lahko se prijavite Easy Ease na ključni okvir zunaj urejevalnika diagramov, tako da izberete ključni okvir in kliknete z desno miškino tipko.
7. korak: Izvozite svoj logotip.
Ko ste pripravljeni na izvoz končnega animiranega logotipa, izberite " Mapa" > " Izvozi" > " Dodaj Adobe Media Encoder v čakalno vrsto" . After Effects privzeto izvozi datoteka v formatu mp4, ki je primeren za video. Ker želimo ustvariti slikovno datoteko našega logotipa, ki jo je mogoče deliti, jo bomo izvozili kot animirani GIF. V oknu Media Encoder kliknite puščico poleg označene modre vrstice besedila pod besedo "Format" in izberite " Animirani GIF" . Ciljno mapo za končano datoteko lahko nastavite tudi tako, da kliknete modro besedilo pod besedami "Izhodna datoteka".
Če želite izvoziti datoteko, pojdite na Datoteka > Izvozi > Dodaj v čakalno vrsto Adobe Media Encoder in na spustnem seznamu v stolpcu Oblika izberite Animirani gif.
Dvokliknite označeno modro besedilo pod prednastavitvijo, da odprete okno Izvozne možnosti. Obstaja nekaj možnosti, ki si jih boste želeli ogledati, da zmanjšate velikost datoteke: Kakovost (nastavil sem jo na 20), Hitrost sličic (nastavil sem jo na 10, čeprav so za video priporočljive višje hitrosti sličic (fps)) in Trajanje, ki je modra vrstica v predogledu (jaz sem svojo skrajšala na 4 sekunde). Izberite V REDU, da zaprete to okno.
Ko končate, izberite zeleno ikono za predvajanje v zgornjem desnem kotu kodirnika medijev in vaša datoteka bo prikazana v izbrani ciljni mapi. To je to: končana animacija logotipa!
Oživite svojo blagovno znamko z animacijo logotipa.
-
Animacija logotipa je več kot le priljubljen trend, ki so mu znamke prisiljene slediti. Animacija logotipa ima tudi nesporno čarobnost in je odličen način, da ustvarite trenutek vizualnega užitka za vse, ki sodelujejo z vašo blagovno znamko. In na srečo se je programska oprema za animacijo razvila tako, da lahko skoraj vsakdo, ne glede na spretnosti, svojemu logotipu doda malo te čarovnije.
Kljub temu, da je ta vadnica namenjena temu, da začnete z osnovami animacije logotipa, je potrebnih veliko poskusov in napak, vaje in eksperimentiranja, da dobite karkoli, kar presega osnovno animacijo. Če želite resnično posebno animacijo logotipa, je profesionalen animator logotipa vreden naložbe.
Оставить комментарий