Анимација логотипа је процес увођења покрета или промена у визуелне елементе у логотипу како би га учинили динамичнијим и привлачнијим. Може се применити на различите делове логотипа, као што су текст, слике, боје и облици, и може имати различите степене сложености, у распону од једноставних анимација као што је текст који трепери или бледи боје, до сложених анимација које укључују објекте који се крећу или интерактивни ефекти.
Анимација логотипа постаје све чешћа. Између паметних телефона и општег развоја интернет технологије, логотипи су сада много чешћи у дигиталним просторима, а то отвара врата визуелним ефектима попут анимације који нису могући са физичким производима. Наравно, растућа популарност анимације логотипа значи да ће све више брендова бити потребна да би остали конкурентни. Дакле, учење како да анимирате логотип може бити драгоцена вештина која ће ваш лого подићи на следећи ниво.
Истовремено, софтвер за анимацију је такође постао свеприсутнији, модернији и интуитивнији да подржи ову растућу базу корисника. Дакле, без обзира колико техничка и сложена анимација логотипа звучала, чак и почетници сада могу креирати једноставне, али ефикасне анимације.
Анимација логотипа у Афтер Еффецтс -
Корак 1. Припремите датотеку логотипа.
Ми ћемо заправо започети наш водич о томе како анимирати логотип у Адобе Иллустратору (или сличном софтверу за дизајн логотипа). Ово је неопходно како бисмо осигурали да наш фајл лого постављен за анимацију.
Иако је сам софтвер за анимацију растерски, оригиналне датотеке логотипа морају бити у векторском формату. Ово вам омогућава да их промените без оштећења за квалитет слике (на пример, зумирање растерског логотипа доводи до пикселизације), а ово ће бити корисно касније када радите са слојевима облика.
Уверите се да је ваш логотип раздвојен на слојеве помоћу панела Слојеви.
Лого такође треба да буде вишеслојан, а не груписан у један објекат. Ово олакшава креирање сложенијих анимација анимацијом појединачних делова логотипа. Можете креирати нове слојеве користећи " Додај нови слој" на дну панела Слојеви, а затим копирајте и налепите делове вашег логотипа у њих.
Коначно, пошто је анимација дигитална по природи, радимо и са РГБ бојама. Ако је ваша Иллустратор датотека подешена на ЦМИК, ово можете да промените тако што ћете изабрати свој логотип и отићи на Уреди > Уреди боје > Претвори у РГБ.
Када будете спремни, извезите свој логотип као потпуно слојевиту векторску датотеку. Пошто су типови датотека Афтер Еффецтс део Адобе породице софтвера, сачуваћу лого који сам направио као АИ датотеку (Adobe Illustrator ), али постоји неколико различитих типова векторских датотека које можете изабрати ако користите други софтвер.
Корак 2: Увезите свој логотип у Афтер Еффецтс. Лого анимација
Отворите Афтер Еффецтс. Интерфејс може изгледати компликовано на први поглед, па хајде да разложимо основе:
- Тоолбар : овде можете приступити главном графички алатикао што су алатка Оловка, алатка за унос текста итд.
- Панел пројекта : Овде управљате и организујете медијске датотеке за цео пројекат.
- Прозор композиције : Ово је прозор за преглед видео записа у којем можете прегледати анимацију за тренутну композицију (која се често назива композиција) на којој радите. Композиције су у суштини сцене, свака са својим засебним временским линијама анимације. О композицијама ћемо детаљније разговарати у следећем одељку.
- Временска линија : Овде ћете креирати своју анимацију. Састоји се од буквалне временске линије са десне стране (где ћете подесити догађаје анимације да се покрећу на временској линији) и области распореда на левој страни (где ћете преклапати и уређивати атрибуте својих медијских средстава).
- Контролна табла : Овде можете приступити разним пратећим функцијама као што су информације о медијима, опције параграфа и поравнања, као и унапред изграђене библиотеке анимација и визуелних ефеката уграђене у Афтер Еффецтс.
Ако нисте сигурни у вези са алатком или дугметом, прелазак миша преко њих ће вам дати опис.
Да бисте увезли датотеку логотипа, једноставно је превуците на панел Пројецт или изаберите фајл" > « Увоз" > « фајл" . У следећем дијалогу изаберите Увези медије као снимак и спојени слојеви .
Корак 3: Подесите своју композицију. Лого анимација.
Композиција (цомп) је контејнер који вам омогућава да саставите, уређујете и примењујете анимацију на медијске датотеке. Већа продукција, као што је филм, ће садржати више нумера организованих у оквиру пројекта. Дакле, можете замислити нумере као једну сцену у том филму, а свака нумера ће имати своју посебну временску линију. У нашем случају, анимација логотипа која траје мање од пет секунди захтева врло мало композиција.
Да бисте прилагодили своју композицију, превуците медијске датотеке на леву страну панела временске линије.
Почнимо са једноставном позадином. Кликните десним тастером миша на таблу са распоредом и изаберите " Креирај" > « Чврст" . Пошто је мој лого бео, изабрао сам солидан црна боја, али можете одабрати било коју боју. У следећем прозору дајте назив чврстом стању (у мом случају „БГ“), кликните на „ Направите величину рачунар" и изаберите " У РЕДУ" . Сада превуците датотеку са логотипом са панела Пројекта на панел Временска линија и требало би да видите свој лого прегледан у прозору композиције. Ако није, обавезно преуредите слојеве превлачењем чврсте позадине испод датотеке логотипа.
Кликните десним тастером миша на датотеку логотипа у панелу изгледа и изаберите Креирај" > « Претвори у вишеслојну композицију" . Ово ће претворити ваш лого у другу композицију (видећете да се икона променила). Двоструки клик на датотеку логотипа ће сада отворити нову картицу и одвести вас до ове нове композиције која садржи све појединачне слојеве које сте поставили у Иллустратору. Сада можете да видите како функционишу цомпс: они су у суштини као подфолдери.
Лого Анимација
Ако желите, можете да конвертујете сваки од ових слојева у засебне композиције тако што ћете кликнути десним тастером миша и изабрати Прелиминарни састав" . Ово ће овом слоју дати сопствену временску линију анимације, угнежђену у претходну композицију. А ако желите да анимирате цео лого одједном, требало би да користите временску линију повезану са главном композицијом.
Склонимо то с пута, хајде да разумемо како ове временске линије функционишу за анимацију.
Корак 4: Анимирајте логотип користећи кључне кадрове
Афтер Еффецтс (и већина софтвера за анимацију) ради помоћу кључних кадрова. Кључни кадрови су у суштини маркери које можете поставити на временској линији да бисте одредили када би требало да се појаве почетно и завршно стање ваше анимације.
На пример, хајде да почнемо са врло једноставном анимацијом: упадање. Објекат има различите атрибуте који су му придружени, а атрибути који се мењају током датог временског периода су у суштини анимација. Да бисте видели ове атрибуте, кликните на икону Прошири поред логотипа, а затим на својство "Претвори" .
Креирајте кључне кадрове тако што ћете кликнути на икону штоперице поред Својства на панелу Временска линија.
За анимацију која бледи, желите да радите са атрибутом који мери видљивост објекта: непрозирност. Непрозирност је подешена на 100% јер је лого по подразумеваној вредности потпуно видљив.
Кликните на икону штоперице поред опције Прозирност и видећете ромб где је постављен маркер за репродукцију (бледа плава линија која прелази временску линију). Ово је кључни кадар, у основи снимак тренутне вредности одређеног атрибута. Померите кључни кадар тако што ћете кликнути и превући га до ознаке од 2 секунде на временској линији. Превуците клизач назад до ознаке од 0 секунди, а затим креирајте други кључни кадар и подесите непрозирност на 0%. Притисните размакницу да бисте видели анимацију у прозору композиције.
После ефекта
Видећете да сте направили глатку анимацију постепеног појављивања променом непрозирности са 0% на 100% за 2 секунде са само два кључна кадра. Овако се ради сва анимација у Афтер Еффецтс-у. Можете да креирате почетни кључни кадар и крајњи кључни кадар у различитим интервалима дуж временске линије, а Афтер Еффецтс аутоматски израчунава неопходне прелазе кадрова да би дошао од тачке А до тачке Б (традиционално се у анимацији називају оквири између оквира).
Једноставна глатка анимација се креира коришћењем два кључна кадра за својство Опацити.
Можете видети да постоји низ атрибута са којима можете да радите трансформисати својство, које ћемо овде укратко објаснити. Слободно експериментишите са кључним кадровима и модификујте сваки од њих да бисте стекли осећај за њихове могућности анимације:
- Положај : Овај атрибут описује позицију логотипа у Кс, И простору на екрану изгледа и омогућава анимирање линеарног кретања.
- Скала : Овај атрибут описује величину логотипа (као проценат пуне величине оригиналне датотеке) и омогућава вам да креирате анимације за увећање или смањење.
- Ротација : Овај атрибут описује оријентацију у степенима и омогућава вам да креирате анимације ротације.
Савет професионалца :
Када је у питању анимација логотипа, има смисла радити уназад (као што смо радили са фаде-ин) пошто анимација треба да се заврши на готовом, комплетном логотипу. То значи да морате да креирате кључне кадрове пре него што било шта промените тако да имате снимке вредности атрибута у њиховом подразумеваном стању. Затим можете да преместите ове кључне кадрове до жељене крајње тачке на временској линији (колико год желите да анимација траје) и креирате нове кључне кадрове за промене на почетку временске линије.
Корак 5. Анимирајте лого користећи слојеве облика.
Сада пређимо на занимљивије технике анимације користећи слојеве облика. Слојеви облика су објекти који садрже информације о путањи као што су тачке сидришта и линије конектора (слично онима у векторским програмима), а манипулисање њима отвара врата читавом низу могућности анимације изван Трансформирајте својства .
Како одабрати праву боју за свој лого?
Прво ћемо претворити лого у слој облика. У панелу слојевите композиције (слојеви креирани у кораку 3), изаберите све своје слојеве, кликните десним тастером миша и изаберите " Креирај" > « Креирајте облике из векторског слоја" . Видећете да је сваки слој дуплиран са звездицом поред њега - ово је слој облика. Угнежђено испод слоја облика, наћи ћете Својство садржаја додатно Трансформирајте својство . Надесно од Својства садржаја видећете и дугме " Додати" , што ће вам омогућити да изаберете још више атрибута за анимирање.
Слојеви облика садрже дугме Додај (десно од својства Цонтентс) које вам омогућава да додате све врсте анимираних својстава, као што су путање за одсецање.
Скалирање објекта у Адобе Иллустратору
Трим Патхс
За свој логотип користио сам прилично уобичајену и корисну анимацију користећи својство Трим Патхс. Да бих то урадио, додао сам „Путеви за обрезивање“ користећи дугме „ Додати" на слојеве облика за свако слово, поставите кључни кадар атрибута Крај на 0% на почетку временске линије и 100% након отприлике 1 секунде. Као што видите, чини се да обрис слова црта невидљива рука у реалном времену.
Коришћење својства Трим Патхс вам омогућава да анимирате линије тако да се цртају у реалном времену.
Поред тога, желео сам да додам неку анимацију акцента у позадини. Пошто радим црно-бело, одабрао сам ефекат тунела петље који подсећа на зону сумрака. Да бих то урадио, користио сам алатку за полигон на панелу Тоолс да нацртам облик у центру своје композиције, креирајући нови слој облика.
Затим сам додао својство Репеатер, центрирао позицију и повећао број копија. Ово дуплира облик, стварајући наизглед бескрајни тунел. Подешавање размере повећава размак између сваке копије, а промена ротације оријентише копије у различитим правцима ради визуелног интереса.
Коначно, да бих то зачинио, направио сам помак од 0 на почетку временске линије и касније га поставио на негативну вредност на временској линији.
Користећи слој полигоналног облика и својство Репеатер, успео сам да направим анимирану позадину.
Вероватно сте погодили да постоји много опција за слојеве облика. Истина је: на Интернету постоје комплетни онлајн курсеви о овој теми и требало би да одвојите време да експериментишете, вежбате и учите.
Такође не могу да вам кажем који стил анимације ће вам одговарати лого или које специфичне алате анимације које ће вам требати да постигнете овај стил. Ипак, могу вам дати савет како да то сами откријете. Потражите инспирацију од других анимираних логотипа, као што су ваши конкуренти, брендови којима се дивите и/или сајтови као што су Пинтерест или Дрибббле – баш као што сте радили када сте првобитно креирали лого.
Открићете да када почнете да их анализирате користећи своје ново знање о томе како да анимирате логотип, многи од њих су засновани на једноставним манипулације са облицима и трансформацијама (чак и онима који су јасно слојевити са напредним стилизованим ефектима). Када пронађете неколико које вам се свиђају, можете да радите уназад у Афтер Еффецтс-у да бисте покушали да обрнути инжењеринг те анимације за вежбање.
Корак 6: Подесите време.
Хајде да причамо о времену, које описује темпо кадрова анимације током целе анимације. Визуелни приказ времена можете видети тако што ћете отићи у уређивач графикона. Да бисте то урадили, кликните на икону графикона (означена као уређивач графикона када пређете мишем преко ње) на врху панела временске линије и то ће променити временску линију у линијски графикон.
Ако кликнете на један од атрибута кључног кадра, видећете праву линију од једног до другог кључног кадра. Управо сада, пошто смо правили само кључне кадрове почетне и крајње тачке, оставили смо Афтер Еффецтс-у да одреди време. Без правца, Афтер Еффецтс равномерно помера сваки кадар анимације, што резултира савршено равном линијом.
Едитор графикона приказује време кључног кадра као што је приказано на линијском графикону.
Међутим, сврсисходна промена времена је оно што анимацији даје осећај реализма. На пример, у анимацији лоптице која одбија лопту, лопта се креће спорије на висини одскока и брже док се приближава тлу због момента и гравитације. Другим речима, он се не креће истом брзином током целе анимације, а да јесте, истакао би се као робот.
Безиер алати, који се налазе на дну уређивача графикона, омогућавају вам да прилагодите закривљеност линије графикона.
Претворите кључне кадрове у Ауто Безиер
Уређивач графикона вам омогућава да прилагодите време ваше сопствене анимације коришћењем такозваних Безиерових ручки да трансформишете линију графикона у криву. У доњем десном углу уређивача графикона видећете неке иконе квадратних тачака које су причвршћене за линије — ово су Безиер алати.
Кликните на један од кључних кадрова и пређите курсором преко Безиерових алата док не пронађете онај са ознаком " Претворите кључне кадрове у Ауто Безиер" . Када кликнете на ово, видећете да се на графикону појављује жути маркер. Превлачењем ове ручке ће се линија савијати и то ће променити време ваше анимације. Тамо где је крива израженија, кадрови ће се репродуковати брже, а где је крива глаткија, кадрови ће се репродуковати спорије.
Оштрија крива одговара бржој синхронизацији, а глаткија крива споријој синхронизацији.
За истинско разумевање нијанси подешавања сопственог времена потребно је искуство анимације, због чега је ручно подешавање Безиерових кривуља напреднија тема. У овом водичу за почетнике препоручујем коришћење Безиеровог алата лака лакоћа (који примењује аутоматску криву на кључни кадар који изаберете) за све временске интервале анимације. Можете се пријавити лака лакоћа на кључни кадар изван уређивача дијаграма тако што ћете изабрати кључни кадар и кликнути десним тастером миша.
Корак 7: Извезите свој логотип.
Када будете спремни да извезете свој готов анимирани логотип, изаберите " фајл" > « извоз" > « Додај Адобе Медиа Енцодер у ред чекања" . Афтер Еффецтс подразумевано извози фајл у формату мп4, који је погодан за видео. Пошто желимо да креирамо датотеку слике нашег логотипа за дељење, извезћемо је као анимирани ГИФ. У прозору Медиа Енцодер кликните на стрелицу поред означене плаве линије текста испод речи „Формат“ и изаберите „ Анимирани ГИФ" . Такође можете подесити одредишну фасциклу за своју готову датотеку тако што ћете кликнути на плави текст испод речи „Излазна датотека“.
Да бисте извезли датотеку, идите на Филе > Екпорт > Адд то Адобе Медиа Енцодер Куеуе и изаберите Аниматед Гиф са падајуће листе у колони Формат.
Двапут кликните на истакнути плави текст испод унапред подешеног да бисте отворили прозор са опцијама извоза. Постоји неколико опција које ћете желети да погледате да бисте смањили величину датотеке: квалитет (подесио сам је на 20), брзину кадрова (подешавао сам је на 10, иако се за видео препоручују веће брзине кадрова (фпс)) и Трајање, што је плава трака под прегледом (ја сам скратио своју на 4 секунде). Изаберите У РЕДУ, да затворите овај прозор.
Када завршите, изаберите зелену икону Плаи у горњем десном углу Медиа Енцодер-а и ваша датотека ће бити приказана у одабраној одредишној фасцикли. То је то: готова анимација логотипа!
Оживите свој бренд помоћу анимације логотипа.
-
Анимација логотипа је више од популарног тренда који су брендови приморани да следе. Ту је и неоспорна магија анимације логотипа, и то је одличан начин да створите тренутак визуелног задовољства за све који комуницирају са вашим брендом. И на срећу, софтвер за анимацију је еволуирао тако да скоро свако, без обзира на вештину, може додати мало те магије свом логотипу.
С тим у вези, иако је овај водич намењен да почнете са основама анимације логотипа, потребно је много покушаја и грешака, праксе и експериментисања да бисте добили било шта изван основне анимације. Ако желите заиста посебну анимацију логотипа, професионални лого аниматор је вредан улагања.
Оставить комментарии