Как сделать крутой анимированный GIF

14 022 просм. 0
Рубрики: Дизайн. UI. UX
Метки: , ,
0
0
0
0
Total
0

Возможно, пришло время и вам, уважаемые читатели, активизироваться и попробовать создать свои собственные яркие GIF-файлы. Вы сами убедитесь, что создание собственной анимации не трудно и на самом деле весело 🙂

Итак, представим, что у вас есть видео-ролик, из которого вы хотели бы вырезать яркий и эмоциональный момент и облечь его в форму анимированного GIF для того, чтобы показать его друзьям в социальных сетях.

Начнём?

как сделать анимированный gif

1. Не бойтесь Photoshop

Если даже Вы — «чайник» не так страшен Photoshop, как его малюют. Ведь не нужно быть продвинутым веб-дизайнером, чтобы использовать его. Photoshop на самом деле самый простой и быстрый способ создания GIF. Это не значит, что невозможно использовать другие ресурсы, но это самый лучший вариант.

Если вы сомневаетесь или просто хотите посмотреть другие варианты, то обратите внимание на такие сервисы:

  • Adobe Elements

2. Выберите яркий момент

Как показывают «лайки» и рейтинги в соцсетях, наиболее популярными GIF-файлами являются небольшие клипы, которые показывают какую-то яркую реакцию или момент: эмоции людей, смешное поведение животных, явления природы пр.

Поэтому вы должны внимательно просмотреть свой файл и решить какой же из ярких моментов вы будете использовать дальше.

как сделать анимированный gif

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

Для вырезки нужного момента видео, воспользуйтесь IMOVIE — это простой, бесплатный способ обрезать видео для Mac.

Для пользователей Windows подойдет Movie Maker.

как сделать анимированный gif

Вы также можете скачать ряд полезных и бесплатных сервисов, таких как Avidemux, RealPlayer Trimmer и Pinnacle VideoSpin.

3. Импорт видео в Photoshop

Теперь, после того как подготовлен видео-файл с нужным нам моментом, запускайте Photoshop, открывайте меню File > Import. Выбираем пункт «Video Frames to Layers. После этого появится небольшое всплывающее окно, которое в итоге даст разбивку на множество слоёв данного файла.

как сделать анимированный gif

4. Отредактируйте слои

Ну что ж, теперь файл разбит на слои, и можно с ними делать что захотите. Если вы уже работали с Photoshop и знаете как создавать анимированный gif , то это не составит труда — принцип тот же: делаем определенные манипуляции с отдельными слоями.

Например, загружаем в формате png изображение солнечных очков, размещаем его в каждом слое и просто сдвигаем очки в каждом слое. В последнем слое вставляем фразу «Deal With In» и получаем такой результат:

как сделать анимированный gif

Можно попробовать сделать проще, например, написать текст в первом слое (например, I love you) и просто размножить его на все слои. Тогда получится так:

как сделать анимированный gif

Но если хотите сделать что-то более привлекающее внимание, можно, например, поместить текст через несколько слоев, в таком случае получится мигание:

как сделать анимированный gif

Вообщем, вариантов манипуляции со слоями множество, так что не сдерживайте свою фантазию.

5. Сохраните ваш GIF

Ну вот, самая сложная креативная и техническая часть закончена, но теперь важно правильно сохранить ваш GIF. Для этого в Photoshop выберите File > Save for Web (а не просто «Save»). Убедитесь, что сохранили ваш файл в именно формате GIF.

Считается правилом хорошего тона для веб, если сохраненный вами GIF «весит» как можно меньше, в идеале не больше 1 Мб. Но постарайтесь не уменьшать файл за счет уменьшения количество отображаемых цветов. Количество цветов должно быть максимальным, т.е. 256. Иначе, ваш GIF файл сильно потеряет в качестве изображения.

6. Выложите GIF в интернет

Теперь дайте вашему новорожденному GIF-детищу дом в интернет, другими словами, выложите его на хостинг. Например, Tumbl, Imgur или любой другой.

И, вуаля, покажите его друзьям, загрузите в соцсети и получайте «лайки» 🙂

И помните, что мастерство приходит с практикой. Не останавливайтесь, если сначала у вас получится не очень хорошо. Ведь, возможно, терпение и труд превратят вас в гуру и популярного GIF-блогера 🙂

Напоследок, видео-урок по созданию крутого анимированного GIF (на английском):


Подготовлено ТопОбзор по материалам Mashable, изображения взяты с iStockphoto, ULTRA_GENERIC, Nyan Cat

При использовании этого материала «Как сделать крутой анимированный GIF» активная ссылка на http://www.topobzor.com обязательна.

0
0
0
0
Total
0
comments powered by HyperComments
comments powered by HyperComments!