Некогда диковинка Flash сейчас одна из популярнейших технологий в интернете, применяемая для создания динамических изображений. Именно на основе flash-технологии создаются анимированные баннеры и динамические заставки на сайтах. Готовый к выполнению flash-файл имеет разрешение swf и выполняется специальным flash-проигрывателем (плеер). В браузер Internet Explorer такой flash-плеер встроен по умолчанию, для остальных браузеров вы можете скачать его с сайта www.macromedia.com.

Однако flash-технология сейчас используется не только на сайтах, с ее помощью создаются небольшие анимационные фильмы (например, "Масяня"), несложные игры. Родоначальником flash-технологии стала компания Macromedia, которая создала специальную программу Flash, в которой и производилась разработка одноименных приложений. Создание анимации в Flash является довольно трудоемким процессом, поэтому сначала поговорим о более простой программе Swish, в которой создание эффектов автоматизировано.

Swish

Скачать триальную версию программы можно с сайта www.swishzone.com. Мы не будем подробно останавливаться на всех возможностях данного продукта, а коснемся лишь самого основного - создания простейших визуальных эффектов. В Swish делается это довольно легко. Предположим, нам требуется создать ролик, в котором текст появляется сначала размытым, а затем постепенно обретает четкие очертания.

Следуем в меню File ("Файл") > New ("Новый"). В Swish откроется окно нового пустого ролика, в нем-то и будем воплощать задуманное. Поначалу требуется вставить текст, над которым мы будем производить всевозможные манипуляции. Для этого идем в меню Insert ("Вставка") > Text ("Текст"). На панели с временной шкалой появится еще один слой под названием Text, а в поле справа вы сможете редактировать надпись по своему усмотрению. Напишем там вместо стандартного Text что-нибудь свое, хотя бы: "Пример текстового эффекта". Готово, осталось только применить к этому тексту (если быть более точным - слою) какой-нибудь эффект из набора Swish. Узнать, чем нас побаловали разработчики программы, вы сможете, если нажмете кнопку Add Effect ("Добавить эффект"), только не забудьте перед этим сделать активным слой, к которому хотите применить эффект. После нажатия перед вами появится список доступных эффектов. Выберем, к примеру, эффект под названием Blur ("Размытие"). Сначала перед вами появится окошко с настройками параметров для данного эффекта, вы можете его закрыть, там самым оставив настройки по умолчанию (их потом можно редактировать, щелкнув по слою мышью и выбрав в меню пункт Properties ("Свойства"). После того, как вы закроете окно с настройками, на временной шкале в текстовом слое появятся дополнительные кадры, в которых формируется данный эффект. Можете просмотреть результат, отправившись в меню Control ("Управление") > Play Movie ("Проиграть клип").

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

Flash

А вот, собственно, и "старший брат", еще более функциональный и на порядок более сложный. Создавать эффекты в Flash приходится, что называется, "ручками", за счет чего, безусловно, увеличивается гибкость - простор полета творческой мысли не ограничен рамками предустановленного эффекта. Но платой за творческий полет является более высокая трудоемкость процесса (по сравнению с Swish).

Работа в Flash ведется покадрово, в идеальном случае анимация должна создаваться путем дорисовки/изменения следующего кадра, по сравнению с предыдущим (именно так художники рисовали первые мультики). Но это слишком медленно, поэтому в Flash введены инструменты, позволяющие автоматизировать создание простейшей анимации. Но прилагательное "простейшей" не должно вводить вас в заблуждение, в Flash можно создавать и сложную анимацию, только эта "сложность" будет состоять из комбинации "простейших" анимаций.

Приступим к созданию своего эффекта. Опыт будем проводить, как и в предыдущем случае, над текстом "Пример текстового эффекта". Чтобы создать надпись, на панели Tools ("Инструменты"), расположенной слева, нажмите кнопку А. Переведите курсор на основное рабочее поле и наберите текст (на панели внизу можно выбирать параметры шрифта, кегль и т.д.). Чтобы создать автоматическую анимацию, потребуется конвертировать введенный текст в символ. Щелкните по тексту правой кнопкой мыши и в ниспадающем меню выберите пункт Convert to Symbol ("Конвертировать в символ").

В небольшом окошке введите имя символа, остальные настройки оставьте неизменными. Текст, преобразованный в символ, нельзя редактировать.

Теперь понадобится создать второй ключевой кадр (первый создается автоматически). Для этого отсчитайте нужное количество кадров на временной шкале - к примеру, пятнадцать - щелкните правой кнопкой мыши, выберите пункт Insert Keyframe ("Вставить ключевой кадр"). Итак, у нас получается следующая ситуация: есть ключевой кадр под номером один и ключевой кадр под номером пятнадцать. В обоих ключевых кадрах содержится копия символа с надписью. Наша задача - изменить один из ключевых кадров, затем применить автоматическое создание анимации между двумя этими кадрами, в результате получится плавное изменение от одного ключевого кадра к другому. Продемонстрируем сказанное на практике.

Дмитрий БАРДИЯН,
x403@yandex.ru

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

Переходим на первый ключевой кадр. На панели слева нажимаем на кнопочку с изображением черной стрелки (Selection Tool). Щелкаем мышью по символу, в ниспадающем меню выбираем Free Transform ("Свободное преобразование") и изменяем (сжимаем) размер символа при помощи мыши. Осталось только щелкнуть правой кнопкой мыши на промежуточных кадрах и выбрать пункт Create Motion Tween. Появится стрелочка, ведущая от первого ключевого кадра ко второму, - это значит, что автоматическая анимация создана. Кстати, в нижней панели мы сможете более точно настроить параметры автоматической анимации или выбрать другой тип (менее распространенный) - Shape.

Просмотреть результаты наших экспериментов можно, откомпилировав ролик - нажав сочетание клавиш Ctrl+Ввод.

Если вы потом захотите использовать получившийся ролик, то удобнее будет сохранить исходный файл в заранее известном месте, а не рыскать по диску в его поисках. Для этого следуйте в File ("Файл") > Save As ("Сохранить как") и выбирайте нужный каталог. В нем разместятся два файла: один с расширением fla (исходный текст ролика), а другой с расширением swf (откомпилированный вариант, готовый к запуску). Между прочим, swf-файл появляется только после нажатия Ctrl+Ввод.

На этом наш краткий экскурс в flash-анимацию предлагаю считать законченным. Углубиться в премудрости работы с описанными программами вы сможете, либо занявшись изучением документации, либо прибегнув к наиболее симпатичному лично мне эмпирическому методу, который в шутку еще называют "методом математического тыка".

По моим наблюдениям, размер исходного swf-файла, созданного при помощи Flash, значительно меньше чем у Swish. Но это и понятно, простота разработки всегда сказывается на качестве конечного продукта. Поэтому большинство баннеров изготавливается средствами Flash, а не Swish.