Як зробити анімацію в фотошопі

Цей урок фотошоп навчить Вас робити просту анімацію для банера або шапки сайту.

Крок 1.
Створюємо новий документ розміром 198х198 пікселів. Далі робимо фон для картинки:


Новий документ з чорним фоном

Крок 2.
Ви можете використовувати якісь зображення або просто намалювати щось всередині рамки. Для простоти в цьому уроці ми використовуємо звичайний текст. Надрукуйте, що Вам хочеться:


Додаємо текст на картинку

Крок 3.
Далі відкриваємо закладку «Вікно / Анімація» (Windows / Animation). У Вас повинно з'явитися віконце анімації у вигляді спеціальної панелі або додаткового спливаючого віконця. Тепер натисніть на іконку, розташовану на панелі анімації (її розташування показано на картинці):


Розкрита панель анімації в фотошопі

Тепер перейдіть Налаштування документа і встановіть значення з 2 до 12 секунд, потім натисніть ОК.
Далі відкриваємо вкладку шару на панелі анімації поруч з картинкою, на якій Ви повинні побачити параметри: Позиція, Стиль і т.п.
Наведіть курсор на годинник в закладці Текст, Ви побачите жовте віконце на лінії, що вказує час. Наведіть курсор на позицію 8f і натисніть на діамантик, який з'явиться поруч зі стрілкою на панелі зліва. Він буде підсвічений, як тільки Ви натиснете на нього.
Тепер натисніть T (Інструмент Текст).
Далі знову переходимо до лінії, що вказує час, і натискаємо на діамантик зліва. Після цього Ви зможете розтягнути текст на зображенні. Ми використовуємо ефект Опуклість (Bulge effect) з параметром вигину +30. Натискаємо ОК.
У Вас повинна вийти ось така картинка:

Крок 4.
Тепер перемістимо курсор на лінії часу на позицію 01f після 1 секунди і знову натиснемо на діамантик. Знову вибираємо розтягнення тексту, як в попередньому кроці, але ставимо вигин -39.
Має вийти щось на зразок цього:


Стиснення тексту всередину (-39)

Крок 5.
Переміщаємо лінію часу на 3f і знову тиснемо на діамантик, розтягуємо текст і встановлюємо параметр вигину +17. Виходить така картинка:


Вигин тексту назовні (+17)

Крок 6.
Знову переміщаємо курсор на лінії часу на 5f і тиснемо діамант. Знову вибираємо розтягнення тексту, але тепер з параметром «Ні вигину».

Крок 7.
Тепер переміщаємо курсор в початок часового відрізку. Вибираємо закладку Файл / Зберегти для Web (Files / Save For Web And Devices), зберігаємо картинку як файл з розширенням gif. Кольори вибираєте, які хочете. Переконайтеся, що функція повтору обрана «Постійно» і зберігайте документ.
У підсумку уроку у Вас повинна вийти ось така картинка:


Готовий анімований банер