Logo animatsioon on protsess, mille käigus tutvustatakse liikumist või logo visuaalseid elemente muudetakse, et muuta see dünaamilisemaks ja atraktiivsemaks. Seda saab rakendada logo erinevatele osadele, nagu tekst, pildid, värvid ja kujundid, ning see võib olla erineva keerukusega, alates lihtsatest animatsioonidest, nagu teksti vilkumine või tuhmumine, kuni keeruliste animatsioonideni, mis hõlmavad liikuvaid või interaktiivseid objekte. mõjusid.
Logo animatsioon muutub üha tavalisemaks. Nutitelefonide ja internetitehnoloogia üldise arengu vahel on nüüd digitaalsetes ruumides palju enam levinud logod ja see avab ukse visuaalsetele efektidele nagu animatsioon, mida füüsiliste toodetega pole võimalik teha. Loomulikult tähendab logoanimatsiooni kasvav populaarsus, et üha rohkem kaubamärke vajab seda konkurentsis püsimiseks. Nii et logo animeerimise õppimine võib olla väärtuslik oskus, mis viib teie logo järgmisele tasemele.
Samal ajal on animatsioonitarkvara muutunud üldlevinud, sujuvamaks ja intuitiivsemaks, et toetada seda kasvavat kasutajaskonda. Nii et hoolimata sellest, kui tehniline ja keeruline logoanimatsioon ka ei kõlaks, saavad isegi algajad nüüd luua lihtsaid, kuid tõhusaid animatsioone.
Logo animatsioon rakenduses After Effects –
1. samm. Valmistage ette oma logofail.
Tegelikult alustame oma õpetust logo animeerimiseks Adobe Illustratoris (või sarnases logokujundustarkvaras). See on vajalik tagamaks, et meie fail animatsiooni jaoks loodud logo.
Kuigi animatsioonitarkvara ise on raster, peavad algsed logofailid olema vektorvormingus. See võimaldab teil neid ilma muuta kahju pildikvaliteedi jaoks (näiteks rasterlogo skaala suurendamine viib pikslistumiseni) ja sellest on hiljem kasu kujukihtidega töötades.
Veenduge, et teie logo oleks kihtide paneeli abil jagatud.
Samuti peaks logo olema mitmekihiline, mitte grupeeritud üheks objektiks. See muudab logo üksikute osade animeerimise abil lihtsaks keerukamate animatsioonide loomise. Saate luua uusi kihte kasutades " Lisa uus kiht" paneeli Kihid allservas ning seejärel kopeerige ja kleepige osad oma logost neisse.
Lõpuks, kuna animatsioon on oma olemuselt digitaalne, töötame ka RGB värvidega. Kui teie Illustratori failiks on seatud CMYK, saate seda muuta, valides oma logo ja navigeerides menüüsse Redigeerimine > Redigeeri värve > Teisenda RGB-vormingusse.
Kui olete valmis, eksportige oma logo täielikult kihilise vektorfailina. Kuna After Effectsi failitüübid kuuluvad Adobe'i tarkvaraperekonda, salvestan loodud logo AI-failina (Adobe Illustrator), kuid kui kasutate muud tarkvara, saate valida mitme erinevat tüüpi vektorfailide vahel.
2. samm: importige oma logo rakendusse After Effects. Logo animatsioon
Avage After Effects. Liides võib esmapilgul tunduda keeruline, seega võtame põhitõed lahti:
- Tööriistariba : siit pääsete juurde põhile graafikatööriistadnagu pliiatsitööriist, tüüptööriist jne.
- Projekti paneel : siin saate hallata ja korraldada kogu projekti meediafaile.
- Kompositsiooni aken : see on video eelvaate aken, kus saate vaadata praeguse kompositsiooni (mida sageli nimetatakse kompositsiooniks), mille kallal töötate, animatsiooni eelvaadet. Kompositsioonid on sisuliselt stseenid, millest igaühel on eraldi animatsiooni ajaskaala. Kompositsioone käsitleme üksikasjalikumalt järgmises osas.
- Ajaskaala : Siin saate luua oma animatsiooni. See koosneb nii paremal olevast sõnasõnalisest ajajoonest (kus seadistate animatsioonisündmused ajaskaalal käitamiseks) kui ka vasakul asuvast paigutusalast (kus saate oma meediumivarade atribuute üle kanda ja muuta).
- Töölaud : siit pääsete juurde erinevatele tugifunktsioonidele, nagu meediumiteave, lõigu- ja joondusvalikud ning After Effectsi sisseehitatud animatsiooni- ja visuaalefektide teegid.
Kui te pole tööriista või nupu osas kindel, kuvatakse kirjeldus, kui hõljute kursorit selle kohal.
Logofaili importimiseks lohistage see lihtsalt projektipaneelile või valige Fail " > « Import " > « Fail " . Järgmises dialoogiboksis valige Impordi meedium kui kaadrid ja liidetud kihid .
3. samm: seadistage kompositsioon. Logo animatsioon.
Kompositsioon (comp) on konteiner, mis võimaldab koostada, redigeerida ja rakendada meediumifailidele animatsioone. Suurem lavastus, näiteks film, sisaldab projektipaneelil mitut rada. Nii et saate kujutada lugusid selle filmi ühe stseenina ja igal rajal on oma eraldi ajaskaala. Meie puhul nõuab alla viie sekundi kestev logoanimatsioon väga vähe kompositsioone.
Kompositsiooni kohandamiseks lohistage meediafailid ajaskaala paneeli vasakusse serva.
Alustame lihtsa taustaga. Paremklõpsake paigutuspaneelil ja valige " Loo " > « kindel" . Kuna mu logo on valge, valisin soliidse must värv, kuid saate valida mis tahes värvi. Järgmises aknas nimetage tahke aine (minu puhul "BG"), klõpsake " Tee suurus arvuti" ja valige " OKEI" . Nüüd lohistage oma logofail projektipaneelilt ajaskaala paneelile ja peaksite nägema oma logo eelvaadet kompositsiooniaknas. Kui ei, siis korraldage kindlasti kihid ümber, lohistades logofaili all olevat ühtlast tausta.
Paremklõpsake paigutuspaneelil logofaili ja valige Loo " > « Teisenda mitmekihiliseks kompositsiooniks" . See muudab teie logofaili teistsuguseks (näete, et ikoon on muutunud). Topeltklõps logofailil avab nüüd uue vahekaardi ja viib teid selle uue kompositsiooni juurde, mis sisaldab kõiki Illustratoris seadistatud üksikuid kihte. Nüüd näete, kuidas kompid töötavad: need on sisuliselt nagu alamkaustad.
Logo animatsioon
Soovi korral saate kõik need kihid teisendada eraldi kompositsioonideks, paremklõpsates ja valides Esialgne koosseis" . See annab sellele kihile oma animatsiooni ajaskaala, mis on paigutatud eelmisesse kompositsiooni. Ja kui soovite animeerida kogu logo korraga, peaksite kasutama põhikompositsiooniga seotud ajaskaala.
Kui see on kõrvale jäänud, mõistame, kuidas need ajaskaalad animatsiooni puhul töötavad.
4. samm: animeerige logo võtmekaadrite abil
After Effects (ja enamik animatsioonitarkvarasid) töötab võtmekaadrite abil. Võtmekaadrid on põhiliselt markerid, mille saate ajaskaalal määrata, et määrata, millal teie animatsiooni algus- ja lõppolekud peaksid esinema.
Näiteks alustame väga lihtsa animatsiooniga: sisse tuhmumine. Objektiga on seotud erinevad atribuudid ja atribuudid, mis teatud aja jooksul muutuvad, on sisuliselt animatsioon. Nende atribuutide nägemiseks klõpsake logo kõrval ikooni Laienda ja seejärel omadus "Teisenda" .
Looge võtmekaadreid, klõpsates ajaskaala paneeli Atribuudid kõrval oleval stopperi ikoonil.
Pideva animatsiooni puhul soovite töötada atribuudiga, mis mõõdab objekti nähtavust: läbipaistmatus. Läbipaistmatus on seatud 100%, kuna vaikimisi on logo täielikult nähtav.
Klõpsake suvandi Läbipaistmatus kõrval olevat stopperi ikooni ja näete teemanti, kuhu on seatud esituspea marker (nõrk sinine joon, mis ületab ajaskaala). See on võtmekaader, põhiliselt hetktõmmis määratud atribuudi praegusest väärtusest. Liigutage võtmekaadrit, klõpsates ja lohistades seda ajaskaalal 2 sekundi märgini. Lohistage liugur tagasi 0-sekundilise märgini, seejärel looge uus võtmekaader ja määrake läbipaistmatuseks 0%. Animatsiooni kuvamiseks kompositsiooniaknas vajutage tühikuklahvi.
Pärast efekte
Näete, et olete loonud sujuva kaduva animatsiooni, muutes läbipaistmatuse 0%-lt 100%-le 2 sekundi jooksul vaid kahe võtmekaadriga. Nii tehakse kogu animatsiooni After Effectsis. Saate luua ajaskaalal erinevate intervallidega algus- ja lõpuvõtmekaadri ning After Effects arvutab automaatselt välja vajalikud kaadrite üleminekud, et jõuda punktist A punkti B (animatsiooniäris nimetatakse seda traditsiooniliselt kahekaadriteks).
Lihtne sujuv animatsioon luuakse atribuudi Opacity kahe võtmekaadri abil.
Näete, et on mitmeid atribuute, millega saate töötada vara ümber, mida me siin lühidalt selgitame. Katsetage julgelt võtmekaadreid ja muutke neid, et mõista nende animatsioonivõimalusi.
- Asukoht : see atribuut kirjeldab logo asukohta X- ja Y-ruumis paigutusekraanil ja võimaldab animeerida lineaarset liikumist.
- Skaala : see atribuut kirjeldab logo suurust (protsendina originaalfaili täissuurusest) ja võimaldab luua sisse- või kahandavaid animatsioone.
- Pööramine : see atribuut kirjeldab orientatsiooni kraadides ja võimaldab luua pööramisanimatsioone.
Nõuanded professionaalilt :
Logo animeerimisel on mõttekas töötada tagurpidi (nagu me tegime sissepimendamise puhul), kuna animatsioon peaks lõppema valmis, terviklikul logol. See tähendab, et enne millegi muutmist peate looma võtmekaadreid, et teil oleks atribuutide väärtuste hetktõmmised nende vaikeolekus. Seejärel saate need võtmekaadrid ajaskaalal soovitud lõpp-punkti liigutada (olenevalt sellest, kui kaua soovite animatsiooni kesta) ja luua ajaskaala alguses tehtavate muudatuste jaoks uued võtmekaadrid.
5. samm. Animeerige logo kujukihtide abil.
Nüüd liigume edasi huvitavamate animatsioonitehnikate juurde, kasutades kujundikihte. Kujukihid on objektid, mis sisaldavad teeteavet, nagu ankurpunktid ja ühendusjooned (sarnaselt vektorprogrammide omadega), ning nendega manipuleerimine avab ukse tervele hulgale animatsioonivõimalustele väljaspool. Teisenda omadused .
Kuidas valida oma logole õiget värvi?
Esmalt teisendame logo kujukihiks. Valige paneelil Kihiline kompositsioon (3. sammus loodud kihid) kõik oma kihid, paremklõpsake ja valige " Loo " > « Looge kujundeid vektorkihist" . Näete, et iga kiht on dubleeritud ja selle kõrval on tärn – see on kujundikiht. Kujukihi alla pesatuna leiad Sisu omadus lisaks Muutke vara . Paremale poole Sisu omadused näete ka nuppu " Lisama" , mis võimaldab valida animeerimiseks veelgi rohkem atribuute.
Kujundikihid sisaldavad nuppu Lisa (atribuudist Contents paremal), mis võimaldab lisada igasuguseid animeeritud omadusi, näiteks lõiketeid.
Objekti skaleerimine Adobe Illustratoris
Trimiteed
Oma logo jaoks kasutasin üsna levinud ja kasulikku animatsiooni, kasutades atribuuti Trim Paths. Selleks lisasin "Kärpimisteed", kasutades nuppu " Lisama" iga tähe kujukihtidele määrake atribuudi End võtmekaader ajaskaala alguses väärtusele 0% ja umbes 100 sekundi pärast 1%. Nagu näete, näib tähtede piirjooned olevat nähtamatu käega reaalajas joonistatud.
Atribuudi Trim Paths kasutamine võimaldab animeerida jooni nii, et need joonistavad end reaalajas.
Lisaks tahtsin taustale lisada aktsentanimatsiooni. Kuna töötan mustvalgena, valisin Twilight Zone’i meenutava looping tunneli efekti. Selleks kasutasin paneeli Tööriistad hulknurga tööriista, et joonistada oma kompositsiooni keskele kujund, luues uue kujundikihi.
Seejärel lisasin repiiteri atribuudi, tsentreerisin positsiooni ja suurendasin koopiate arvu. See dubleerib kuju, luues näiliselt lõputu tunneli. Skaala reguleerimine suurendab iga koopia vahelist ruumi ja pööramise muutmine suunab koopiad visuaalse huvi huvides erinevatesse suundadesse.
Lõpuks, et seda vürtsitada, määrasin ajaskaala alguses nihke 0 ja hiljem määrasin selle ajaskaalal negatiivseks.
Kasutades hulknurkse kujundi kihti ja repiiteri omadust, sain luua animeeritud tausta.
Olete ilmselt arvanud, et kujukihtide jaoks on palju võimalusi. See on tõsi: Internetis on sellel teemal täielikud veebikursused ja peaksite leidma aega katsetamiseks, harjutamiseks ja õppimiseks.
Samuti ei oska ma öelda, milline animatsioonistiil sulle sobib logo või millised konkreetsed tööriistad selle stiili saavutamiseks vajate animatsioone. Küll aga võin anda nõu, kuidas seda enda jaoks avastada. Otsige inspiratsiooni teistelt animeeritud logodelt, nagu oma konkurendid, imetletavad kaubamärgid ja/või saidid nagu Pinterest või Dribbble – täpselt nagu logo loomisel.
Avastate, et kui hakkate neid analüüsima, kasutades oma uusi teadmisi logo animeerimise kohta, põhinevad paljud neist lihtsal manipulatsioonid kujundite ja teisendustega (isegi need, mis on selgelt kihistunud täiustatud stiliseeritud efektidega). Kui leiate mõned teile meeldivad animatsioonid, saate rakenduses After Effects tagurpidi töötada, et proovida neid animatsioone harjutamiseks pöördprojekteerida.
6. samm: määrake kellaaeg.
Räägime ajast, mis kirjeldab animatsioonikaadrite tempot kogu animatsiooni jooksul. Graafikuredaktorisse minnes näete aja visuaalset esitust. Selleks klõpsake ajaskaala paneeli ülaosas graafiku ikooni (tähisega Graafiredaktor, kui hõljutate selle kohal) ja see muudab ajaskaala joongraafikuks.
Kui klõpsate ühel võtmekaadri atribuudil, näete sirget joont ühest võtmekaadrist teise. Praegu, kuna tegime ainult algus- ja lõpp-punkti võtmekaadreid, jätsime After Effectsi ajastuse määramiseks. Ilma suunata liigutab After Effects animatsiooni iga kaadrit ühtlaselt, mille tulemuseks on täiesti sirge joon.
Graafikuredaktor näitab võtmekaadri ajastust, nagu on näidatud joondiagrammil.
Eesmärgipärane ajamuutus annab aga animatsioonile realismi tunde. Näiteks põrkava palli animatsioonis liigub pall põrke kõrgusel aeglasemalt ja maapinnale lähenedes kiiremini, hoo ja raskusjõu mõjul. Teisisõnu, ta ei liigu kogu animatsiooni vältel sama kiirusega ja kui liiguks, paistaks ta robotina silma.
Graafikuredaktori allosas asuvad Bezier' tööriistad võimaldavad reguleerida graafiku joone kõverust.
Teisendage võtmekaadrid automaatseks Bezieriks
Graafiredaktor võimaldab teil kohandada oma animatsiooni ajastust, kasutades nn Bezier' käepidemeid, et muuta graafiku joon kõveraks. Graafikuredaktori paremas alanurgas näete joonte külge kinnitatud ruudukujulisi punktiikoone – need on Bezier' tööriistad.
Klõpsake ühte võtmekaadritest ja hõljutage kursorit Bezier' tööriistade kohal, kuni leiate kaadri nimega " Teisenda võtmekaadrid automaatseks Bezieriks" . Kui klõpsate sellel, näete graafikule kollast markerit. Selle käepideme lohistamine põhjustab joone paindumist ja see muudab teie animatsiooni ajastust. Kui kõver on rohkem väljendunud, taasesitatakse kaadreid kiiremini ja kus kõver on sujuvam, taasesitatakse kaadreid aeglasemalt.
Teravam kõver vastab kiiremale sünkroonimisele ja sujuvam kõver aeglasemale sünkroonimisele.
Enda ajastuse kohandamise nüansside tõeliseks mõistmiseks on vaja animatsioonikogemust, mistõttu on Bezier' kõverate käsitsi reguleerimine keerukam teema. Selles algaja juhendis soovitan kasutada Bezieri tööriista Lihtne Lihtsus (mis rakendab teie valitud võtmekaadrile automaatset kõverat) kõigi animatsiooni ajavahemike jaoks. Saate kandideerida Lihtne Lihtsus Võtmekaadrile väljaspool diagrammiredaktorit, valides võtmekaadri ja paremklõpsates.
7. samm: eksportige oma logo.
Kui olete valmis animeeritud logo eksportima, valige " Fail " > « Ekspordi" > « Lisa Adobe Media Encoder järjekorda" . After Effects ekspordib vaikimisi faili vormingus mp4, mis sobib video jaoks. Kuna soovime luua oma logost jagatava pildifaili, ekspordime selle animeeritud GIF-ina. Klõpsake Media Encoderi aknas sõna "Format" all esiletõstetud sinise tekstirea kõrval olevat noolt ja valige " Animeeritud GIF" . Samuti saate määrata valmis faili sihtkausta, klõpsates sinist teksti sõnade "Väljundfail" all.
Faili eksportimiseks valige Fail > Ekspordi > Lisa Adobe Media Encoderi järjekorda ja valige veeru Vorming ripploendist Animated Gif.
Ekspordisuvandite akna avamiseks topeltklõpsake eelseade all esiletõstetud sinist teksti. Faili suuruse vähendamiseks on mõned valikud: kvaliteet (määrasin selle väärtusele 20), kaadrisagedus (määrasin selle 10-le, kuigi video puhul on soovitatav suurem kaadrisagedus (fps)) ja Kestus, mis on eelvaate all olev sinine riba (ma kärpisin enda oma 4 sekundiks). Valige OKEI, selle akna sulgemiseks.
Kui olete lõpetanud, valige Media Encoderi paremas ülanurgas roheline esitusikoon ja teie fail kuvatakse teie valitud sihtkaustas. See on kõik: valmis logoanimatsioon!
Muutke oma bränd ellu logoanimatsiooniga.
-
Logo animatsioon on midagi enamat kui lihtsalt populaarne trend, mida kaubamärgid on sunnitud järgima. Logoanimatsioonis on ka vaieldamatu võlu ja see on suurepärane viis visuaalse naudingu hetke loomiseks kõigile, kes teie kaubamärgiga suhtlevad. Ja õnneks on animatsioonitarkvara arenenud nii, et peaaegu igaüks, olenemata oskustest, saab seda maagiat oma logole lisada.
Kuigi see õpetus on mõeldud teile logoanimatsiooni põhitõdedega alustamiseks, on vaja palju katse-eksitusi, harjutamist ja katsetamist, et saada midagi peale põhianimatsiooni. Kui soovite tõeliselt erilist logoanimatsiooni, on professionaalne logoanimaator seda investeeringut väärt.
Jäta kommentaar