Урок # 52. Как создать анимацию?


 

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

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

5

Как создать анимацию?

Для создания простой анимации потребуются картинки и программа adobe photoshop CS5. Можно и другими версиями пользоваться, только надо смотреть, чтоб там была функция «анимация».

От «чайника» до пользователя-эксперта — всего за 25 часов!

Сначала в интернете находим и скачиваем картинку, с помощью которой хотим создать анимацию.

Далее запускаем программу adobe photoshop. В этой программе открываем тот рисунок, на котором будем создавать анимацию.

как создать анимацию

Вы этот футбольный мячик видели в начале урока. Вот такую   анимацию с мячиком будем создавать.

Сначала разблокируем картинку, для редактирования.

Двойным щелчком мыши по слою картинки, открываем небольшое окошко в программе фотошоп и там даем название картинки.

Дальше добавляем текст на картинку. Для добавления текста, кликаем левой кнопкой мыши по букве «Т» в левой панели инструментов. Дальше ставим курсор мыши в левую верхнюю часть нашего рисунка и нажав левую кнопку мыши, тащим курсор в правую нижнюю часть рисунка, тем самым открывая поле для текста.

Я набрал текст про футбольный матч.

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

Дальше можно добавить еще один слой на картинку. Можно графический, можно текстовый. Я в примере показал текст с призывом к просмотру.

Сейчас добрались до важного момента урока — к созданию анимации. Делаем так. Кликаем по вкладке «Окно», в открывшемся меню выбираем функцию «Анимация».

На самом низу программы видим панель инструментов анимации картинки.

При открытии анимации выбираем функцию «создать кадры из слоев». Оставляем только две картинки на панели анимации. Лишнее убираем. Как указал на картинке.

Далее настраиваем время показа анимации. Я выставил по 1,5 секунды.

Когда настраиваем первую картинку, делаем так. Выделяем ту картину, на которой настроим первую анимацию. Оставляем только те слои открытыми, которые хотим настроить на картинке анимации.

как создать анимацию

Затем настраиваем анимацию на второй картинке. Выделяем вторую картинку. Не нужные слои закрываем, оставляем только те слои, которые нужно добавить на картинку настройки анимации.

После всех настроек проверяем анимацию, нажав кнопку «play» в нижней панели настройки анимации.

Проверили на работоспособность, нажали кнопку стоп. Дальше нужно сохранить анимацию.

Открываем вкладку «файл». Выбираем пункт «сохранить для web устройств»

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

Теперь проверяем нашу анимацию с помощью другой программы. Я обычно выбираю браузера для открывания. С помощью браузера открываем анимацию.

Видим, что у нас анимация работает.

Дальше закрываем все программы, которыми пользовались.

На этом все. На этом уроке я вам объяснил, как создать анимацию.

Еще один момент. Кликнув по анимационной картинке в начале урока, можете посмотреть футбольный матч, который был в 2013 году.

Узнайте здесь, почему вам нужно стать читателем этого блога?

Перейти на главную страницу

Понравилась статья? Получай обновления блога на e-mail:

Введите Ваш email адрес:

Вы можете пропустить чтение записи и оставить комментарий. Размещение ссылок запрещено.

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

Каждому оставившему комментарий, книга "Windows 7 и MS Office 2010. Компьютер для начинающих. Завтра на работу." в подарок!

самоучитель работы на компьютере

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