Создаём банер
В отличие от большинства графических форматов, флеш дает дизайнерам возможность по-настоящему раскрыть свой потенциал и освободить креативность. Ни один статический баннер или даже анимированный покадровый Gif не имеет таких возможностей и гибкости, как флэш-баннеры. Закономерно, что для дизайна баннеров большинство разработчиков выбирают именно этот формат.
Сегодняшний урок, по сути - будет первым шагом к созданию баннеров Flash. Несмотря на всю свою простоту, он будет включать три важные аспекты, присущие без преувеличения каждому флеш баннера:
Создание основы (сцены, на которой будет разворачиваться все действие баннере)
Линкование (привязывание баннера к тому или иному сайту, на который он будет ссылаться)
Создание анимационного ряда (того, что увидит посетитель и что заставит его перейти по ссылке)
Создание основы: фон и поля
Создание основы - это, пожалуй, самый простой, и при этом - очень важный шаг при создании баннера. Прежде всего нужно определиться с его размерами. Я выбрал один из наиболее стандартных форматов: 468 x 60.
Второй шаг - это выбор фона. Здесь также все просто. Для баннера-примера я выбрал светло-голубой цвет. На самом деле, мне очень импонируют баннеры в светлых тонах. Вы можете выбрать любой другой цвет, который вам нравится.
Наконец - создание полей (рамок) вашего баннера. Этот шаг необязателен, если вы работаете с темным фоном (ибо в таком случае баннер довольно заметно выделяться на сцене).
Если же речь идет о светлых баннеры - ограничить их полями, чтобы они лучше выделялись и бросались в глаза. Я обычно использую цвет фона, но гораздо темнее. В некоторых случаях рамки не используются даже при светлом цвете фона - но здесь все уже зависит от идеи и воображения дизайнера.
Если с размером и фоном все понятно, то о создании рамок я расскажу немножко подробнее:
Создаем отдельный слой (layer), в котором будем рисовать только наши рамки (чтобы в будущем они не мешали нашей анимации. Этот слой должен находиться выше, чем основной.
Выберите инструмент четырехугольник Rectangle Tool в панели инструментов.
Выключите заливку, выбрав перечеркнутую красной линией иконку в таблице выборов цветов заливки
Теперь ваш инструмент будет рисовать четырехугольник, состоящий исключительно из контура (без заливки). Аккуратно рисуем четырехугольник, который точно повторяет форму нашего баннера (таким образом, чтобы контур ограничивал границы баннера.
Сохраняем файл и публикуем его (Shift F12 или пункт File -> Publish. В папке с сохраненным файлом должен появиться одноименный html-файл. Запускаем его - баннер должен отобразиться в браузере. Если все четыре рамки видно - все в порядке. Если какая из них отсутствует, значит вы не совсем точно нарисовали контуры четырехугольника - возвращаемся к шагу № 3.
Результат должен выйти примерно таким:
Создание ссылки на сайт
К сожалению, флэш не предусматривает создания ссылки непосредственно во время вставки баннера в сайт (т.е. методами html). Поэтому внедрять ссылку в баннер нужно во время разработки. В данном примере мы будем пользоваться методами Action Script 3.0 (поскольку эта версия скрипичной языка, бесспорно, имеет незаурядные перспективы и будет развиваться. Впрочем, если вас интересует создание ссылок в Action Script 2.0 - прочитайте статью Виталия о том, как делать баннеры кликабельны.
Эффективная раскрутка сайтов и качественное продвижение в поисковых системах поможет Вам привлечь максимальное количество клиентов и повысить рентабельность бизнеса.
Создаем еще один слой (layer) над теми двумя, что уже имеющиеся в шкале времени (timeline).
Выбираем инструмент четырехугольник (rectangle tool) и выключаем этот раз контуры (кликаем на иконку, перечеркнутую красным цветом в панели выбора цветов для контуров (stroke color).
Опять обводы полностью нашу сцену (цвет заливки не имеет значения, поскольку мы все-равно делать этот элемент прозрачным.
Конвертируем данную заливку на символ (подробнее о символах и их создание можно прочитать в одноименной статье), но при этом ОБЯЗАТЕЛЬНО выбираем тип символа Button.
После создания в эффектах цвета выбираем абсолютную прозрачность
В поле instance-name пишем название нашего символа (в моем случае url_to_site), которая затем будет использоваться для генерации кода ссылки
Активируем кадр, в котором размещена наша кнопка, и вставляем туда следующий код:
url_to_site.addEventListener (MouseEvent.CLICK, clickHandler.
function clickHandler (event: MouseEvent): void (
navigateToURL (new URLRequest ("http://адÑеÑа_ваÑого_ÑайÑÑ/ "),"_ blank");
В моем случае ссылка ведет на страницу «Уроки флеш» на этом сайте.
Сохраняем и публикуем баннер. Если вы все сделали правильно - то при запуске згенерованаго html-файла баннер будет активным и при клике переводить вас на нужный сайт.
| 
