Логотиптин анимациясы – бул логотиптин визуалдык элементтерине кыймылды же өзгөртүүлөрдү киргизүү процесси, аны динамикалуу жана жагымдуу кылуу. Ал логотиптин текст, сүрөттөр, түстөр жана формалар сыяктуу ар кандай бөлүктөрүнө колдонулушу мүмкүн жана ал жөнөкөй анимациялардан, мисалы, тексттин бүлбүлдөгөн же өчүп бараткан түстөрүнөн тартып, кыймылдуу же интерактивдүү объекттерди камтыган татаал анимацияларга чейин ар кандай татаалдык даражасына ээ болушу мүмкүн. эффекттер.
Логотиптин анимациясы кеңири жайылууда. Смартфондор менен интернет технологияларынын жалпы өнүгүшүнүн ортосунда логотиптер азыр санариптик мейкиндиктерде алда канча кеңири таралган жана бул физикалык продуктулар менен мүмкүн болбогон анимация сыяктуу визуалдык эффекттерге жол ачат. Албетте, логотип анимациясынын өсүп жаткан популярдуулугу атаандаштыкка жөндөмдүү бойдон калуу үчүн барган сайын көбүрөөк бренддерге муктаж болот дегенди билдирет. Ошентип, логотипти кантип жандандырууну үйрөнүү сиздин логотипиңизди кийинки деңгээлге көтөрө турган баалуу чеберчилик болушу мүмкүн.
Ошол эле учурда, анимациялык программалык камсыздоо дагы кеңири жайылган, жөнөкөйлөштүрүлгөн жана бул өсүп жаткан колдонуучу базасын колдоо үчүн интуитивдик болуп калды. Ошентип, канчалык техникалык жана татаал логотип анимациясы угулбасын, атүгүл жаңы баштагандар азыр жөнөкөй, бирок эффективдүү анимацияларды түзө алышат.
After Effectsдеги логотип анимациясы -
Кадам 1. Логотип файлыңызды даярдаңыз.
Биз чындыгында Adobe Illustrator (же ушуга окшош логотип дизайн программасы) менен логотипти кантип жандандыруу боюнча окуу куралыбызды баштайбыз. Бул биздин файлды камсыз кылуу үчүн зарыл логотип анимация үчүн орнотулган.
Анимациялык программанын өзү растр болсо да, баштапкы логотип файлдары вектордук форматта болушу керек. Бул аларды жок эле өзгөртүүгө мүмкүндүк берет зыян сүрөттүн сапаты үчүн (мисалы, растрдик логотипти чоңойтуу пикселдикке алып келет) жана бул кийинчерээк форма катмарлары менен иштөөдө пайдалуу болот.
Логотипиңиздин катмарлар панели аркылуу катмарларга бөлүнгөнүн текшериңиз.
Логотип дагы бир объектке топтолбостон, көп катмарлуу болушу керек. Бул логотиптин айрым бөлүктөрүн жандандыруу менен татаал анимацияларды түзүүнү жеңилдетет. Сиз жаңы катмарларды түзө аласыз " Жаңы катмар кошуу" Катмарлар панелинин ылдый жагында, анан логотипиңиздин бөлүктөрүн аларга көчүрүп, чаптаңыз.
Акыр-аягы, анимация санариптик мүнөзгө ээ болгондуктан, биз RGB түстөр менен да иштейбиз. Эгер Illustrator файлыңыз CMYK деп коюлган болсо, логотипиңизди тандап, Түзөтүү > Түстөрдү түзөтүү > RGBге конвертке өтүү менен өзгөртө аласыз.
Даяр болгондо, логотипиңизди толук катмарлуу вектордук файл катары экспорттоңуз. After Effects файл түрлөрү Adobe программалык камсыздоо үй-бүлөсүнө киргендиктен, мен жараткан логотипти AI файлы катары сактайм (Adobe Illustrator), бирок башка программалык камсыздоону колдонуп жатсаңыз, тандоо үчүн бир нече түрдүү вектордук файлдар бар.
2-кадам: Логотипиңизди After Effectsке импорттоо. Логотип анимациясы
After Effects ачыңыз. Интерфейс бир караганда татаал сезилиши мүмкүн, андыктан, келгиле, негиздерин талдап көрөлү:
- куралдар панели : бул жерде сиз негизги кире аласыз графикалык куралдармисалы, Калем куралы, Түр куралы ж.б.
- Долбоор панели : Бул жерде сиз бүтүндөй долбоор үчүн медиа файлдарды башкарасыз жана уюштурасыз.
- Композиция терезеси : Бул видеону алдын ала көрүү терезеси, анда сиз иштеп жаткан учурдагы композициянын (көбүнчө композиция деп аталат) анимациясын алдын ала көрө аласыз. Композициялар – бул ар биринин өзүнчө анимация убактысы бар көрүнүштөр. Композицияларды кийинки бөлүмдө кененирээк талкуулайбыз.
- Убакыт тилкеси : Бул жерде сиз анимацияңызды түзөсүз. Ал оң жактагы түзмө-түз хронологиядан (бул жерде сиз хронологияда иштөө үчүн анимация окуяларын орнотосуз) жана сол жактагы жайгашуу аймагынан (мерде сиз медиа активдериңиздин атрибуттарын кабаттап жана түзөтөсүз) турат.
- Башкаруу панели : Бул жерден сиз медиа маалыматы, абзац жана тегиздөө параметрлери жана After Effects ичине орнотулган алдын ала түзүлгөн анимация жана визуалдык эффекттер китепканалары сыяктуу ар кандай көмөкчү функцияларга кире аласыз.
Эгерде сиз курал же баскычты билбесеңиз, чычканыңызды анын үстүнө алып барсаңыз, сүрөттөмө берет.
Логотип файлын импорттоо үчүн аны жөн гана Долбоор панелине сүйрөп же тандаңыз Файл " > « Импорттоо " > « Файл " . Кийинки диалог кутучасында Медияны импорттоо дегенди тандаңыз кадрлар жана бириктирилген катмарлар .
3-кадам: Композицияңызды орнотуңуз. Логотип анимациясы.
Композиция (композиция) – бул медиа файлдарга анимация түзүүгө, түзөтүүгө жана колдонууга мүмкүндүк берүүчү контейнер. Тасма сыяктуу чоңураак өндүрүш долбоор панелинде уюштурулган бир нече тректерди камтыйт. Ошентип, сиз тректерди ошол тасмадагы бир эле көрүнүш катары элестете аласыз жана ар бир тректин өзүнүн өзүнчө хронологиясы болот. Биздин учурда, беш секунддан аз убакытка созулган логотип анимациясы өтө аз композицияны талап кылат.
Композицияңызды ыңгайлаштыруу үчүн, медиа файлдарды убакыт тилкеси панелинин сол жагына сүйрөңүз.
Жөнөкөй фон менен баштайлы. Макет панелин оң баскыч менен чыкылдатып, " Түзүү " > « Катуу" . Менин логотип ак болгондуктан, мен катуу тандадым Кара түс, бирок сиз каалаган түстү тандай аласыз. Кийинки терезеде катуу нерсени атаңыз (менин учурда "BG"), " Өлчөмдү жасаңыз компьютер" жана "тандоо Макул " . Эми логотип файлыңызды Долбоор панелинен Убакыт тилкеси панелине сүйрөңүз жана логотипиңизди композиция терезесинде алдын ала көрүшүңүз керек. Болбосо, логотип файлынын астындагы катуу фонду сүйрөп, катмарларды кайра иретке келтирүүнү унутпаңыз.
Макет панелиндеги логотип файлын оң баскыч менен чыкылдатып, тандаңыз Түзүү " > « Көп катмарлуу композицияга айландыруу" . Бул сиздин логотип файлыңызды башка композицияга айлантат (сөлөкөт өзгөргөнүн көрөсүз). Логотип файлын эки жолу чыкылдатуу, эми жаңы өтмөктү ачып, сиз Illustrator'до орноткон бардык жеке катмарларды камтыган бул жаңы композицияга алып барат. Эми сиз комплекттердин кантип иштээрин көрө аласыз: алар негизинен ички папкаларга окшош.
Логотип анимациясы
Кааласаңыз, бул катмарлардын ар бирин оң баскыч менен чыкылдатып, тандоо менен өзүнчө композицияларга айландырсаңыз болот Алдын ала курамы» . Бул бул катмарга мурунку композициянын ичине киргизилген өзүнүн анимация хронологиясын берет. Жана эгер сиз логотипти бир эле учурда жандантууну кааласаңыз, анда негизги композиция менен байланышкан хронологияны колдонушуңуз керек.
Бул жол менен, келгиле, бул убакыт тилкелери анимация үчүн кандай иштээрин түшүнөлү.
4-кадам: Негизги кадрларды колдонуу менен логотипти жандандырыңыз
After Effects (жана көпчүлүк анимациялык программалар) негизги кадрларды колдонуу менен иштейт. Негизги кадрлар – бул анимацияңыздын башталышы жана аяктоо абалы качан болушу керектигин аныктоо үчүн убакыт тилкесинде орното турган маркерлер.
Мисалы, абдан жөнөкөй анимациядан баштайлы: өчүп калуу. Объекттин ага тиркелген ар кандай атрибуттары болот жана белгилүү бир убакыт аралыгында өзгөрүп турган атрибуттар негизинен анимация болуп саналат. Бул атрибуттарды көрүү үчүн, логотиптин жанындагы Кеңейтүү сөлөкөтүн чыкылдатыңыз мулк "Convert" .
Убакыт тилкеси панелиндеги касиеттердин жанындагы секундомер сөлөкөтүн чыкылдатуу менен негизги кадрларды түзүңүз.
Өчүп бара жаткан анимация үчүн объекттин көрүнүүсүн өлчөгөн атрибут менен иштегиңиз келет: тунук эмес. Тунук эместик 100% деп коюлган, анткени демейки боюнча логотип толугу менен көрүнүп турат.
Тунуктуулук опциясынын жанындагы секундомер сөлөкөтүн чыкылдатсаңыз, ойнотуу башынын маркери орнотулган алмазды көрөсүз (убакыт тилкесин кесип өткөн алсыз көк сызык). Бул негизги кадр, негизинен көрсөтүлгөн атрибуттун учурдагы маанисинин сүрөтү. Негизги кадрды басып, аны убакыт тилкесиндеги 2 секунддук белгиге чейин жылдырыңыз. Сыдырманы кайра 0 секунддук белгиге сүйрөп, андан кийин дагы бир ачкыч кадрды түзүп, тунуктукту 0% коюңуз. Композиция терезесинде анимацияны көрүү үчүн Боштук баскычын басыңыз.
After Effects
Эки негизги кадр менен 0 секунданын ичинде тунуктукту 100%дан 2%га чейин өзгөртүп, жылмакай өчүп калган анимацияны жаратканыңызды көрөсүз. After Effects программасында бардык анимациялар ушундайча жасалат. Сиз убакыт тилкесинде ар кандай интервалдарда башталгыч негизги кадрды жана аяктоочу негизги кадрды түзө аласыз жана After Effects автоматтык түрдө А чекитинен В чекитине өтүү үчүн керектүү кадр өтүүлөрүн эсептейт (анимация бизнесинде салттуу түрдө ара кадры деп аталат).
Жөнөкөй жылмакай анимация Opacity касиети үчүн эки негизги кадрдын жардамы менен түзүлөт.
Сиз менен иштей турган бир катар атрибуттар бар экенин көрө аласыз Мүлктү өзгөртүү, биз бул жерде кыскача түшүндүрүп берет. Негизги кадрлар менен эксперимент жасап, алардын анимация мүмкүнчүлүктөрүн сезүү үчүн ар бирин өзгөртүңүз:
- абал : Бул атрибут макет экранындагы X, Y мейкиндигинде логотиптин абалын сүрөттөйт жана сызыктуу кыймылды жандантууга мүмкүндүк берет.
- шкала : Бул атрибут логотиптин өлчөмүн (оригиналдуу файлдын толук өлчөмүнөн пайыз катары) сүрөттөйт жана чоңойтуу же кичирейтүү анимацияларын түзүүгө мүмкүндүк берет.
- айландыруу : Бул атрибут багытты градус менен сүрөттөйт жана айлануу анимацияларын түзүүгө мүмкүндүк берет.
Кесиптик кеңеш :
Логотипти анимациялоого келгенде, артка карай иштөө мааниси бар (биз өчүп калгандай), анимация даяр, толук логотип менен аякташы керек. Бул сиздин демейки абалында атрибут баалуулуктарынын көз ирмемдик сүрөттөрү болушу үчүн эч нерсени өзгөртүүдөн мурун негизги кадрларды түзүшүңүз керек дегенди билдирет. Андан кийин сиз бул негизги кадрларды убакыт тилкесинде каалаган акыркы чекитке жылдыра аласыз (анимация канчалык узакка созулушун кааласаңыз да) жана хронологиянын башында өзгөрүүлөр үчүн жаңы негизги кадрларды түзө аласыз.
Кадам 5. Форма катмарларын колдонуу менен логотипти жандандырыңыз.
Эми форма катмарларын колдонуу менен кызыктуу анимация ыкмаларына өтөбүз. Форма катмарлары - анкердик чекиттер жана туташтыргыч сызыктар (вектордук программалардагыларга окшош) сыяктуу жол маалыматын камтыган объекттер жана аларды манипуляциялоо анимация мүмкүнчүлүктөрүнүн толук спектрине жол ачат. Трансформация касиеттери .
Сиздин логотип үчүн туура түстү кантип тандоо керек?
Алгач логотипти форма катмарына айландырабыз. Катмарланган композиция панелинен (3-кадамда түзүлгөн катмарлар) бардык катмарларыңызды тандап, оң баскыч менен чыкылдатыңыз жана " Түзүү " > « Вектордук катмардан фигураларды түзүү" . Ар бир катмар анын жанындагы жылдыз менен кайталанганын көрөсүз - бул форма катмары. Форма катмарынын астына жайгаштырылган, сиз табасыз Мазмун касиети кошумча Мүлктү өзгөртүү . Оң жагында Мазмун касиеттери ошондой эле баскычты көрөсүз " Кошуу " , бул сизге анимациялоо үчүн дагы көп атрибуттарды тандоого мүмкүндүк берет.
Форма катмарлары кесүү жолдору сыяктуу ар кандай жандуу касиеттерди кошууга мүмкүндүк берүүчү Кошумча баскычын (Contents касиетинин оң жагында) камтыйт.
Adobe Illustrator программасында объектти масштабдоо
Жолдорду кесүү
Мен логотип үчүн Trim Paths касиетин колдонуу менен кеңири таралган жана пайдалуу анимацияны колдондум. Бул үчүн мен "Жолдорду кесүү" баскычын колдонуп коштум. Кошуу " ар бир тамга үчүн форма катмарларына, End атрибуту негизги кадрын убакыт тилкесинин башталышында 0% жана болжол менен 100 секунддан кийин 1% коюңуз. Көрүнүп тургандай, тамгалардын контуру реалдуу убакытта көзгө көрүнбөгөн кол менен тартылгандай көрүнөт.
Trim Paths касиетин колдонуу сызыктарды реалдуу убакытта өздөрүн тартуу үчүн жандуу кылууга мүмкүндүк берет.
Мындан тышкары, мен фонго акцент анимациясын кошкум келди. Мен ак жана кара түстө иштегендиктен, Сумерки зонасын эске салган укурук туннель эффектин тандадым. Бул үчүн мен Куралдар панелиндеги көп бурчтук куралды колдонуп композициямдын ортосуна фигура чийип, жаңы форма катмарын түздүм.
Андан кийин мен Repeater касиетин кошуп, позицияны ортого салып, нускалардын санын көбөйтүп койдум. Бул чексиз туннелди түзүп, форманы кайталайт. Масштабды тууралоо ар бир көчүрмөнүн ортосундагы мейкиндикти көбөйтөт, ал эми айланууну өзгөртүү визуалдык кызыгуу үчүн көчүрмөлөрдү ар кандай багыттарга багыттайт.
Акырында, аны кооздоо үчүн, мен убакыт тилкесинин башталышында 0 офсеттин негизги кадрына түшүрүп, кийинчерээк аны убакыт тилкесинде терс мааниге койдум.
Көп бурчтуу форма катмарын жана Repeater касиетин колдонуу менен мен анимацияланган фон түзө алдым.
Сиз форма катмарларынын көптөгөн варианттары бар деп ойлогон чыгарсыз. Бул чындык: Интернетте бул тема боюнча толук онлайн курстар бар жана сиз эксперимент, практика жана үйрөнүүгө убакыт бөлүүңүз керек.
Кайсы анимация стили сизге ылайыктуу экенин да айта албайм логотип же кандай конкреттүү аспаптар Бул стилге жетүү үчүн анимациялар керек болот. Бирок, мен сизге аны кантип өзүңүз ачуу боюнча кеңеш бере алам. Атаандаштарыңыз, сиз суктанган бренддер жана/же Pinterest же Dribbble сыяктуу сайттар сыяктуу башка анимацияланган логотиптерден илхам издеңиз - логотипти башында жаратканыңыздай.
Логотипти кантип жандандыруу боюнча жаңы билимиңизди колдонуп, аларды талдап баштаганыңыздан кийин, алардын көбү жөнөкөй нерселерге негизделгенин көрөсүз. манипуляциялар формалар жана трансформациялар менен (ал тургай өнүккөн стилдештирилген эффекттер менен ачык катмарланган). Өзүңүзгө жаккан бир нечесин тапкандан кийин, After Effects программасында артка карай иштеп, ошол анимацияларды практика үчүн тескери инженериялоого аракет кылсаңыз болот.
6-кадам: Убакытты коюңуз.
Келгиле, анимациядагы анимация кадрларынын темптерин сүрөттөгөн убакыт жөнүндө сүйлөшөлү. График редакторуна өтүп, убакыттын визуалдык көрүнүшүн көрө аласыз. Бул үчүн, убакыт тилкеси панелинин жогору жагындагы графиктин сүрөтчөсүн (анын үстүнө алып барганда Графикалык редактор деп белгиленген) чыкылдатыңыз жана бул убакыт тилкесин сызык диаграммасына өзгөртөт.
Эгерде сиз негизги кадрдын атрибуттарынын бирин чыкылдатсаңыз, бир негизги кадрдан экинчисине түз сызыкты көрөсүз. Азыр биз башталгыч жана аяктоочу чекиттерди гана чечип жаткандыктан, убакытты белгилөө үчүн After Effectsтен кеттик. Багыты жок, After Effects анимациянын ар бир кадрын бирдей жылдырат, натыйжада кемчиликсиз түз сызык пайда болот.
График редактору сызык диаграммасында көрсөтүлгөндөй, негизги кадр убактысын көрсөтөт.
Бирок, убакыттын максаттуу өзгөрүшү анимацияга реалдуулук сезимин берет. Мисалы, секирип жаткан топтун анимациясында топ секирүү бийиктигинде жайыраак, импульстун жана тартылуу күчүнүн таасиринен жерге жакындаганда ылдамыраак кыймылдайт. Башкача айтканда, ал бардык анимация бою бирдей ылдамдыкта кыймылдабайт, эгер кыймылдаса, ал робот катары өзгөчөлөнмөк.
График редакторунун ылдый жагында жайгашкан Bezier куралдары график сызыгынын ийрилигин тууралоого мүмкүндүк берет.
Негизги кадрларды Auto Bezierге айландырыңыз
График редактору график сызыгын ийри сызыкка айландыруу үчүн Bezier деп аталган туткаларды колдонуу менен өзүңүздүн анимацияңыздын убактысын тууралоого мүмкүндүк берет. График редакторунун ылдыйкы оң бурчунда сиз сызыктарга тиркелген төрт бурчтуу чекиттин сүрөтчөлөрүн көрөсүз — булар Bezier куралдары.
Негизги кадрлардын бирин чыкылдатыңыз жана "Bezier куралдарынын үстүнө" деп белгиленгенди тапмайынча курсорду коюңуз. Негизги кадрларды Auto Bezierге айландыруу" . Муну басканда, графикте сары маркер пайда болот. Бул тутканы сүйрөө сызыктын ийилишине алып келет жана бул сиздин анимацияңыздын убактысын өзгөртөт. Ийри айкыныраак болгон жерде рамкалар тезирээк ойнойт, ал эми ийри сызык жылмакай болсо, алкактар жайыраак ойнойт.
Курч ийри сызык тезирээк шайкештештирүүгө, ал эми жылмакай ийри сызык жайыраак синхрондоштурууга туура келет.
Өзүңүздүн убакытты тууралоонун нюанстарын чындап түшүнүү үчүн анимация тажрыйбасы талап кылынат, ошондуктан Bezier ийри сызыктарын кол менен тууралоо өнүккөн тема. Бул башталгыч колдонмодо мен Bezier куралын колдонууну сунуштайм Оңой жеңил (ал сиз тандаган негизги кадрга автоматтык ийри сызыкты колдонот) бардык анимация убакыт аралыгы үчүн. Сиз кайрылсаңыз болот Оңой жеңил негизги кадрды тандап, чычкандын оң баскычын чыкылдатуу менен диаграмма редакторунун сыртындагы негизги кадрга.
7-кадам: Логотипиңизди экспорттоо.
Даяр анимацияланган логотипти экспорттоого даяр болгондо, " Файл " > « Экспорт" > « Adobe Media Encoderди кезекке кошуу" . After Effects демейки боюнча экспорттолот форматта файл mp4, видео үчүн ылайыктуу. Биз логотипибиздин бөлүшүлүүчү сүрөт файлын түзгүбүз келгендиктен, аны анимацияланган GIF катары экспорттойбуз. Media Encoder терезесинде, "Формат" сөзүнүн астындагы тексттин бөлүнгөн көк сызыгынын жанындагы жебени чыкылдатып, " Анимацияланган GIF" . Сиз ошондой эле "Output File" деген сөздөрдүн астындагы көк текстти чыкылдатуу менен даяр файлыңыз үчүн көздөгөн папканы орното аласыз.
Файлды экспорттоо үчүн Файл > Экспорттоо > Adobe Media Encoder кезегине кошуңуз жана Формат тилкесинде ачылуучу тизмеден Animated Gif тандаңыз.
Экспорттоо параметрлери терезесин ачуу үчүн алдын ала орнотулган астындагы белгиленген көк текстти эки жолу чыкылдатыңыз. Файлыңыздын өлчөмүн кичирейтүү үчүн сиз карап көргүңүз келген бир нече варианттар бар: Сапаты (мен аны 20 деп койдум), кадр ылдамдыгы (мен аны 10 деп койдум, бирок видео үчүн кадр ылдамдыгы (fps) жогору сунушталат) жана Узактыгы, бул алдын ала каралып жаткан көк тилке (менин 4 секундага чейин кыскарттым). Тандоо Макул, бул терезени жабуу үчүн.
Бүткөндөн кийин, Media Encoderдин жогорку оң бурчундагы жашыл Ойнотуу сүрөтчөсүн тандаңыз жана файлыңыз сиз тандаган көздөгөн папкада көрсөтүлөт. Болду: логотип анимациясы аяктады!
Логотип анимациясы менен брендиңизди жандандырыңыз.
-
Логотиптин анимациясы бренддер ээрчүүгө аргасыз болгон популярдуу тенденция эмес. Ошондой эле логотип анимациясынын талашсыз сыйкыры бар жана бул сиздин брендиңиз менен өз ара аракеттенген ар бир адам үчүн визуалдык ырахат учурун түзүүнүн эң сонун жолу. Бактыга жараша, анимациялык программалык камсыздоо өнүккөн, ошондуктан дээрлик ар бир адам, чеберчилигине карабастан, өзүнүн логотипине ошол сыйкырдын бир азын кошо алат.
Ушуну менен бирге, бул окуу куралы логотип анимациясынын негиздери менен баштоого багытталган, бирок негизги анимациядан тышкары нерселерди алуу үчүн көп сыноо жана ката, практика жана эксперимент талап кылынат. Эгер сиз чындап эле өзгөчө логотип анимациясын кааласаңыз, профессионалдуу логотип аниматору инвестиция салууга арзыйт.
Комментарий калтыруу