Logotipoaren animazioa logotipo batean elementu bisualetan mugimenduak edo aldaketak sartzeko prozesua da, dinamikoagoa eta erakargarriagoa izan dadin. Logotipo baten atal ezberdinetan aplika daiteke, hala nola testu, irudi, kolore eta formatan, eta konplexutasun-maila desberdinak izan ditzake, animazio sinpleetatik hasita, hala nola testua keinuka edo koloreak lausotzen direnak, mugitzen diren objektuak edo interaktiboak dituzten animazio konplexuetaraino. ondorioak.
Logotipoaren animazioa gero eta ohikoagoa da. Telefono adimendunen eta Interneteko teknologiaren garapen orokorraren artean, logoak askoz ere ohikoagoak dira gaur egun espazio digitaletan, eta honek produktu fisikoekin posible ez diren animazio bezalako efektu bisualei ateak irekitzen dizkie. Jakina, logoaren animazioaren ospe gero eta handiagoak esan nahi du gero eta marka gehiagok beharko dutela lehiakorra izaten jarraitzeko. Beraz, logo bat animatzen ikastea trebetasun baliotsua izan daiteke, zure logoa hurrengo mailara eramango duena.
Aldi berean, animazio-softwarea ere nonahikoagoa, errazagoa eta intuitiboagoa bihurtu da gero eta handiagoa den erabiltzaile-base horri laguntzeko. Beraz, logoaren animazio teknikoa eta konplexua izan arren, hasiberriek ere animazio sinple baina eraginkorrak sor ditzakete.
Logotipoaren animazioa After Effects-en -
1. urratsa. Prestatu zure logo fitxategia.
Egia esan, gure tutoriala hasiko dugu Adobe Illustrator-en (edo antzeko logotipoa diseinatzeko softwarean) logotipo bat nola animatu jakiteko. Hau beharrezkoa da gure fitxategia ziurtatzeko animaziorako konfiguratutako logotipoa.
Animazio-softwarea bera raster bada ere, jatorrizko logotipo-fitxategiek bektorial formatuan egon behar dute. Horri esker, horiek gabe alda ditzakezu kalteak irudiaren kalitatea lortzeko (adibidez, raster logotipo bat handitzeak pixelazioa eragiten du), eta hori baliagarria izango da geroago forma geruzekin lan egiten duzunean.
Ziurtatu zure logotipoa geruzatan banatuta dagoela Geruzak panela erabiliz.
Logotipoak geruza anitzekoa izan behar du, objektu batean taldekatu beharrean. Honek animazio konplexuagoak sortzea errazten du logotipoaren zati bana animatuz. Geruza berriak sor ditzakezu " Gehitu geruza berria" Geruzak panelaren behealdean, eta gero kopiatu eta itsatsi zure logoaren zatiak horietan.
Azkenik, animazioa izaera digitala denez, RGB koloreekin ere lan egiten dugu. Zure Illustrator fitxategia CMYK ezarrita badago, hau alda dezakezu zure logotipoa hautatuz eta Editatu > Editatu koloreak > Bihurtu RGB-era nabigatuz.
Prest zaudenean, esportatu zure logotipoa guztiz geruzatutako fitxategi bektorial gisa. After Effects fitxategi motak Adobe software familiako parte direnez, sortu dudan logotipoa AI fitxategi gisa gordeko dut (Adobe Illustrator), baina hainbat fitxategi bektorial mota daude aukeran beste software bat erabiltzen ari bazara.
2. urratsa: Inportatu zure logotipoa After Effects-era. Logoaren animazioa
Ireki After Effects. Interfazea konplikatua dirudi lehen begiratuan, beraz, apur ditzagun oinarriak:
- Tresna-barra : hemen nagusira sar zaitezke tresna grafikoakhala nola, Pen tresna, Idazketa tresna, etab.
- Proiektuaren panela : Hemen proiektu osorako multimedia fitxategiak kudeatzen eta antolatzen dituzu.
- Konposizio-leihoa : Hau bideoaren aurrebista leiho bat da, non lantzen ari zaren uneko konposizioaren (askotan konposizio deitzen dena) animazioa aurreikus dezakezu. Konposizioak eszenak dira funtsean, bakoitza bere animazio-kronologia bereizita duena. Konposizioak xehetasun gehiagorekin eztabaidatuko ditugu hurrengo atalean.
- Denbora-lerroa : Hemen sortuko duzu zure animazioa. Eskuineko denbora-lerro literal batek (non animazio-gertaerak konfiguratuko dituzu denbora-lerroan exekutatzeko) eta ezkerreko diseinu-eremu batek (non zure multimedia-aktiboen atributuak gainjarri eta editatuko dituzun).
- Kontrol panel : Hemen laguntza-funtzio ezberdinetara sar zaitezke, hala nola, multimedia-informazioa, paragrafo eta lerrokatze-aukerak eta After Effects-en integratutako aurrez eraikitako animazio eta efektu bisualen liburutegiak.
Tresna edo botoi bati buruz ziur ez bazaude, sagua haren gainean pasatzeak deskribapen bat emango dizu.
Logotipo-fitxategi bat inportatzeko, arrastatu Proiektuaren panelera edo hautatu Fitxategia " > « Inportatu " > « Fitxategia " . Hurrengo elkarrizketa-koadroan, hautatu Inportatu multimedia gisa metrajea eta geruzak bateratuak .
3. urratsa: konfiguratu zure konposizioa. Logoaren animazioa.
Konposizioa (comp) multimedia-fitxategietan animazioa konposatu, editatu eta aplikatzeko aukera ematen duen edukiontzi bat da. Ekoizpen handiago batek, film batek adibidez, proiektu-panel batean antolatutako hainbat pista edukiko ditu. Beraz, pistak film horretako eszena bakar gisa pentsa ditzakezu, eta pista bakoitzak bere denbora-lerroa izango du. Gure kasuan, bost segundo baino gutxiago irauten duen logo-animazioak oso konposizio gutxi behar ditu.
Zure konposizioa pertsonalizatzeko, arrastatu multimedia-fitxategiak denbora-lerroaren panelaren ezkerrera.
Has gaitezen atzeko plano sinple batekin. Egin klik eskuineko botoiarekin diseinu-panelean eta hautatu " Sortu " > « Solidoa" . Nire logotipoa zuria denez, solidoa aukeratu dut beltza kolorea, baina edozein kolore aukeratu dezakezu. Hurrengo leihoan, jarri solidoari (nire kasuan "BG"), egin klik " Egin tamaina ordenagailua" eta hautatu " ADOS" . Arrastatu orain zure logo fitxategia Proiektuaren paneletik Denbora-lerroaren panelera eta zure logotipoa aurrebista ikusi beharko zenuke konposizio-leihoan. Hala ez bada, ziurtatu geruzak berrantolatu dituzula atzeko plano sendoa logo-fitxategiaren azpian arrastatuz.
Egin klik eskuineko botoiarekin diseinu-paneleko logotipo-fitxategian eta hautatu Sortu " > « Bihurtu geruza anitzeko konposizio batera" . Honek zure logo fitxategia beste konposizio batean bihurtuko du (ikonoa aldatu dela ikusiko duzu). Logotipoaren fitxategian klik bikoitza eginez gero, fitxa berri bat irekiko da eta Illustrator-en konfiguratu dituzun geruza indibidual guztiak dituen konposizio berri honetara eramango zaitu. Orain konposizioak nola funtzionatzen duten ikus dezakezu: funtsean azpikarpetak bezalakoak dira.
Logoaren animazioa
Nahi baduzu, geruza horietako bakoitza konposizio bereizi bihur dezakezu eskuineko botoiarekin klik eginez eta hautatuta Aurretiazko osaera" . Honek geruza honi bere animazio-kronologia emango dio, aurreko konposizioan habiaratuta. Eta logotipo osoa aldi berean animatu nahi baduzu, konposizio nagusiarekin lotutako denbora-lerroa erabili beharko zenuke.
Hori kenduta, uler dezagun denbora-lerro hauek animaziorako nola funtzionatzen duten.
4. urratsa: animatu logotipoa Keyframes erabiliz
After Effects (eta animazio-software gehienak) gako-fotogramak erabiliz funtzionatzen du. Gako-fotogramak, funtsean, denbora-lerroan ezar ditzakezun markatzaileak dira, zure animazioaren hasierako eta amaierako egoerak noiz gertatu behar diren zehazteko.
Adibidez, has gaitezen animazio oso sinple batekin: desagertzea. Objektu batek atributu desberdinak ditu erantsita, eta denbora-tarte jakin batean aldatzen diren atributuak animazioa dira funtsean. Atributu hauek ikusteko, egin klik logotipoaren ondoan dagoen Zabaldu ikonoan eta ondoren "Bihurtu" jabetza .
Sortu gako-fotogramak Denbora-lerroaren paneleko Propietateen ondoan dagoen kronometroaren ikonoan klik eginez.
Desagertzen den animazio baterako, objektu baten ikusgarritasuna neurtzen duen atributuarekin landu nahi duzu: opakutasuna. Opakitatea % 100ean ezartzen da, lehenespenez logotipoa guztiz ikusgai dagoelako.
Egin klik Opacity aukeraren ondoan dagoen kronometroaren ikonoan eta diamante bat ikusiko duzu erreprodukzio-markatzailea ezarrita dagoen tokian (lerro urdin ahulak denbora-lerroa zeharkatzen duen). Hau gako-fotograma bat da, funtsean, zehaztutako atributu baten uneko balioaren argazkia. Mugitu gako-fotograma klik eginez eta arrastatu denbora-lerroko 2 segundoko markara. Arrastatu graduatzailea berriro 0 segundoko markara, gero sortu beste gako-fotograma bat eta ezarri opakutasuna %0an. Sakatu Zuriune-barra animazioa konposizio-leihoan ikusteko.
Ondorioen ondoren
Desagertzeko animazio leun bat sortu duzula ikusiko duzu opakutasuna % 0tik % 100era aldatuz 2 segundotan bi gako-fotogramarekin. Horrela egiten da animazio guztia After Effects-en. Hasierako gako-fotograma bat eta amaierako gako-fotograma bat sor ditzakezu denbora-lerroan zehar, eta After Effects-ek automatikoki kalkulatzen ditu beharrezko fotograma-trantsizioak A puntutik B puntura joateko (tradizionalki animazio negozioan tween fotograma deitzen zaie).
Animazio leun sinple bat sortzen da Opacity propietatearen bi gako-fotograma erabiliz.
Ikusten duzu lan egin dezakezun hainbat atributu daudela Eraldatu jabetza, hemen laburki azalduko duguna. Anima zaitez gako-fotogramekin esperimentatu eta bakoitza aldatu animazio-gaitasunen berri izateko:
- posizio : Atributu honek diseinu-pantailan X, Y espazioan logotipoaren posizioa deskribatzen du eta mugimendu lineala animatzeko aukera ematen du.
- eskala : atributu honek logotipoaren tamaina deskribatzen du (jatorrizko fitxategiaren tamaina osoaren ehuneko gisa) eta handitzeko edo txikitzeko animazioak sortzeko aukera ematen du.
- biraketa : atributu honek orientazioa gradutan deskribatzen du eta biraketa-animazioak sortzeko aukera ematen du.
Profesional baten aholkuak :
Logotipo bat animatzeko orduan, zentzuzkoa da atzerantz lan egitea (fade-in-arekin egin genuen bezala), animazioa amaitutako logotipoan amaitu behar baita. Horrek esan nahi du ezer aldatu aurretik gako-fotogramak sortu behar dituzula, atributuen balioen argazkiak bere egoera lehenetsian izan ditzazun. Ondoren, gako-fotograma hauek denbora-lerroan nahi duzun amaierako puntura eraman ditzakezu (animazioak irautea nahi duzuna) eta gako-fotograma berriak sor ditzakezu denbora-lerroaren hasieran aldaketetarako.
5. urratsa. Animatu logotipoa forma geruzak erabiliz.
Orain pasa gaitezen forma-geruzak erabiliz animazio-teknika interesgarriagoetara. Forma geruzak bide-informazioa duten objektuak dira, hala nola aingura-puntuak eta konektore-lerroak (programa bektorialetakoen antzekoak), eta haiek manipulatzeak haratago animazio-aukera askotarako ateak irekitzen ditu. Eraldatu propietateak .
Nola aukeratu kolore egokia zure logorako?
Lehenik eta behin, logotipoa forma geruza bihurtuko dugu. Geruzatutako konposizio panelean (3. urratsean sortutako geruzak), hautatu zure geruza guztiak, egin klik eskuineko botoiarekin eta hautatu " Sortu " > « Sortu formak geruza bektorialetik" . Geruza bakoitza ondoan izar batekin bikoiztuta dagoela ikusiko duzu - hau forma-geruza bat da. Forma geruzaren azpian habiaratuta, aurkituko duzu Edukiaren jabetza gainera Eraldatu jabetza . -ren eskuinean Edukiaren propietateak botoi bat ere ikusiko duzu " Gehitu " , animatzeko are atributu gehiago hautatzeko aukera emango duena.
Forma geruzek Gehitu botoi bat daukate (Edukiak propietatearen eskuinaldean) eta horrek era guztietako animaziozko propietateak gehitzeko aukera ematen du, hala nola, mozketa-bideak.
Objektu bat eskalatu Adobe Illustrator-en
Moztu Bideak
Nire logotiporako, nahiko ohikoa eta erabilgarria den animazio bat erabili nuen Moztu bideak propietatea erabiliz. Horretarako "Moztu bideak" gehitu dut botoia erabiliz " Gehitu " letra bakoitzeko forma-geruzei, ezarri Amaiera atributuaren gako-fotograma % 0-n denbora-lerroaren hasieran eta % 100 segundo 1 inguru igaro ondoren. Ikus dezakezunez, letren eskema esku ikusezin batek marraztuta agertzen da denbora errealean.
Moztu bideak propietatea erabiliz, lerroak animatzeko aukera ematen du, denbora errealean marraztu daitezen.
Horrez gain, atzealdean azentu animazio batzuk gehitu nahi nituen. Zuri-beltzean lan egiten dudanez, Twilight Zone gogorarazten duen begizta tunel efektua aukeratu dut. Horretarako, Tresnak paneleko poligono tresna erabili dut nire konposizioaren erdian forma bat marrazteko, forma geruza berri bat sortuz.
Ondoren, Errepikatzaile propietate bat gehitu nuen, posizioa zentratu eta kopia kopurua handitu nuen. Honek forma bikoizten du, itxuraz amaigabea den tunela sortuz. Eskala doitzeak kopia bakoitzaren arteko tartea areagotzen du, eta biraketa aldatuz gero, kopiak norabide ezberdinetan orientatzen dira ikus-intereserako.
Azkenik, pizteko, 0-ko desplazamendu bat ezarri nuen denbora-lerroaren hasieran eta geroago balio negatiboa ezarri nuen denbora-lerroan.
Forma poligonaleko geruza bat eta Errepikatzailea propietatea erabiliz, atzeko plano animatu bat sortu ahal izan nuen.
Seguruenik asmatu duzu forma geruzetarako aukera asko daudela. Egia da: Interneten gaiari buruzko online ikastaro osoak daude, eta denbora hartu behar duzu esperimentatzeko, praktikatzeko eta ikasteko.
Ezin dizut esan zein animazio estilo egokituko zaizun logotipoa edo zer tresna zehatz estilo hori lortzeko beharko dituzun animazioak. Hala ere, zuk zeuk ezagutzeko aholkuak eman ditzaket. Bilatu inspirazioa beste animaziozko logotipoetan, hala nola, zure lehiakideetan, miresten dituzun marketan eta/edo Pinterest edo Dribbble bezalako guneetan - hasiera batean logotipoa sortu zenuenean egin zenuen bezala.
Logotipo bat animatzeko zure ezagutza berriak erabiliz aztertzen hasten zarenean, horietako asko sinpleetan oinarritzen direla ikusiko duzu. manipulazioak forma eta eraldaketekin (baita efektu estilizatu aurreratuekin argi geruzatuta daudenak ere). Gustuko dituzun batzuk aurkitu ondoren, atzera egin dezakezu After Effects-en animazio horiek alderantzizko ingeniaritza egiten saiatzeko.
6. urratsa: ezarri ordua.
Hitz egin dezagun denborari buruz, animazioko fotogramak animazio osoan zehar duten erritmoa deskribatzen duena. Denboraren irudikapen bisual bat ikus dezakezu Grafiko Editorera joanez. Horretarako, egin klik grafikoaren ikonoan (Graph Editor etiketatuta dagoena haren gainean pasatzen zarenean) denbora-lerroaren panelaren goiko aldean eta honek denbora-lerroa lerro grafiko bihurtuko du.
Gako-fotogramako atributuetako batean klik egiten baduzu, lerro zuzen bat ikusiko duzu gako-fotograma batetik bestera. Oraintxe bertan, hasierako eta amaierako puntuak gako-fotograma baino ez genituenez ari ginenez, After Effects utzi genuen kronometrajea egiteko. Norabiderik gabe, After Effects-ek animazioaren fotograma bakoitza uniformeki mugitzen du, eta ondorioz, lerro guztiz zuzena da.
Grafiko-editoreak gako-fotogramaren denbora erakusten du lerro grafikoan erakusten den moduan.
Dena den, denboraren aldaketa nahita da animazioari errealismo zentzua ematen diona. Adibidez, errebote-baloi animazio batean, baloia motelago mugitzen da errebotearen altueran eta azkarrago lurrerantz hurbiltzen den momentuan eta grabitatearen ondorioz. Hau da, ez da abiadura berean mugitzen animazio osoan zehar, eta egingo balu, robot gisa nabarmenduko litzateke.
Bezier tresnek, grafikoaren editorearen behealdean kokatuta, grafikoaren lerroaren kurbadura doitzeko aukera ematen dute.
Bihurtu gako-fotogramak Auto Bezier-era
Graph Editor-ek zure animazioaren denbora doitzeko aukera ematen dizu Bezier heldulekuak erabiliz, grafiko-lerro bat kurba bihurtzeko. Grafiko-editorearen beheko eskuineko ertzean, lerroei erantsitako puntu karratuen ikono batzuk ikusiko dituzu: Bezier tresnak dira.
Egin klik gako-fotogrametako bat eta pasatu Bezier tresnen gainean " etiketatua aurkitu arte Bihurtu gako-fotogramak Bezier automatikora" . Honetan klik egiten duzunean, markatzaile horia ikusiko duzu grafikoan. Helduleku hau arrastatzeak lerroa okertuko du eta horrek animazioaren denbora aldatuko du. Kurba nabarmenagoa den lekuetan, fotogramak azkarrago erreproduzituko dira, eta kurba leunagoa den lekuetan, fotogramak motelago erreproduzituko dira.
Kurba zorrotzagoa sinkronizazio azkarragoari dagokio, eta kurba leunagoa sinkronizazio motelagoari.
Zure denboraren doikuntzaren ñabardurak benetan ulertzeko animazio esperientzia behar da, horregatik Bezier kurbak eskuz doitzea gai aurreratuagoa da. Hasiberrientzako gida honetan, Bezier tresna erabiltzea gomendatzen dut Erraztasuna (hautatzen duzun gako-fotogramari kurba automatikoa aplikatzen diona) animazio-denbora-tarte guztietarako. Eska dezakezu Erraztasuna diagrama-editoretik kanpoko gako-fotograma batera, gako-fotograma hautatuta eta eskuineko botoiarekin klik eginez.
7. urratsa: esportatu zure logotipoa.
Amaitutako logotipo animatua esportatzeko prest zaudenean, hautatu " Fitxategia " > « Esportatu" > « Gehitu Adobe Media Encoder ilaran" . After Effects-ek lehenespenez esportatzen du fitxategia formatuan mp4, bideorako egokia dena. Gure logotipoaren parteka daitekeen irudi fitxategi bat sortu nahi dugunez, GIF animatu gisa esportatuko dugu. Media Encoder leihoan, egin klik "Formatua" hitzaren azpian nabarmendutako testu-lerro urdinaren ondoko gezia eta hautatu " GIF animatua" . Amaitutako fitxategiaren helmuga karpeta ere ezar dezakezu "Irteera fitxategia" hitzen azpian dagoen testu urdinean klik eginez.
Fitxategi bat esportatzeko, joan Fitxategia > Esportatu > Gehitu Adobe Media Encoder ilarara eta hautatu Animated Gif formatua zutabean goitibeherako zerrendan.
Egin klik bikoitza aurrez ezarritakoaren azpian nabarmendutako testu urdinean Esportazio Aukerak leihoa irekitzeko. Fitxategiaren tamaina murrizteko aztertu nahi dituzun aukera batzuk daude: Kalitatea (20an ezarri dut), Fotograma-tasa (10ean ezarri dut, nahiz eta fotograma-tasa (fps) handiagoak gomendatzen diren bideorako) eta Iraupena, hau da, aurrebistaren azpian dagoen barra urdina (nirea 4 segundotan moztu dut). Hautatu ADOS, leiho hau ixteko.
Amaitutakoan, hautatu Media Encoder-en goiko eskuineko izkinan dagoen Play ikono berdea eta zure fitxategia hautatutako helmuga karpetan bistaratuko da. Hori da: logoaren animazioa amaituta!
Eman zure marka bizia logoaren animazioarekin.
-
Logotipoaren animazioa markek jarraitzera behartuta dauden joera ezagun bat baino gehiago da. Logoaren animazioak ere magia ukaezina du, eta zure markarekin elkarreragiten duten guztientzat plazer bisuala sortzeko modu bikaina da. Eta, zorionez, animazio-softwareak eboluzionatu egin du, ia edonork, trebetasuna gorabehera, magia horren apur bat gehi diezaion bere logotipoari.
Hori horrela, tutoretza honek logoaren animazioaren oinarriekin hasteko xedea badu ere, saiakera eta errore, praktika eta esperimentazio asko behar dira oinarrizko animaziotik haratago ezer lortzeko. Logo animazio benetan berezi bat behar baduzu, logo animatzaile profesional batek merezi du inbertsioa.
Iruzkin bat idatzi