Как сделать мигающий баннер?

3 ноября 2014 г. Просмотров: 626 Инструкции
Анимированный баннер – одно из основных средств продвижения интернет-рекламы. В большинстве случаев баннеры размещаются на сайтах сторонних компаний, при нажатии на них реализуется переход на рекламируемый ресурс. Изготовление простого мигающего баннера, состоящего из трех-четырех фреймов, занимает несколько минут.

Вам понадобится

  • - установить на свой компьютер программу Adobe Photoshop.

Инструкция

  • Создайте в Adobe Photoshop новый документ заданной ширины и высоты (File-New).
    Наиболее распространены баннеры, имеющие следующие размеры в пикселях: 468х60, 125х125, 120х90, 100х100, 120х60, 88х31. Установите в полях Width и Height значения 100. Откройте в Adobe Photoshop любую картинку, например, аватарку, и скопируйте ее изображение на ваш документ. Таким образом, первый кадр вашего баннера создан.
  • Нажав вместе клавиши Ctrl и J, создайте второй слой вашего документа. Включите отображение второго слоя и отключите отображение первого нажатием глазика напротив соответствующего слоя. Нажмите комбинацию клавиш Ctrl и L и, двигая ползунки, затемните второй слой.
  • Создайте из полученных двух кадров анимированную картинку. Для этого откройте анимационное окно (Window-Animation). В нем высветится полностью все ваше изображение, состоящее из двух кадров, которое будет совпадать с затемненным кадром. Установите для него время показа, например, 0,5 с. С помощью «глазика» выберите первый слой и отключите второй. Нажмите кнопку Duplicates selected frames на вкладке Animation (Frames). Второй кадр появится в анимационном окне. Выберите для него время показа 0,2 с.
  • Сохраните полученный файл в формате GIF (File-Save for Web and Devices…). Выберите необходимые значения из списка Preset для определения качества изображения. Учитывайте, что в режиме No Dither изображению придается мягкость в нечетких линиях.
  • Проверьте, как мигает ваш баннер при нажатии кнопки Play Animation. При необходимости перед сохранением анимационной картинки отрегулируйте время показа каждого кадра.
  • Оцените статью!