пятница, 20 февраля 2009 г.

Как создать анимированный баннер!

В этом уроке мы научимся легкому и самое главное быстрому созданию анимированного Gif баннера! Для начала создадим новый документ размером 468х60 пикселей. Затем выполним заливку подходящим цветом.
Теперь окрываем в фотошопе те картинки, которые будут присутствовать на баннере:
Берем инструмент "Прямоугольное лассо" и выделяем наших животных.
Выделенные изображения копируем (CTRL+C) и вставляем (CTRL+V) на наш баннер.
Уменьшить или увеличить размер наших изображений мы можем с помощью CTRL+T.

Далее отключаем все слои (убираем значок глаза) кроме заднего плана. Делаем его копию и пишем первую часть нашего текста:
Затем отключаем этот слой, и переходим опять на нижний слой «Задний план», дублируем его и набираем вторую часть нашего текста:
Далее делаем то же самое и с третьей частью текста:
Сейчас будем делать анимацию. Не будем пока переходить в ImageReady, в Photoshop тоже есть окно анимации и, открыв его, мы сможем всё отредактировать. Итак, идём в
Окно – Анимация (Window – Animation).

В открывшемся окне видим первый кадр, в окне слоёв погасим на слоях все глаза, оставим только на заднем плане – это будет первый кадр. Далее нажимаем на иконку – "новый кадр" в окне анимации и начинаем по очереди добавлять туда все наши слои. При добавлении слоя в окно анимации все слои кроме него должны быть погашены. Продолжая в том же духе набираем кадры.
Установим частоту смены кадра. Если нам нужна одинаковая частота на всех кадрах, то выделим все кадры, для этого выделим сначала первый кадр и, с нажатым Shift, щёлкаем на последнем кадре. Далее нажимаем на маленький треугольник внизу любого кадра и устанавливаем время в секундах.
Время установили, сейчас проверим нашу анимацию, нажимаем треугольник
Воспроизведение (Play).



Теперь, чтобы сохранить наш аватар, переходим в меню Файл и выбираем пункт -Сохранить для Web и устройств.

забронировать номер в гостинице Петербурга

6 комментариев:

  1. Спасибо огромное !!!! Очень доступно и главное полезно....

    ОтветитьУдалить
  2. да просто супер открыл фотошоп 1 раз а получось благодаря етому гайду СПС!

    ОтветитьУдалить
  3. Здраствуйте!!!
    Мне очень помог ваш урок,я сделал себе баннер на сайт сама анимация на компе пашет а когда поставил баннер на сайт то картинку не показывает а когда пытаешься прейти по банеру пишет что страницы не существует или сайт удалён!!!Что вы мне можете подсказать

    ОтветитьУдалить
  4. Здравствуйте!Для того,чтобы Ваша анимация была кликабельна(вела на указанный сайт),то ему необходимо задать соответствующий код для баннера,в котором будет содержаться адрес страницы.

    ОтветитьУдалить
  5. Можете оставить свою почту, и я вышлю Вам образец кода.

    ОтветитьУдалить

 

© Copyright 2009