Loqo animasiyası loqotipi daha dinamik və cəlbedici etmək üçün onun vizual elementlərinə hərəkət və ya dəyişikliklərin təqdim edilməsi prosesidir. O, mətn, şəkillər, rənglər və formalar kimi loqonun müxtəlif hissələrinə tətbiq oluna bilər və o, mətnin yanıb-sönməsi və ya solğun rəngləri kimi sadə animasiyalardan tutmuş, hərəkət edən və ya interaktiv obyektləri əhatə edən mürəkkəb animasiyalara qədər müxtəlif mürəkkəblik dərəcələrinə malik ola bilər. effektləri.
Loqo animasiyası daha çox yayılır. Smartfonlar və internet texnologiyasının ümumi inkişafı arasında, loqolar indi rəqəmsal məkanlarda çox daha çox yayılmışdır və bu, fiziki məhsullarla mümkün olmayan animasiya kimi vizual effektlərə qapı açır. Təbii ki, loqo animasiyasının getdikcə populyarlaşması o deməkdir ki, daha çox brend rəqabət qabiliyyətini saxlamaq üçün ona ehtiyac duyacaq. Beləliklə, loqonu necə canlandırmağı öyrənmək, loqotipinizi növbəti səviyyəyə aparacaq dəyərli bir bacarıq ola bilər.
Eyni zamanda, animasiya proqramı da bu artan istifadəçi bazasını dəstəkləmək üçün daha geniş yayılmış, sadələşdirilmiş və intuitiv olmuşdur. Beləliklə, loqo animasiyası nə qədər texniki və mürəkkəb səslənsə də, hətta yeni başlayanlar da indi sadə, lakin təsirli animasiyalar yarada bilərlər.
After Effects-də Loqo Animasiyası -
Addım 1. Loqo faylınızı hazırlayın.
Biz, həqiqətən, Adobe Illustrator-da (və ya oxşar loqo dizayn proqramında) loqonu necə canlandırmaq barədə təlimatımıza başlayacağıq. Bu faylımızı təmin etmək üçün lazımdır animasiya üçün qurulmuş loqo.
Animasiya proqramının özü rastr olsa da, orijinal loqo faylları vektor formatında olmalıdır. Bu, onları olmadan dəyişməyə imkan verir zərər təsvirin keyfiyyəti üçün (məsələn, rastr loqosunun böyüdülməsi pikselləşmə ilə nəticələnir) və bu, sonradan forma təbəqələri ilə işləyərkən faydalı olacaq.
Layers panelindən istifadə edərək logonuzun təbəqələrə bölündüyünə əmin olun.
Loqo eyni zamanda bir obyektdə qruplaşdırılmaqdansa çoxqatlı olmalıdır. Bu, loqonun ayrı-ayrı hissələrini canlandırmaqla daha mürəkkəb animasiyalar yaratmağı asanlaşdırır. " istifadə edərək yeni təbəqələr yarada bilərsiniz. Yeni qat əlavə et" Layers panelinin aşağı hissəsində və sonra logonuzun hissələrini kopyalayıb onlara yapışdırın.
Nəhayət, animasiya rəqəmsal xarakter daşıdığından biz RGB rəngləri ilə də işləyirik. Əgər Illustrator faylınız CMYK-a ayarlanıbsa, siz loqotipinizi seçib Redaktə > Rəngləri redaktə et > RGB-ə çevirə keçməklə bunu dəyişə bilərsiniz.
Hazır olduğunuzda loqotipinizi tam laylı vektor faylı kimi ixrac edin. After Effects fayl növləri Adobe proqram ailəsinin bir hissəsi olduğundan, yaratdığım loqonu AI faylı kimi saxlayacağam (Adobe Illustrator), lakin başqa proqram təminatından istifadə edirsinizsə, seçmək üçün bir neçə müxtəlif növ vektor faylı var.
Addım 2: Logonuzu After Effects-ə idxal edin. Loqo animasiyası
After Effects-i açın. İnterfeys ilk baxışdan mürəkkəb görünə bilər, ona görə də əsasları parçalayaq:
- Toolbar : burada əsas daxil ola bilərsiniz qrafik alətləriQələm aləti, Yazı aləti və s.
- Layihə paneli : Bu, bütün layihə üçün media fayllarını idarə etdiyiniz və təşkil etdiyiniz yerdir.
- Kompozisiya pəncərəsi : Bu, üzərində işlədiyiniz cari kompozisiya (çox vaxt kompozisiya adlanır) üçün animasiyaya əvvəlcədən baxa biləcəyiniz videoya baxış pəncərəsidir. Kompozisiyalar mahiyyətcə hər birinin öz ayrı animasiya qrafikləri olan səhnələrdir. Növbəti bölmədə kompozisiyaları daha ətraflı müzakirə edəcəyik.
- Zaman qrafiki : Burada animasiyanızı yaradacaqsınız. O, həm sağdakı hərfi qrafikdən (burada vaxt qrafikində işləmək üçün animasiya hadisələri quracağınız yer) və soldakı tərtibat sahəsindən (burada media aktivlərinizin atributlarını üst-üstə qoyub redaktə edəcəksiniz) ibarətdir.
- Nəzarət lövhəsi : Burada siz media məlumatı, abzas və hizalama seçimləri və After Effects-də quraşdırılmış əvvəlcədən qurulmuş animasiya və vizual effektlər kitabxanaları kimi müxtəlif dəstəkləyici xüsusiyyətlərə daxil ola bilərsiniz.
Əgər alət və ya düymədən əmin deyilsinizsə, siçanınızı onun üzərinə gətirmək sizə təsvir verəcəkdir.
Loqo faylını idxal etmək üçün sadəcə onu Layihə panelinə sürükləyin və ya seçin Fayl" > « İdxal et " > « Fayl" . Növbəti dialoq qutusunda Medianı idxal et seçin görüntülər və birləşdirilmiş təbəqələr .
Addım 3: Kompozisiyanızı qurun. Loqo animasiyası.
Kompozisiya (komp) media fayllarına animasiya tərtib etməyə, redaktə etməyə və tətbiq etməyə imkan verən konteynerdir. Film kimi daha böyük bir istehsal, layihə panelində təşkil edilmiş çoxlu treklərdən ibarət olacaq. Beləliklə, siz trekləri həmin filmdəki tək bir səhnə kimi düşünə bilərsiniz və hər trekin öz ayrıca qrafiki olacaq. Bizim vəziyyətimizdə beş saniyədən az davam edən loqo animasiyası çox az kompozisiya tələb edir.
Kompozisiyanızı fərdiləşdirmək üçün media fayllarını vaxt qrafiki panelinin sol tərəfinə dartın.
Sadə bir fondan başlayaq. Layout panelinə sağ klikləyin və seçin " Yarat " > « Möhkəm" . Loqotipim ağ olduğundan bərki seçdim qara rəng, lakin istənilən rəng seçə bilərsiniz. Növbəti pəncərədə bərki adlandırın (mənim vəziyyətimdə "BG"), " Ölçü düzəldin kompüter" və " seçin TAMAM" . İndi loqo faylınızı Layihə panelindən Timeline panelinə sürükləyin və siz kompozisiya pəncərəsində loqotipinizin əvvəlcədən baxıldığını görməlisiniz. Əgər belə deyilsə, loqo faylının altındakı möhkəm fonu dartmaqla təbəqələri yenidən təşkil etməyinizə əmin olun.
Layout panelində loqo faylına sağ klikləyin və seçin Yarat " > « Çox qatlı kompozisiyaya çevirin" . Bu, loqo faylınızı fərqli bir kompozisiyaya çevirəcək (işarənin dəyişdiyini görəcəksiniz). Loqo faylına iki dəfə klikləmək indi yeni tab açacaq və sizi Illustrator-da quraşdırdığınız bütün fərdi təbəqələrdən ibarət bu yeni kompozisiyaya aparacaq. İndi siz kompozisiyaların necə işlədiyini görə bilərsiniz: onlar mahiyyətcə alt qovluqlara bənzəyirlər.
Loqo animasiyası
İstəyirsinizsə, bu təbəqələrin hər birini siçanın sağ düyməsini sıxıb seçməklə ayrı-ayrı kompozisiyalara çevirə bilərsiniz İlkin kompozisiya" . Bu, bu təbəqəyə əvvəlki kompozisiya daxilində yerləşdirilmiş öz animasiya qrafikini verəcəkdir. Bütün loqonu bir anda canlandırmaq istəyirsinizsə, əsas kompozisiya ilə əlaqəli bir qrafikdən istifadə etməlisiniz.
Bununla yanaşı, gəlin bu zaman qrafiklərinin animasiya üçün necə işlədiyini anlayaq.
Addım 4: Açar kadrlardan istifadə edərək loqonu canlandırın
After Effects (və əksər animasiya proqramları) açar kadrlardan istifadə etməklə işləyir. Əsas kadrlar, animasiyanızın başlanğıc və son vəziyyətlərinin nə vaxt baş verəcəyini müəyyən etmək üçün vaxt qrafikində təyin edə biləcəyiniz markerlərdir.
Məsələn, çox sadə bir animasiya ilə başlayaq: solğunluq. Obyektin ona əlavə edilmiş müxtəlif atributları var və müəyyən vaxt ərzində dəyişən atributlar mahiyyətcə animasiyadır. Bu atributları görmək üçün loqotipin yanındakı Genişləndirici simgesini və ardınca klikləyin əmlak "çevirmək" .
Timeline panelində Xüsusiyyətlərin yanındakı saniyəölçən işarəsinə klikləməklə əsas kadrlar yaradın.
Solğun animasiya üçün siz obyektin görünməsini ölçən atributla işləmək istəyirsiniz: qeyri-şəffaflıq. Qeyri-şəffaflıq 100%-ə təyin edilib, çünki standart olaraq loqo tam görünür.
Şəffaflıq seçiminin yanındakı saniyəölçən ikonasına klikləyin və siz oynatma başlığı markerinin təyin olunduğu almazı görəcəksiniz (zaman qrafikini kəsən zəif mavi xətt). Bu əsas kadrdır, əsasən müəyyən edilmiş atributun cari dəyərinin anlıq görüntüsüdür. Əsas kadrı klikləyərək və onu zaman çizelgesindeki 2 saniyə işarəsinə qədər sürükləyin. Kaydırıcıyı 0 saniyə işarəsinə geri çəkin, sonra başqa əsas kadr yaradın və qeyri-şəffaflığı 0%-ə təyin edin. Kompozisiya pəncərəsində animasiyaya baxmaq üçün Boşluq düyməsini basın.
After Effects
Yalnız iki əsas kadr ilə 0 saniyə ərzində qeyri-şəffaflığı 100%-dən 2%-ə dəyişdirərək hamar solğun animasiya yaratdığınızı görəcəksiniz. After Effects-də bütün animasiyalar belə edilir. Siz vaxt qrafiki boyunca müxtəlif intervallarda başlanğıc əsas kadrını və son əsas kadrını yarada bilərsiniz və After Effects avtomatik olaraq A nöqtəsindən B nöqtəsinə (animasiya biznesində ənənəvi olaraq ara çərçivələr deyilir) keçmək üçün lazımi kadr keçidlərini hesablayır.
Sadə hamar animasiya Opacity xüsusiyyəti üçün iki açar kadrdan istifadə etməklə yaradılır.
Üzərində işləyə biləcəyiniz bir sıra atributların olduğunu görə bilərsiniz Əmlakı çevirmək, ki, biz burada qısaca izah edəcəyik. Əsas kadrlarla sınaqdan keçirin və onların animasiya imkanlarını hiss etmək üçün hər birini dəyişdirin:
- Vəzifə : Bu atribut loqonun düzən ekranındakı X, Y məkanındakı mövqeyini təsvir edir və xətti hərəkəti canlandırmaq imkanı verir.
- Ölçək : Bu atribut loqonun ölçüsünü (orijinal faylın tam ölçüsünün faizi kimi) təsvir edir və böyüdülən və ya kiçilən animasiyalar yaratmağa imkan verir.
- Fırlanma : Bu atribut oriyentasiyanı dərəcələrlə təsvir edir və fırlanma animasiyaları yaratmağa imkan verir.
Peşəkar məsləhət :
Loqonun canlandırılmasına gəldikdə, animasiya bitmiş, tam loqoda bitməli olduğu üçün geriyə doğru işləmək (fade-in ilə etdiyimiz kimi) məna kəsb edir. Bu o deməkdir ki, hər hansı bir şeyi dəyişdirməzdən əvvəl açar kadrlar yaratmalısınız ki, atribut dəyərlərinin defolt vəziyyətində anlıq görüntüləriniz olsun. Daha sonra siz bu əsas kadrları vaxt qrafikində istədiyiniz son nöqtəyə köçürə bilərsiniz (animasiyanın nə qədər davam etməsini istəsəniz) və vaxt qrafikinin əvvəlində dəyişikliklər üçün yeni açar kadrlar yarada bilərsiniz.
Addım 5. Forma qatlarından istifadə edərək loqonu canlandırın.
İndi forma təbəqələrindən istifadə edərək daha maraqlı animasiya texnikalarına keçək. Forma təbəqələri lövbər nöqtələri və birləşdirici xətlər (vektor proqramlarında olanlara oxşar) kimi yol məlumatlarını ehtiva edən obyektlərdir və onların manipulyasiyası animasiya imkanlarının bütün spektrinə qapı açır. Xüsusiyyətləri dəyişdirin .
Logonuz üçün düzgün rəngi necə seçmək olar?
Əvvəlcə loqonu forma qatına çevirəcəyik. Layered Composition panelində (3-cü addımda yaradılmış təbəqələr) bütün təbəqələrinizi seçin, sağ klikləyin və " Yarat " > « Vektor qatından formalar yaradın" . Hər təbəqənin yanında bir ulduzla təkrarlandığını görəcəksiniz - bu bir forma təbəqəsidir. Forma qatının altında yuvalanmış, tapa bilərsiniz Məzmun mülkiyyəti əlavə olaraq Əmlakı çevirmək . -nin sağında Məzmun xüsusiyyətləri siz də bir düyməni görəcəksiniz " Əlavə et " , bu, canlandırmaq üçün daha çox atribut seçməyə imkan verəcək.
Forma təbəqələrində kəsmə yolları kimi hər cür animasiya xüsusiyyətlərini əlavə etməyə imkan verən Əlavə et düyməsi (Məzmun xüsusiyyətinin sağında) var.
Adobe Illustrator-da obyektin miqyası
Yolları kəsin
Loqotipim üçün Trim Paths xüsusiyyətindən istifadə edərək kifayət qədər ümumi və faydalı animasiyadan istifadə etdim. Bunu etmək üçün düyməni istifadə edərək "Kəsmə yolları" əlavə etdim. Əlavə et " hər hərf üçün forma layları üçün End atributunun əsas kadrını vaxt qrafikinin əvvəlində 0%-ə və təxminən 100 saniyədən sonra 1%-ə təyin edin. Göründüyü kimi, hərflərin konturları real vaxtda görünməz bir əl tərəfindən çəkilmiş kimi görünür.
Trim Paths xassəsindən istifadə xətləri real vaxt rejimində çəkmələri üçün canlandırmağa imkan verir.
Bundan əlavə, arxa plana bir az vurğu animasiyası əlavə etmək istədim. Ağ-qara rəngdə işlədiyim üçün Alatoranlıq Zonasını xatırladan ilməli tunel effekti seçdim. Bunun üçün Alətlər panelində çoxbucaqlı alətindən istifadə edərək kompozisiyamın mərkəzində bir forma çəkdim və yeni forma təbəqəsi yaratdım.
Sonra Repeater xassəsini əlavə etdim, mövqeyi mərkəzləşdirdim və nüsxələrin sayını artırdım. Bu, sonsuz görünən tunel yaradaraq formanı təkrarlayır. Ölçənin tənzimlənməsi hər bir nüsxə arasındakı boşluğu artırır və fırlanmanın dəyişdirilməsi vizual maraq üçün nüsxələri müxtəlif istiqamətlərə yönəldir.
Nəhayət, onu ləzzətləndirmək üçün vaxt qrafikinin əvvəlində 0 ofsetini əsas kadra çevirdim və daha sonra onu qrafikdə mənfi dəyərə təyin etdim.
Çoxbucaqlı forma təbəqəsi və Təkrarlayıcı xüsusiyyətindən istifadə edərək animasiya fonu yarada bildim.
Yəqin ki, forma təbəqələri üçün bir çox variantın olduğunu təxmin etmisiniz. Bu doğrudur: İnternetdə mövzu ilə bağlı tam onlayn kurslar var və siz təcrübə, təcrübə və öyrənməyə vaxt ayırmalısınız.
Hansı animasiya üslubunuza uyğun olacağını da deyə bilmərəm logo və ya hansı xüsusi alətlər bu üsluba nail olmaq üçün sizə lazım olacaq animasiyalar. Bununla belə, bunu özünüz üçün necə kəşf etməyiniz barədə sizə məsləhət verə bilərəm. Rəqibləriniz, heyran olduğunuz brendlər və/yaxud Pinterest və ya Dribbble kimi saytlar kimi digər cizgi loqolarından ilham alın - loqonu ilk dəfə yaratdığınız zaman etdiyiniz kimi.
Loqonun necə canlandırılmasına dair yeni biliklərinizdən istifadə edərək onları təhlil etməyə başladıqdan sonra onların çoxunun sadə əsaslara əsaslandığını görəcəksiniz. manipulyasiyalar formalar və çevrilmələrlə (hətta qabaqcıl stilizə edilmiş effektlərlə aydın şəkildə laylı olanlar). Bəyəndiyiniz bir neçəsini tapdıqdan sonra təcrübə üçün həmin animasiyaları tərsinə çevirməyə cəhd etmək üçün After Effects-də geriyə doğru işləyə bilərsiniz.
Addım 6: Vaxtı təyin edin.
Animasiya boyunca animasiya kadrlarının sürətini təsvir edən zamandan danışaq. Qrafik Redaktora keçərək zamanın vizual təsvirini görə bilərsiniz. Bunu etmək üçün, zaman qrafiki panelinin yuxarısındakı qrafik piktoqramını (üzerinə gətirdiyiniz zaman Qrafik Redaktor etiketli) klikləyin və bu, qrafiki xətt qrafikinə dəyişəcək.
Əsas kadr atributlarından birini klikləsəniz, bir əsas kadrdan digərinə düz xətt görəcəksiniz. Hal-hazırda, biz yalnız başlanğıc və bitmə nöqtələrini əsas kadrlarla tərtib etdiyimiz üçün, vaxtı təyin etmək üçün After Effects-dən ayrıldıq. İstiqamət olmadan After Effects animasiyanın hər bir çərçivəsini bərabər şəkildə hərəkət etdirir və nəticədə mükəmməl düz xətt yaranır.
Qrafik redaktoru xətt qrafikində göstərildiyi kimi əsas kadr vaxtını göstərir.
Bununla belə, zamanın məqsədyönlü dəyişməsi animasiyaya realizm hissi verir. Məsələn, sıçrayan top animasiyasında top sıçrayış hündürlüyündə daha yavaş, impuls və cazibə qüvvəsinə görə yerə yaxınlaşdıqca daha sürətli hərəkət edir. Başqa sözlə, o, bütün animasiya boyunca eyni sürətlə hərəkət etmir və hərəkət etsəydi, robot kimi fərqlənərdi.
Qrafik redaktorunun aşağı hissəsində yerləşən Bezier alətləri qrafik xəttinin əyriliyini tənzimləməyə imkan verir.
Əsas kadrları Auto Bezier-ə çevirin
Qrafik Redaktoru qrafik xəttini əyriyə çevirmək üçün Bezier adlanan tutacaqlardan istifadə edərək öz animasiyanızın vaxtını tənzimləməyə imkan verir. Qrafik redaktorunun aşağı sağ küncündə xətlərə əlavə edilmiş bəzi kvadrat nöqtə nişanlarını görəcəksiniz – bunlar Bezier alətləridir.
Əsas kadrlardan birinə klikləyin və " işarəli olanı tapana qədər Bezier alətlərinin üzərinə sürüşdürün. Əsas kadrları Auto Bezier-ə çevirin" . Bunun üzərinə kliklədiyiniz zaman qrafikdə sarı markerin göründüyünü görəcəksiniz. Bu tutacağın sürüklənməsi xəttin əyilməsinə səbəb olacaq və bu, animasiyanızın vaxtını dəyişəcək. Əyri daha aydın olduğu yerdə kadrlar daha sürətli, əyri daha hamar olan yerdə isə kadrlar daha yavaş ifa olunacaq.
Daha kəskin əyri daha sürətli sinxronizasiyaya, daha hamar əyri isə daha yavaş sinxronizasiyaya uyğun gəlir.
Öz vaxtınızı tənzimləmək nüanslarını həqiqətən başa düşmək üçün animasiya təcrübəsi tələb olunur, buna görə də Bezier əyrilərini əl ilə tənzimləmək daha inkişaf etmiş bir mövzudur. Bu yeni başlayanlar üçün təlimatda Bezier alətindən istifadə etməyi məsləhət görürəm Asan Asanlıq (bu, seçdiyiniz əsas kadra avtomatik əyri tətbiq edir) bütün animasiya vaxt intervalları üçün. Müraciət edə bilərsiniz Asan Asanlıq əsas kadrı seçərək və sağ klikləməklə diaqram redaktorundan kənar əsas kadra.
Addım 7: Loqotipinizi ixrac edin.
Hazır cizgi loqotipinizi ixrac etməyə hazır olduğunuz zaman " seçin. Fayl" > « ixrac" > « Növbəyə Adobe Media Encoder əlavə edin" . After Effects standart olaraq ixrac edir formatda fayl video üçün uyğun olan mp4. Loqotipimizin paylaşıla bilən şəkil faylını yaratmaq istədiyimiz üçün onu animasiyalı GIF kimi ixrac edəcəyik. Media Encoder pəncərəsində, "Format" sözünün altında vurğulanan mavi mətn xəttinin yanındakı oxu vurun və " Animasiyalı GIF" . Siz həmçinin "Çıxış Faylı" sözləri altında mavi mətnə klikləməklə, hazır faylınız üçün təyinat qovluğunu təyin edə bilərsiniz.
Faylı ixrac etmək üçün Fayl > İxrac > Adobe Media Encoder Növbəsinə əlavə et bölməsinə keçin və Format sütununda açılan siyahıdan Animasiyalı Gif seçin.
İxrac Seçimləri pəncərəsini açmaq üçün əvvəlcədən təyinatın altındakı vurğulanmış mavi mətnə iki dəfə klikləyin. Fayl ölçüsünü azaltmaq üçün baxmaq istədiyiniz bir neçə seçim var: Keyfiyyət (mən onu 20-yə təyin etdim), Çərçivə Tezliyi (video üçün daha yüksək kadr sürətləri (fps) tövsiyə edilsə də, onu 10-a təyin etdim) və Önizləmə altındakı mavi çubuq olan müddət (mənimkini 4 saniyəyə qədər kəsdim). seçin TAMAM, bu pəncərəni bağlamaq üçün.
Bitirdiyiniz zaman, Media Encoder-in yuxarı sağ küncündə yaşıl Oynatma işarəsini seçin və faylınız seçdiyiniz təyinat qovluğunda göstəriləcək. Budur: bitmiş loqo animasiyası!
Loqo animasiyası ilə brendinizi canlandırın.
-
Loqo animasiyası brendlərin təqib etmək məcburiyyətində qaldıqları populyar bir tendensiyadan daha çox şeydir. Loqo animasiyasının danılmaz sehri də var və bu, brendinizlə əlaqə saxlayan hər kəs üçün vizual həzz anı yaratmaq üçün əla bir yoldur. Xoşbəxtlikdən, animasiya proqramı elə inkişaf etdi ki, bacarığından asılı olmayaraq, demək olar ki, hər kəs öz loqosuna bu sehrdən bir az da əlavə edə bilsin.
Bununla belə, bu dərslik sizi loqo animasiyasının əsaslarına başlamaq üçün nəzərdə tutulsa da, əsas animasiyadan kənar bir şey əldə etmək üçün çoxlu sınaq və səhv, təcrübə və təcrübə tələb olunur. Əgər həqiqətən xüsusi loqo animasiyası istəyirsinizsə, peşəkar loqo animatoru investisiya qoymağa dəyər.
Şərh yaz