Как импортировать gif в after effects

Обновлено: 20.08.2024

Lottie — отличный способ экспортировать анимации из After Effects в JSON, сохраняя хорошее качество. В этой статье мы разберёмся, как приступить к работе с этим инструментом и на чём стоит заострить особое внимание.

В 2017 году инженеры Airbnb увидели потенциал анимации на основе JSON и вместе с лидером анимации создали библиотеки iOS и Android, которые смогли бы отображать файлы JSON, которые назвали «Lottie». Вы можете прочитать больше об истории здесь. Разработчики в Airbnb оставили исходный код открытым и создали сообщество GitHub для общения с дизайнерами и инженерами.

LottieFiles — это независимая платформа от Airbnb, на которой дизайнеры могут загружать, тестировать, покупать и выгружать анимации.

Airbnb также являются создателями плагина LottieFiles для After Effects, который работает аналогично Bodymoving и позволяет нам просматривать анимацию, загружать её на платформу LottieFiles, сохранять на компьютере.

Для начала необходимо установить плагин, вы можете использовать Bodymovin или LottieFile.

Я создал для своего логотипа простую анимацию, которая будет отображаться в верхнем меню веб-сайта. Это дрон с вращающимися лопастями, поэтому я импортировал в слои файлы Illustrator, сделал спиральные 3D-слои и повернул их.

Будьте внимательны, не все эффекты поддерживаются этими форматами файлов. На сегодняшний день 3D-слои не поддерживаются. Поэтому, прежде чем делать анимацию, стоит проверить поддержку.

Создание анимации для интернета — это не то же самое, что и создание традиционного видео. Мы должны принять во внимание несколько параметров настройки и форматирования, о которых нам никогда раньше не приходилось думать.

Вот список предложений, которыми делятся создатели Lottie:

  • Файлы JSON должны быть как можно более компактными для мобильных продуктов.
  • Используйте свои навыки After Effect, чтобы избежать лишних ключевых кадров, например путем родительских функций вместо добавления ключевого кадра на каждом слое.
  • Избегайте использования ключевых кадров пути, поскольку они создают очень большой документ из преобразования всей вершины из пути.
  • Лучше всего избегать покачивания, автоматической трассировки и аналогичных методов, которые создают большое количество ключевых кадров. Создание такого большого файла может сделать файл JSON очень большим и негативно повлиять на производительность.
  • Преобразуйте любой слой Illustrator, EPS, SVG или PDF для формирования слоёв в After Effects, в противном случае это приведёт к ошибке.
  • Экспорт в 1X при экспорте файла каждый пиксель на иллюстрации будет переведён в точки для iOS и DPS для Android; вот набор метрик устройств в DPS, которые Google собрала вместе.
  • Lottie пока не поддерживает выражения или эффекты.
  • Режимы наложения, а конкретно «Умножение», «Экран» или «Добавить» пока не поддерживаются, а также не отображаются с помощью Luma.
  • Стили слоёв (тень, наложение, обводка…) пока не поддерживаются; нули могут быть использованы, но для их работы необходимо включить видимость и изменить непрозрачность до 0%.

Импортируйте слои, откройте композицию, выберите все слои, щелкните правой кнопкой мыши и выберите: «Создать» → «Создать фигуру из векторных слоёв».

Это создаст векторные слои, которые не доставят нам хлопот при экспорте в Lottie.

Нам нужно удалить AI-файлы и работать только с векторными слоями.

Я хотел анимировать лопасти в 3D, но поскольку они не поддерживаются, мне пришлось делать это «традиционным способом» и поэтому я симулировал вращение, анимируя размер в X (ширина).

После того, как воссоздать нужную скорость, я создал нулевой объект, чтобы переместить весь логотип и заставить его «взлетать» и «приземляться». При этом используя векторы в положении, чтобы сделать движение более плавным.

Как мы читали ранее, нулевые объекты должны быть превращены в видимые и иметь 0% прозрачности, чтобы работать.

После того, как у меня появилась анимация, я захотел открыть расширение Lottie.

Откроется окно, где вы можете просмотреть анимацию, загрузить её в Lottie-файлы и сохранить на своем компьютере. Для этого вам уже нужно иметь аккаунт в LottieFiles.

Этот способ создания анимации для веб-сайтов действительно интересен, поскольку он сохраняет отличное качество и прост в реализации.

Welcome to the Community!

We have a brand new look! Take a tour with us and explore the latest updates on Adobe Support Community.

Adobe Support Community

Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
  • Home
  • After Effects
  • Discussions
  • How to import a gif to after effects?
/t5/after-effects-discussions/how-to-import-a-gif-to-after-effects/td-p/5678737 Dec 31, 2013 Dec 31, 2013

Copy link to clipboard

I want to edit a gif in after effects, but when I try to import it I get an error that says this gif is damaged or unsupported. I googled my error, but didn't get anything.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

1 Correct answer

Adobe Community Professional , Mar 13, 2015 Mar 13, 2015 Szalam • Adobe Community Professional , Mar 13, 2015 Mar 13, 2015 First of all, sharing a link to a file on your desktop isn't going to help since we don't have access to your desktop.Secondly, the usual workflow is to go from a video file in AE and then take the resulting file into Photoshop to turn it into a GIF.GIF is a terrible format to export anything in unless it's at the final step. It is not a good intermediate file type. TIFF would be better. Heck, even a high quality JPEG would be better.

Copy link to clipboard

And what GIF? AE doesn't support animated GIFs in any way and for static GIFs has relied on Quicktime which at best is/ was a fragile thing. That being so, you better convert it in Photoshop or anotehr app first to something AE actually can use.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

After Effects can import animated GIF files. It is exporting animated GIF files that relies on Photoshop.

As Mylenium says, it would help to know more about what you're trying to import. If you point us to the file that you're trying to import, we can give it a try.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

I tried converting to .mov, but I got the same error with that one.

EDIT: Nevermind the original question, I figured out how to crop a video and download it directly so I can screw around in after effects. Can't figure out how to move lightning start/end points in one frame without moving them in other though.

Also how to export it to photoshop to export as a gif would be nice as well.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

If you don't understand how to animate the end points of the Advanced Lightning effect, you should definitely start here to learn After Effects.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

Thanks, found the section and bookmarked that page for future reference.

Is thier a way to hide the start/direction points from previous keyframes?

Didn't see it in the section in the video on animations, and wasn't sure where else to look, google didn't help. It seems like something that should be a simple toggle on/off thing though.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

sthreet wrote:

Is thier a way to hide the start/direction points from previous keyframes?

I don't understand the question. Could you try explaining a bit more thoroughly what you are trying to do? Pictures might help.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

Actually they aren't past keyframes, they are a pathing for the lightning, but If possible I'd rather edit one frame at a time and they get in the way.

Mostly because the lightning isn't going to follow one path.

1.jpg

2.jpg

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

You can change how much of the motion path you see in the AE preferences.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

Thanks, found it.

Sorry for the slow reply, don't have anything else to ask right now, but I felt like posting the end result, just because. This lightning is a lot of fun, even if it takes editing each frame, I think i'm going to screw around with affect effects effects more often. (Looks like you have to open gifs in new tab to view though.)

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

Todd_Kopriva wrote:

After Effects can import animated GIF files. It is exporting animated GIF files that relies on Photoshop.

As Mylenium says, it would help to know more about what you're trying to import. If you point us to the file that you're trying to import, we can give it a try.

Hi. I have the same question as the original author I believe. Here is my file: Desktop\sanders-spiff-gif2.jpg. It's a GIF that I exported from Photoshop and I want to use it in After Effects. I get the same error as the OP. Do I need to export the file as something else? If so, what? Thx!

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

First of all, sharing a link to a file on your desktop isn't going to help since we don't have access to your desktop.

Secondly, the usual workflow is to go from a video file in AE and then take the resulting file into Photoshop to turn it into a GIF.

GIF is a terrible format to export anything in unless it's at the final step. It is not a good intermediate file type. TIFF would be better. Heck, even a high quality JPEG would be better.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

Szalam wrote:

GIF is a terrible format to export anything in unless it's at the final step. It is not a good intermediate file type. TIFF would be better. Heck, even a high quality JPEG would be better.

Nothing ever dies on the Net, not even legitimately dead formats. Not even formats that have had a wooden stake driven through them.

There's a sudden resurgence in the popularity of GIFs as decorative web doodads. We get the request often these days form our web people to hand them short video clips that they can process out as little GIF movies. They're cute. Like mice. They're vermin. Like rats.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

I didn't say GIF was dead. I just said you shouldn't make one UNTIL the last step. I'm on reddit (heck, I'm one of the folks in charge of the /r/AfterEffects subreddit), so I know all about the GIF's second life.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

hi, i was intrigued by this thread because i want to create a couple of animated GIFS. so..

does after effects NOT IMPORT animated GIFs? who can give a definitive answer because i have seen some contradictory answers.

thanx!

also if you had a series of images: lets say 25 that you pulled from an mpeg via opening it in after effects. would the work flow be to then open that series of elements in photoshop? and then make them an animated GIF. if possible and lastly, i'd like to get a quick summary of which programs export animated GIFS. so here goes please correct me if i'm wrong:

Welcome to the Community!

We have a brand new look! Take a tour with us and explore the latest updates on Adobe Support Community.

Adobe Support Community

Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
  • Home
  • After Effects
  • Discussions
  • How to import a gif to after effects?
/t5/after-effects-discussions/how-to-import-a-gif-to-after-effects/td-p/5678737 Dec 31, 2013 Dec 31, 2013

Copy link to clipboard

I want to edit a gif in after effects, but when I try to import it I get an error that says this gif is damaged or unsupported. I googled my error, but didn't get anything.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

1 Correct answer

Adobe Community Professional , Mar 13, 2015 Mar 13, 2015 Szalam • Adobe Community Professional , Mar 13, 2015 Mar 13, 2015 First of all, sharing a link to a file on your desktop isn't going to help since we don't have access to your desktop.Secondly, the usual workflow is to go from a video file in AE and then take the resulting file into Photoshop to turn it into a GIF.GIF is a terrible format to export anything in unless it's at the final step. It is not a good intermediate file type. TIFF would be better. Heck, even a high quality JPEG would be better.

Copy link to clipboard

And what GIF? AE doesn't support animated GIFs in any way and for static GIFs has relied on Quicktime which at best is/ was a fragile thing. That being so, you better convert it in Photoshop or anotehr app first to something AE actually can use.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

After Effects can import animated GIF files. It is exporting animated GIF files that relies on Photoshop.

As Mylenium says, it would help to know more about what you're trying to import. If you point us to the file that you're trying to import, we can give it a try.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

I tried converting to .mov, but I got the same error with that one.

EDIT: Nevermind the original question, I figured out how to crop a video and download it directly so I can screw around in after effects. Can't figure out how to move lightning start/end points in one frame without moving them in other though.

Also how to export it to photoshop to export as a gif would be nice as well.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

If you don't understand how to animate the end points of the Advanced Lightning effect, you should definitely start here to learn After Effects.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

Thanks, found the section and bookmarked that page for future reference.

Is thier a way to hide the start/direction points from previous keyframes?

Didn't see it in the section in the video on animations, and wasn't sure where else to look, google didn't help. It seems like something that should be a simple toggle on/off thing though.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

sthreet wrote:

Is thier a way to hide the start/direction points from previous keyframes?

I don't understand the question. Could you try explaining a bit more thoroughly what you are trying to do? Pictures might help.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

Actually they aren't past keyframes, they are a pathing for the lightning, but If possible I'd rather edit one frame at a time and they get in the way.

Mostly because the lightning isn't going to follow one path.

1.jpg

2.jpg

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

You can change how much of the motion path you see in the AE preferences.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

Thanks, found it.

Sorry for the slow reply, don't have anything else to ask right now, but I felt like posting the end result, just because. This lightning is a lot of fun, even if it takes editing each frame, I think i'm going to screw around with affect effects effects more often. (Looks like you have to open gifs in new tab to view though.)

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

Todd_Kopriva wrote:

After Effects can import animated GIF files. It is exporting animated GIF files that relies on Photoshop.

As Mylenium says, it would help to know more about what you're trying to import. If you point us to the file that you're trying to import, we can give it a try.

Hi. I have the same question as the original author I believe. Here is my file: Desktop\sanders-spiff-gif2.jpg. It's a GIF that I exported from Photoshop and I want to use it in After Effects. I get the same error as the OP. Do I need to export the file as something else? If so, what? Thx!

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

First of all, sharing a link to a file on your desktop isn't going to help since we don't have access to your desktop.

Secondly, the usual workflow is to go from a video file in AE and then take the resulting file into Photoshop to turn it into a GIF.

GIF is a terrible format to export anything in unless it's at the final step. It is not a good intermediate file type. TIFF would be better. Heck, even a high quality JPEG would be better.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

Szalam wrote:

GIF is a terrible format to export anything in unless it's at the final step. It is not a good intermediate file type. TIFF would be better. Heck, even a high quality JPEG would be better.

Nothing ever dies on the Net, not even legitimately dead formats. Not even formats that have had a wooden stake driven through them.

There's a sudden resurgence in the popularity of GIFs as decorative web doodads. We get the request often these days form our web people to hand them short video clips that they can process out as little GIF movies. They're cute. Like mice. They're vermin. Like rats.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

I didn't say GIF was dead. I just said you shouldn't make one UNTIL the last step. I'm on reddit (heck, I'm one of the folks in charge of the /r/AfterEffects subreddit), so I know all about the GIF's second life.

Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Copy link to clipboard

hi, i was intrigued by this thread because i want to create a couple of animated GIFS. so..

does after effects NOT IMPORT animated GIFs? who can give a definitive answer because i have seen some contradictory answers.

thanx!

also if you had a series of images: lets say 25 that you pulled from an mpeg via opening it in after effects. would the work flow be to then open that series of elements in photoshop? and then make them an animated GIF. if possible and lastly, i'd like to get a quick summary of which programs export animated GIFS. so here goes please correct me if i'm wrong:

Показываю 3 способа, как экспортировать гифку из Adobe After Effects.

Добавляйте в закладки — вам обязательно пригодиться!

Есть еще вариант экспорта через FFMPEG, но как по мне, он слишком заморочливый и если нужно рендерить много гифок, проще купить плагин GifGun, чтобы сохранять в один клик.

Еще видео по теме:


Видеомонтаж

605 постов 4.7K подписчиков

Правила сообщества

Критикуй, мамкин оператор.

Чтобы вам не звонили от вашего сотового оператора и не предлагали "самые выгодные тарифы"

Все чаще в "Лучшем" появляются гневно-ругательные посты на эту тему. Внимание!

Чтобы Вам после входящего звонка не меняли тарифный план.

Чтобы Вам без вашего ведома не подключали платные услуги, когда Вы чихнули во время разговора, а сотрудник решил, что вы согласились.

Чтобы Вам вообще не звонили от имени вашего сотового оператора с любыми предложениями.

Вы звоните оператору и спокойным голосом требуете подключить услуги:

"Отказ от всех предложений оператора"

"Отказ от звонков с предложениями от оператора"

"Отказ от предложений партнеров в SMS, MMS, e-mail и звонках"

Эти услуги невозможно подключить через личный кабинет, они скрыты.

Добавляю после вопросов в комментариях - в ЛК есть ссылка на подключение ДОСТУПНЫХ услуг, среди них нет тех, что я перечислила, они подключаются только по просьбе абонента.

Можете написать в чат, но лучше позвонить, поставить звонок на запись, ОБЯЗАТЕЛЬНО предупредить сотрудника, что звонок записывается и попросить подключить все перечисленные услуги. Сотрудник обязательно должен выполнить Вашу просьбу.

В течение часа подключенные услуги должны появиться в вашем личном кабинете.

Все эти процедуры непременно надо проделать с симками детей, родителей, умных ворот и проч.

И будет вам счастье! (пока обсосы не придумают новые способы обмана и развода на деньги своих любимых абонентов)

Чтобы вам не звонили от вашего сотового оператора и не предлагали "самые выгодные тарифы" Сотовые операторы, Билайн, МТС, Мегафон, Тарифы, Совет, Лайфхак, Текст

Лайфхак, чем больше вы поймёте, тем меньше придётся запоминать

Лайфхак, чем больше вы поймёте, тем меньше придётся запоминать


Как избавиться от запаха в обуви в домашних условиях?

Предыстория:
Всю свою жизнь дико пахли ноги и вся моя обувь. Я их мыл постоянно, но стоило день походить и вечером вас ждал зловонный сюприз.
Чего я только не делал: мыл с дегтярным мылом( чуть-чуть помогало), обрабатывал перекисью, делал ванночки из коры дуба, мазал пастой теймурова, забрызгивал спиртом по неск раз в день, обрабатывал хлоргескидином 1%, стирал кожу на пятках, коротко-коротко подстригал ногти и мыл ноги по три раза в день
Но ничего из этого либо не помогало совсем, либо помогало на день-два.

Решение:
В штатах загуглил данный вопрос и оказалось что, американцы используют спрей Лизол ( Lysol) который уничтожает все бактерии, вирусы и грибки. Но используют его просто, чтобы убрать запахи животных, сигарет и других неприятнопахнущих вещей.
Но на форуме спортсменов я нашел несколько советов, что люди опрыскивали им комки бумаги и оставляли на ночь в обуви и запах из обуви пропадал( ну оно и понятно, все организмы там погибли)
Я не вдавался в вопрос насколько он вреден при разбрызгивании на кожу, но его можно применять на пищевых поверхностях и указано, что безопасен для детей.

Я решил испытать средство на своих ногах, так как реально перепробовал почти все способы борьбы с запахом.
И О ЧУДО, после двух применений на обувь и на ноги, всё просто перестало пахнуть.
Я столько лет терпел это, мне было стыдно прийти в гости, стыдно снимать обувь в примерочных и магазинах. И наконец этот груз упал с плеч.

Как я делал:
Кроссовки постирал - высушил и забрызгал внутрь. Оставил на ночь.
Ноги помыл, вытер насухо и обрызгал и промассировал так, чтобы все попало между пальцев и под ногти и на ногти.
Дал высохнуть ногам
А потом процесс повторял каждый раз, как мылся.

И даже если неделю не брызгать, ноги не пахнут.
В России видимо не так распространён, хотя на озоне отзывы есть, но совсем по другому использованию.
В общем за 400 рублей это лучшее средство, отпишетесь, кому поможет.
Всем здоровья)

Ну и фото этого чуда ( продается и в России, правда в отличии от того, что сделано в США не такой сильный запах, да оно и к лучшему):

Читайте также: