Как сделать анимированную гифку (пошаговая инструкция)

топ 100 блогов nasolini28.07.2015 По многочисленным просьбам пост-обучение. Уговорили, раскрою вам секрет, как сделать анимированную гифку. Учиться будем на кошках. Вчера наконец-то сняла, как моя пушистая Софи самостоятельно включает бра, вот на этом доказательстве наглядной эволюции мурок и потренируемся!

Итак,  gif-анимация - это последовательное отображение изображений с заданной частотой в одном файле. Живая картинка с повторяющимся действием.

Что нужно для создания шыдевра:
1. Прикольное видео.
2. Специальная программа для конвертации кадров видео в формат GIF.
3. Чувство юмора и меры (да-да, без них никак, ведь прелесть гифок в запечатлении только самого интересного или смешного момента).

1. Прикольное видео
Гифки можно делать из чужих роликов, например, с YouTube, но интереснее снять видео самостоятельно. Я снимаю при помощи смартфона, форматы: MOV, mp4. Стараюсь делать покороче - от нескольких секунд до 1 минуты. С таким удобно работать. Но если получилось длинное - нестрашно, его можно обрезать.

Съемка, а потом выбор видео для гифки, самый длительный процесс. Представив себя режиссером, необходимо выбрать лучшие кадры для будущей анимашки.
Как сделать анимированную гифку (пошаговая инструкция)

2. Специальная программа для конвертации кадров видео в формат GIF
Вариантов программ по запросу в поисковике «Как сделать анимированную гифку из видео» множество, я пользуюсь программой Adobe Photoshop, версия: 2014.2.2. Лицензионную версию за деньги можно скачать с сайта разработчика, а пиратскую бесплатно с торрентов.

Если вы хотите создать гифку вот прямо сейчас и не заморачиваясь, рекомендую сервис: http://troll-face.ru/video-to-gif/ - за минуту "нарежете" из любого ютьюбовского ролика, чего душе угодно. Что делать подскажут прямо онлайн на чистом русском языке.

3. Создание анимированной гифки из видео в Adobe Photoshop (фотошопе)
Для тех, кто не побежал делать гифку онлайн, продолжаю рассказ. Итак, у вас есть видео, идея и нужная версия фотошопа!  Тогда ныряйте под спойлер:


Шаг 1. Импортируем видео в фотошоп
Файл  - Импортировать - Кадры видео в слои
Как сделать анимированную гифку (пошаговая инструкция)

Шаг 2. Выбираем нужный видео-ролик
Как сделать анимированную гифку (пошаговая инструкция)

Шаг 3. Окрывается окошко импорта видео в слои фотошопа
Как сделать анимированную гифку (пошаговая инструкция)

Шаг 4. В окошке импорта ставим галочки:
- Только выделенный диапазон;
- Оставить каждый 2-й кадр (а если видео большое и затянутое, можно и  каждый 5-й);
- Создать покадровую анимацию.

Как сделать анимированную гифку (пошаговая инструкция)

Шаг 5. Задаем диапазон в окошке импорта
Просматриваем видео и выбираем лучший кусочек, чем меньше, тем лучше.
Выбор осуществляется при помощи ползунков. Отметив нужный диапазон, нажимаем "ОК".
Как сделать анимированную гифку (пошаговая инструкция)


Шаг 6. Видео раскладывается на кадры Фотошопа
Кадры можно просмотреть на шкале времени (низ картинки). Открыть "Шкалу времени" можно из верхнего меню (вкладка "Окно").
Как сделать анимированную гифку (пошаговая инструкция)


Шаг 7. Кнопка просмотра
По клику на кнопку просмотра вы увидите текущий вариант вашей гифки.
Как сделать анимированную гифку (пошаговая инструкция)
Шаг 8.  Отрезаем ненужные части будущей гифки
При помощи специального иструмента задаем нужную область нашей гифки. Все лишнее отрезаем, чтобы не отвлекало внимание. Выделив  нужную область, нажимаем галочку подтверждения в правом верхнем углу.

Как сделать анимированную гифку (пошаговая инструкция)

Шаг 9. Обрезанное изображение
Как сделать анимированную гифку (пошаговая инструкция)


Шаг 10. Проверяем размер будущей гифки
Чуть выше шкалы времени видим процент отображаемого изображения по отношению в реальному размеру. Такая огромная гифка никому не нужна, будем уменьшать. Для просмотра реального размера -  нажимаем на лупу на панели и инструментов слева и доводим значение процентов до 100.
Как сделать анимированную гифку (пошаговая инструкция)

Шаг 11. Изменения размера гифки
Смотрите какая огромная будет гифка, если ее не уменьшить - в экран не влезет. Заходим в пункты меню: Изображение - Размер изображения.
Как сделать анимированную гифку (пошаговая инструкция)

Шаг 12. Изменяем размер
Как сделать анимированную гифку (пошаговая инструкция)

Шаг 13. Удаление ненужных кадров
Просматриваем кадры, ненужные смазанные или кадры без динамики движения - удаляем.  Они  не имеют практической ценности, а вес гифки увеличивают. Выделив несколько кадров (зажав Shift), можно выполнить массовое удаление.
Как сделать анимированную гифку (пошаговая инструкция)
Шаг 14. Задаем время отображения кадров
По умолчаннию кадры отображаются слишком быстро. Выделяем все кадры (зажав Shift), наводим курсор на отображение времени любого кадра и кликаем по нему. Если предложенное время не устраивает - выбираем пункт "Другое"
Как сделать анимированную гифку (пошаговая инструкция)

Шаг 15. Окошко выбора времени отображения кадров
В открывшемся окне выбираем нужную частоту смены кадров.Нажимаем "ОК".
Как сделать анимированную гифку (пошаговая инструкция)
Для каждого кадра можно выбрать свое отдельное время показа. Для этого нужно снять выдение со всех кадров и кликнуть только на нужный.

Шаг 16. Просмотр результата
Смотрим, что получилось, нажав на кнопку просмотра.
Важно сделать файл небольшим: обрезать ненужные части, удалить ненужные кадры, изменить размер. Если этого не сделать, итоговый файл будет много весить, и вы не сможете разместить его в своем ЖЖ. Оптимальный вес: до 6 Мb.
Как сделать анимированную гифку (пошаговая инструкция)

Шаг 17. Сохраняем результат:
Файл - Сохранить для Web
Как сделать анимированную гифку (пошаговая инструкция)

Шаг 18. Настройки сохранения
Рекомендую выбирать вариант сохранения с наименьшим весом. После выбора нажимаем "ОК".Как сделать анимированную гифку (пошаговая инструкция)

Шаг 19. Присвоение имени
В открывшемся окне выбираем путь сохранения, присваиваем файлу имя и проверяем формат: GIFКак сделать анимированную гифку (пошаговая инструкция)

ВСЕ! Публикуем и наслаждаемся реакцией!

Также на гифку можно нанести спецэффекты, свою ватермарку, любой текст. Можно дублировать кадры, создавать иллюзии и  многое-многое другое, но я продолжу рассказывать, если увижу в комментариях, как результат этого поста - созданную вами гифку! (напоминаю можно пойти по простому пути и сделать гифку онлайн - см. п. 2).

P.S.: Так как я самоучка и мой любимый метод самообучения -  "метод тыка", на ряд возможных вопросов могу не ответить. Но точно знаю, что все ответы есть в Интернете :)

Итоговый шыдевр: Несем свет в массы!
Как сделать анимированную гифку (пошаговая инструкция)

Оставить комментарий

Katenka Svetlichnaya 18.02.2018 12:01
Я лично делаю на много быстрее и проще, и этот метод как сделать gif я узнала от сюда http://softgayd.ru/index.php/programmy/grafika/547-kak-sdelat-gif-animatsiyu-bystro
Архив записей в блогах:
#социальноегосударство Число безработных в России упало до рекордно низкого уровня! МОСКВА, 26 сентября. /ТАСС/. Число безработных в России находится на рекордно низком уровне и составляет 3,5 млн человек. Об этом сообщил в среду глава Минтруда Максим Топилин на пленарном ...
Публикую здесь свой новый текст на "Эхе Москвы" Министерство обороны требует от легендарного производителя автоматов Калашникова «Ижмаш» работать себе в убыток. Ведомство хочет закупать оружие по цене ниже себестоимости . А все ...
И - где уж наша не пропадала!:) - еще один чудный, на мой взгляд, флэшмоб от sova_savushka   - музыкальный. Ежедневно выкладывается одна из песен по такому вот плану: Ежедневно буду выкладывать песню на одну из тем по плану: Day 01 - Your favorite song Day 02 - Your ...
Некоторые СМИ сообщили без ссылки на достоверные источники, что якобы картина Пабло Пикассо Le R ê ve ( Сон)  с изображением юной любовницы художника Мари-Терез Вальтер (Marie-Thérèse Walter) продана за 155 миллионов долларов. Как пишут эти СМИ, в частности ...
Огурца не хватает —  ...