01.11.2010

Создаём анимированный баннер для Вашего сайта В фотошопе

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



 





 



 



 



Откроем исходник для баннера, его размер 468х60. Если у Вас нет таких исходников, то баннер, который используется в этом уроке, А вообще можно использовать любой прямоугольник необходимых Вам размеров, залитый какой-нибудь подходящей текстурой.



 





 



Выберем инструмент "Горизонтальный текст".



 





 



Напишем на нашем баннере любой текст, я выбрал подходящий для своего сайта.



 





 



Добавим к тексту стиль слоя. Для этого в палитре "Слои" нажмём на вторую слева иконку fx и выберем стиль "Тень".



 





 



Появится диалоговое окно "Стиль слоя", выберем примерно такие параметры, которые указаны на рисунке. А вообще, Вы вольны выбрать то, что Вам по вкусу.



 





 



Добавим обводку чёрным цветом шириной 1 пиксель. Нажмём "Да".



 





 



small;">Наш текст преобразился.



 





 



Отключим видимость слоя с текстом и добавим новый текстовый слой. Что-нибудь напишем.



 





 



Чтобы придать новому слою те же стили слоя, зажмём клавишу Alt и перетащим значок fx с первого текстового слоя на второй.



 





 



Наш верхний слой получил те же параметры стиля слоя, что и у первого текстового слоя.



 





 



Таким же образом создадим третий текстовый слой и придадим ему те же эффекты.



 





 



И наконец создадим последний слой с теми же стилями слоя.



 





 



Всего получилось четыре слоя с текстом.



 





 



Разблокируем наш основной слой "Задний план". Для этого левой кнопкой мыши два раза щёлкнем по нему. Появится окно "Новый слой", в котором ничего не меняем, а просто нажимаем "Да".



 





 



Простым перетаскиванием "Слоя 0" на вторую справа иконку создания нового слоя создадим три копии слоя "Слой 0".



 





 



Расположим эти слои так, что бы под каждым текстовым слоем находилась копия "Слоя 0".



 





 



Делаем активным верхний текстовый слой, нажимаем сочетание клавиш Ctrl+E. Тем самым, мы сливаем вместе верхний активный текстовый слой и расположенную под ним копию "Слоя 0".



 





 



Так же делаем со всеми слоями. В результате у нас останется всего четыре слоя. На этом подготовительная часть работы по созданию анимации закончена.



 





 



Открываем палитру "Анимация". Для этого выбираем "Окно - Анимация".



 





 



Мы увидим палитру "Анимация".



 





 



Нажмём на стрелочку, расположенную в верхнем правом углу палитры и в открывшемся списке выберем "Создать кадры из слоёв".



 





 



Так как, у нас четыре слоя, то в палитре "Анимация" появится четыре кадра.



 





 



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



 





 



Затем нажимаем на чёрную стрелочку под первым кадром и выбираем параметры показа анимации - будет показана один раз, всегда или можно выбрать необходимое количество раз. Я выбрал "Всегда".



 





 



Далее нажимаем на стандартную кнопку проигрывания анимации и смотрим что у нас получилось.



 





 



Сохранеяем нашу анимацию. Идём в "Файл - Сохранить для Web" или просто нажимаем Alt+Ctrl+Shift+S.



 





 



В появившемся окне ставим формат Gif, выбираем 256 цветов и нажимаем "Save" (сохранить).



 





 



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



 





 



Вот что у нас получилось.



 





 

Понравилось:
Категория: Counter-Strike Просмотров: 2180 Комментариев: 0
К публикации нет комментариев, но Вы можете стать первым, оставив свой комментарий!