Анимационные эффекты. Красивый анимированный эффект
Наверняка все знают о небольших анимированных картинках, иначе говоря о GIF-ках. Пользователи сайта vk.com особенно знакомы с ними, потому что там есть возможность добавлять их в комментариях. Конечно, есть такой вариант, как брать уже готовые изображения. Но не всегда найдешь то что хочешь, и, поэтому я хочу рассказать о сервисах, которые позволяют создать собственные анимированные изображения. При этом от вас не требуется каких-либо супернавыков владения компьютером. В полной новости приводится ряд сервисов, поэтому какой-нибудь из них подойдет и вам!
GIF анимации онлайн
1. Loogix
Чтобы воспользоваться данным сервисом вам необходимо как минимум 3 изображения. Если вам нужна GIF-ка, которая содержит более 3 изображений, тогда вы можете добавить до 10 изображений с помощью ссылки с текстом «Add one more picture». Сервис может создать анимировенное изображение в 5-ти различных скоростях. Также есть возможность добавления эффектов для вашей анимации (например «Размытие»).
- Также этот сервис включает еще две возможности для создания анимаций:
- Создание обратных анимаций
2. Picasion
Picasion очень похож внешне на сервис Loogix, но немного отличается. Кроме всего, этот сервис предлагает импортировать изображения с сайта Flickr используя специальный тег изображения (для поиска).
- Помимо основного сервиса есть еще три:
- Создание блестящих GIF
- Создание аватарок
- Изменение размера изображения
3. Gickr
Как и два предыдущих сервиса Gickr для создания анимации использует от 3 до 10 изображений. Также этот сервис позволяет не только создавать анимации различных размеров, но и с различными скоростями (до 10 секунд). Присутствует возможность импортировать изображения с сайтом Flickr и Picasa.
4. MakeaGIF
Makeagif представляет собой еще более упрощенный сервис для создания анимаций, чем рассмотренные предыдущие. Почти по центру находится большая кнопка с текстом «add pictures», с помощью которой можно загрузить необходимые изображения. Для того чтобы загрузить сразу несколько изображений необходимо удержить клавишу CTRL и выделять нужные.
- Плюс к этому сервису есть еще:
- Создание GIF из роликов Youtube
- GIF-ки с помощью веб-камеры
- Преобразование видео в анимацию GIF
5. GIFMaker.me
Еще один сервис для создания GIF анимаций который поддерживает форматы изображений JPG, PNG и GIF. Всё что нужно для создания анимации сразу видно. Вам лишь нужно загрузить необходимые изображения, а затем, передвигая ползунки, смотреть в окно предпросмотра справа вверху.
6. ImgFlip
Сразу скажу, что при создании анимаций на этом сервисе у вас на GIF-ках будет водяной знак. Чтобы убрать этот знак, нужно иметь аккаунт Pro. А в остальном этот сервис сильно похож на рассмотренные нами выше.
7. GIFPal
Кроме основных возможностей по созданию анимаций, этот сервис позволяет добавлять различные эффекты для GIF-ок: яркость, контрастность и насыщенность.
Надписи, картинки и прочие элементы нашего слайда могут перемещаться по экрану как вам (и им) будет угодно - с помощью встроенных эффектов анимации.
Для того чтобы «оживить» картинку, включите лентуАнимация - именно на ней собраны все инструменты для работы с движением.
Выделяем нужный элемент слайда, и щелкаем по кнопкеДобавить анимацию в группеНастройка анимации или открываем списокАнимация.
Все эффекты в PowerPoint разбиты на четыре группы:
Вход - эффекты, связанные с появлением элемента на экране. Объекты могут постепенно проявляться на экране, «вылетать» на слайд сбоку или внезапно появляться на экране.
Выделение - уменьшение или увеличение размеров объекта, изменение цвета или вращение объекта вокруг своего центра.
Выход - исчезновение элемента с экрана. Объекты могут «слетать» со слайда, исчезать из вида или постепенно исчезать, закручиваясь по спирали.
Пути перемещения - движение элемента по определенной траектории (вверх, вниз, вправо, влево или по траекториям в виде звезды или круга).
Если в открывшемся списке вы не нашли нужного эффекта, щелкните пунктДополнительные эффекты входа (выделения, выхода) в нижней части меню.
Любой эффект может использоваться отдельно или в сочетании с другими эффектами. Например, сочетая эффект входаВылет и эффект выделенияИзменение размера, можно сделать так, что строка текста начнет появляться на экране с левой стороны, одновременно увеличиваясь в размере.
Все эти изменения происходят не одновременно, а в заданном вами порядке (последовательность обозначается номерами (тегами), которые появляются рядом с каждым элементом). Тег отображается только в обычном режиме при выборе вкладкиАнимация.
Список всех эффектов анимации на слайде можно просмотреть вОбласти анимации. Область анимации позволяет просматривать тип эффекта анимации, порядок воспроизведения нескольких эффектов анимации относительно друг друга, название объекта, к которому применен эффект, и длительность эффекта.
Чтобы открытьОбласть анимации выберите пункт с таким же названием на вкладкеАнимация в группеРасширенная анимация.
В области задач номера указывают на порядок, в котором эффекты воспроизводятся. Номера в области задач соответствуют непечатаемым нумерованным тегам, отображаемым на слайде.
Временные шкалы показывают длительность эффектов.
Значками представлен тип эффекта анимации. В данном примере это эффектВход.
КнопкаПросмотр в верхней части окнаОбласть анимации позволяет убедиться в правильной работе каждого эффекта. В нижней части окна кнопки со стрелками предназначены для изменения порядка эффектов.
Выберите элемент списка, чтобы увидеть значок меню (стрелка вниз), а затем щелкните значок, чтобы открыть меню.
С помощью этого меню можно настроить начало анимации:
Запускать щелчком - эффект анимации начинается по щелчку в слайде.
Запускать вместе с предыдущим - эффект анимации воспроизводится вместе с предыдущим эффектом. Этот параметр объединяет воспроизведение нескольких эффектов.
Запускать после предыдущего - эффект анимации начинается сразу после окончаниявоспроизведения предыдущего эффекта из списка.
Пункты менюПараметры эффектов иВремя открывают диалоговое окно настройки конкретного эффекта анимации, в котором можно установить дополнительные параметры - звук, задержку времени, анимацию текста по буквам или уровням абзаца и др.
А теперь самое главное: для каждого элемента вы можете назначить не один, а сразу несколько эффектов. При этом они не обязательно должны следовать друг за другом, а могут быть разделены значительными промежутками времени. Скажем, надпись может «прилететь» на экран в начале демонстрации, а в конце - точно таким же образом «вылететь» с него.
Можно еще усложнить задачу: создать НЕСКОЛЬКО видов примерно одинаковых элементов (например, несколько видов рамки с текстом реплики) и наложить их друг на друга. Работай мы в обычном графическом редакторе - получилась бы каша. Но с помощью спецэффектов мы можем разделить эти элементы во времени. Исчезнет один - и на его месте тут же появится другой.
Вот так с помощью спецэффектов вы можете создать целое шоу из одного-единственного слайда.
Для того чтобы несколько элементов презентации имели одинаковые эффекты анимации, не нужно монотонно повторять одни и те же операции, стараясь ничего не перепутать и не забыть - PowerPoint позволяет копировать анимацию по образцу подобно тому, как с помощью форматирования по образцу копируется форматирование текста. Благодаря анимации по образцу можно скопировать анимацию из одного объекта или слайда и вставить форматирование в другой объект или слайд, в несколько слайдов или в образец слайдов, который влияет на все слайды. Можно даже скопировать анимацию из одной презентации в другую.
После завершения работы просмотрите, как будет демонстрироваться зрителям созданный вами слайд в готовой презентации - на ленте анимация для этого имеется кнопкаПросмотр и кнопкаПоказ слайдов Чтобы воспроизвести готовый участок презентации, перейдите в режим просмотра презентации или просто нажмите на клавиатуре кнопкуF5.
Что бы создать GIF анимацию из своих фотографий, выберите фотографии с верхней ленты вашего альбома (если вы авторизованны на сайте), либо загрузите с диска компьютера. В нижней ленте приложения, вы найдете шаблоны GIF анимации . Кликнув на любом шаблоне, вы увидите в центральной части приложения как будет окончательно выглядеть ваша ГИФ-анимация . Гифки разделены по разделам, что бы вам проще было найти нужную заготовку анимации .
Как поменять фотографию в гифанимации ? - В каждом шаблоне есть несколько кадров в которых сменяются ваши фотографии, количество фотографий в гиф-анимации для каждого шаблона ограничено. Фотографии которые используются на данный момент в анимации находятся снизу, под вашими фотографиями. Они отличаются по размеру, и количество их задано жестко шаблоном гиф-анимации . Текущий кадр, в котором происходит смена фотографии, отмечен стрелкой. Он автоматически сменяется на следующий, если вы выбираете фотографию для данного кадра анимации . То есть когда вы выбираете из фотоальбома фотографию, или загружаете ее с компьютера, она попадает в кадр который отмечен стрелкой в ленте кадров GIF анимации .
Когда вы загрузили фотографии, и выбрали нужный анимационный шаблон и довольны результатом, что бы сформировать и сохранить полученную анимацию нажмите кнопку “Готово". Формирование анимации требует немного времени, подождите, после приложение даст вам возможность сохранить гиф-анимацию на диск. Надеюсь вам понравиться наше приложение и вы зайдете еще на сайт создать прикольную GIF анимацию. Если у вас возникли вопросы или пожелания по работе приложения пишите в комментариях (пока только для пользователей vk.ru и facebook.com), либо в разделе "Отзывы и комментарии" (см. внизу справа).
В этом Photoshop уроке вы узнаете, как на изображение добавить красивый, сказочный анимированный эффект.
Анимированный эффект – результат:
В качестве основы я буду использовать такую , где пошагово расписано, как её создавать. Итак, приступим!
Откройте Photoshop и создайте в нём новый документ размером 800 на 600 пикселей.
Прежде чем мы начнём создавать анимированный эффект, давайте сделаем несколько копий слоёв с блестящими частицами. Для этого на панели слоёв найдите группу glitter.
Кликните по ней правой кнопкой мыши и выберите команду Создать дубликат группы.
Теперь мы можем приступить к созданию нашей анимации. Для начала откройте панель анимации, перейдя в меню Window > Animation (Окно - Анимация).
В результате откроется такая шкала времени для создания анимации.
Здесь необходимо перейти к кадрам, для этого нажмите на кнопку Convert to Frame Animation (Преобразовать в покадровую анимацию).
Теперь мы можем работать с кадрами. Существует несколько способов создания анимации. Таким образом выберите первый кадр и кликните по значку Duplicates selected frames (Создание копии выделенных кадров) в нижней части шкалы времени.
Начинается самое интересное. Откройте группу glitter, которую мы недавно продублировали. Выберите первый слой и переместите его содержимое немного вниз.
Проделайте то же самое с остальными слоями этой группы. Только не перемещайте их слишком далеко от предыдущего перемещения.
Далее кликните по значку Tweens (Создание промежуточных кадров), который так же находится в нижней части шкалы времени. В открывшемся окне установите значение 50 для опции Frames to Add (Добавить кадров). Таким образом, у нас получилась хорошая плавная анимация.
Выделите последний кадр и снова продублируйте его.
Содержимое последнего слоя переместите вниз. Это заключительный кадр, здесь анимация заканчивается.
Снова создадим промежуточные кадры. Нажмите на кнопку Tweens (Создание промежуточных кадров), в открывшемся окне установите 30 кадров.
Давайте рассмотрим некоторые из имеющихся опций для кадров. Тут имеются различные вариации времени. Таким образом, вы можете установить время для каждого кадра. Для данной анимации я установил время 0,1 секунды.
Так же вы можете выбрать, сколько раз нужно воспроизвести анимацию. Здесь я выбрал Forever (Постоянно).
Теперь вы можете воспроизвести анимацию и проверить, всё ли в порядке. Сначала нажмите на значок «Преобразовать в шкалу времени видео», а затем на Play (Воспроизвести).
Если вас устраивает, как работает анимация, то сохраните её, для этого перейдите во вкладку File > Save for Web & Devices (Файл – Сохранить для Web и устройств) или нажмите комбинацию клавиш Ctrl + Alt + Shift + S. Для сохранения анимации установите формат GIF.
Наш анимированный эффект в виде движущихся блестящих частичек готов! Надеюсь вам понравился данный урок, и вы усвоили для себя что-то новенькое.
Любите анимационные картинки-блестяшки, а фотошоп в данный момент недоступен? Вам поможет онлайн сервис, который умеет создавать сложные живые картинки с анимированными элементами (там они называются марки или штампы). Более того, вы сможете туда закачивать свои детали для анимированных картинок: блестяшки, анимашки и просто красивые картинки.
Вот одна из анимашек которую я сделала в PixMix за 5 минут
Как начать пользоваться онлайн фоторедактором PixMix
После того как вы загрузили фон будущей живой картинки. Выбирайте штамп, кликайте на него (жёлтая стрелочка) и жмите на кисть (стрелка зелёная) . После того как кликните мышкой на картинку у вас там образуется кружок – это кисть. Вы можете увеличивать или уменьшать размер путём передвигания ползунка наверху (синяя рамочка) .
Картиночки анимашки, которые вы будете размещать на картинке — не двигаются и не уменьшаются, они просто замостятся, то есть рядами поместятся на фоне. И чтобы оставить одну или несколько в нужных местах, вам надо будет просто подтереть их инструментом «Стирательная резинка».
Вы можете написать блестящий или однотонный текст с обводкой на своём анимированном шедевре. Для этого надо кликнуть на букву «T» (жёлтая стрелочка). Написать текст (синяя стрелка). Наверху выбрать стиль шрифта (Бирюзовая стрела) и обводку (сиреневая) или без обводки (красная).
Выбрать чернила слева (то есть заливку текста), когда вы нажимаете на текст в онлайн фоторедакторе автоматически выставляется раздел «Чернила»
Жмите на слово «Хорошо» и увидите текст на своей анимационной картинке.
Вокруг текста вы увидите прямоугольную рамку и инструменты в каждом углу этой рамки:
- Крестик – удалить
- Стрелочка с двумя наконечниками – сделать надпись больше или меньше
- Стрелочка закруглённая – наклонить в одну, либо в другую сторону
- Прямоугольник в кружке – размножение текста
Вы можете менять «чернила», обводку и стиль текста, не меняя самого текста. Нажимать «Хорошо» и смотреть что у вас получится.
А после того как вы создадите свой шедевр – нужно нажать на зелёную галочку внизу слева от картинки. Когда сервис сгенерирует картинку, вас перекинет на страницу где нужно ввести название картинки. Описание – не обязательно.
Там же вы можете выбрать скорость анимации. По умолчанию там выставлена средняя.
И в заключении надо нажать на зелёную кнопку «Реестр».
После этого фоторедактор PicMix сгенерирует вашу блестящую анимированную картинку. И под своей анимационной картинкой вы увидите вот такие функции:
А ещё вы сможете добавить использованные в этой анимационной картинке блестяшки к себе в избранное. И они у вас появятся в разделе «Мои любимые марки» и вы их увидите когда начнёте создавать новую gif картинку. Для этого наводим на марку мышку и в выпавшем окне кликаем на слова «Добавить в избранное».
Марки вы можете так же добавить в избранное в разделе STAMPS на главном меню сайта ПикМикс.
Когда нас перекинет на другую страницу — нажимаем на слова «Версия без логотипа»
И наша анимированная картинка открывается в новом окне.
Вы можете её скачать на компьютер. Для этого кликаем по анимашке правой кнопкой мыши и в выпадающем окне выбираем «Сохранить картинку как».
Скорее всего на Фейсбуке картинка будет прочитана не сразу, а сначала появится вот такая публикация
Не спешите нажимать на слово «Опубликовать». Обновите страницу и поставьте ссылку туда ещё раз. Если опять появится то же самое, то опять обновите страницу. И только когда появится ваша красавица анимированная картинка, кликайте на слово «Опубликовать».
Красиво смотрится анимированная картинка на Фейсбуке. Гугл+ и Одноклассниках. А вот ВКонтакте картинка получается маленькая и чтобы увидеть анимашку во всей красе надо кликать на неё. Мне это не очень нравится, если честно.
А ещё в разделе «Мой PicMix» вы можете установить аватар для вашей учётной записи в качестве любой, из созданных вами Gif картинок, для этого сервиса.
Теперь вы сможете создавать потрясающие анимационные картинки в онлайн фоторедакторе PicMix и выкладывать их в социальных сетях.
А если вам не слишком то понятны скриншоты и объяснения в моей статье, то предлагаю посмотреть видеоурок