Как сделать баннер в фотошопе? Да еще и анимированный? Вопрос имеет право на жизнь. Хоть фотошоп вообще не сильно заточен под работу с анимацией, сделать простенький баннер будет не трудно.

Будем делать такой простой баннер:

Имеем два элемента – кусочек фона размером 468 на 60 пикселей, и логотип.

И фон, и логотип я рисовал в Кореле, в Фотошопе такое делать неудобно, поэтому здесь беру готовые. Да к тому же, их рисование будет не в тему здесь. 
Особенность анимации в фотошопе в том, что необходимо каждый кадр рисовать в отдельном слое. То есть, если мы сделали кадр, и начинаем после этого менять что-то в слое, который в этом кадре участвовал, то кадр изменится тоже. Поэтому, сколько кадров – столько слоев. В данном случае у меня получилось около тридцати. Но не пугайтесь раньше времени 🙂 На самом деле основных слоя только три. 
Итак, последовательность действий.

Готовим все слои. Сначала имеем только три слоя – слой с фоном, слой с логотипом и слой с текстом:

По сути мы уже получили статический баннер. Затем делаем штук десять копий слоя с логотипом, и столько копий слоя с текстом, сколько в нем букв:)

В каждом слое с логотипом применяем размытие в движении – в первом 10 пикселей, во втором – 20, и т.д. Слои, с которыми не работаем, для удобства делаем невидимыми.

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

Все кадры готовы. Если у нас версия CS3 или CS4, запускаем панель работы с анимацией. Проще всего делать это так:

Если это фотошоп младших версий – запускаем ImageReady.

Готовим кадр, то есть, делаем видимыми только нужные слои, и делаем снимок кадра:

После того, как сделали все кадры, выставляем нужную задержку.

Просматриваем, что получилось.

И сохраняем для web и устройств, поставив в настройках формат gif.

Вот и все.