
- •Глава 1. Новые возможности Flash
- •Глава 1
- •Глава 2. Введение в технологию Flash
- •Глава 2
- •Глава 3. Основы работы с Flash mx
- •Глава 3
- •Глава 4. Работа с отдельными объектами
- •Глава 4
- •Глава 5. Рисование
- •Глава 5
- •Глава 6. Работа с цветом
- •Глава 6
- •Глава 8. Анимация
- •Глава 8
- •Глава 9. Слои
- •Глава 9
- •Глава 10. Создание и редактирование символов
- •Глава 10
- •Глава 12. Публикация фильма
- •Глава 12
- •Или еще один шаг в развитии Flash-технологии
Глава 12. Публикация фильма
Оптимизация и тестирование фильма
Установка параметров публикации
Публикация фильма в дополнительных форматах
Использование шаблонов
Конфигурирование Flash-сервера
Глава 12
Публикация фильма
Основным форматом Flash-фильма, который обеспечивает его просмотр с помощью Flash-плеера (либо автономно, либо через окно Web-броузера), является формат SWF. Это единственный формат, который поддерживает все интерактивные возможности фильма. Тем не менее, во многих случаях при размещении Flash-фильма на сервере SWF-файл должен быть дополнен и другими файлами. Прежде всего это файл HTML-документа, посредством которого производится загрузка SWF-файла в броузер: сначала в броузер загружается HTML-файл, содержащий вызов Flash-плеера, а тот, в свою очередь, уже открывает SWF-файл. Кроме того, необходимо предусмотреть ситуацию, когда у посетителей вашего файла отсутствует Flash-плеер. В этом случае полноценный фильм можно заменить последовательностью изображений в графических форматах, поддерживаемых броузером посетителя (например, JPEG, PNG или анимированным GIF).
Чтобы создать все файлы, необходимые для размещения фильма на Web-сервере, достаточно единственной команды Publish (Опубликовать), входящей в меню File. Она обеспечивает конвертирование исходного FLA-файла не только в формат SWF, но и в альтернативные графические форматы. Кроме того, с помощью этой команды генерируется и HTML-документ, предназначенный для запуска фильма с заданными параметрами.
Если вы достаточно хорошо знакомы с HTML, то предварительно можете скорректировать шаблон, на основе которого выполняется генерация HTML-документа. Для редактирования шаблона требуется использовать внешний (по отношению к Flash) HTML-редактор.
Если необходимо экспортировать FLA-файл в единственный файл определенного типа, целесообразно использовать команду Export (Экспорт), которая также входит в меню File.
Оптимизация и тестирование фильма
Для Flash-фильма, как и для любого другого Web-ресурса, является актуальной задача сокращения времени его загрузки броузером, а самый надежный способ ее решения — уменьшение размера SWF-файла.
В процессе экспорта фильма Flash выполняет некоторые операции, направленные на сокращение его размера. В частности, при наличии повторяющихся фигур Flash оставляет только одну копию; если в фильме присутствуют вложенные группы, Flash преобразует их в отдельные. Однако зачастую этого оказывается недостаточно для достижения требуемого результата. Поэтому перед публикацией фильма целесообразно вручную выполнить некоторые дополнительные преобразования элементов фильма.
Чтобы сократить размер фильма в целом:
все элементы, используемые в фильме более одного раза, пре-образуйте в символы соответствующего типа; например, повторяющиеся анимированные последовательности следует преобразовать в клип;
ограничьте изменяемую область в каждом ключевом кадре; сделайте так, чтобы действие происходило на минимальной площади стола;
избегайте анимирования растровых элементов; используйте растровые изображения только в качестве фона или статических элементов;
для представления звука применяйте формат МРЗ, где это возможно.
Чтобы минимизировать размер графических элементов и линий: D группируйте элементы, где это возможно;
помещайте элементы, которые изменяются в ходе анимации, в отдельные слои;
используйте возможности Flash по оптимизации числа кривых;
по возможности ограничивайте число специальных типов линий (штриховых, точечных и т. д.); имейте в виду, что линии, нарисованные с помощью инструмента Pencil, занимают в памяти меньше места, чем созданные с помощью инструмента Brush.
Чтобы минимизировать затраты на хранение текстовой информации:
ограничьте число используемых шрифтов и стилей; помните, что применение внедренных шрифтов увеличивает размер фильма;
при установке параметров внедренного шрифта включайте только те типы символов, которые действительно использованы в тексте.
Чтобы сократить объем памяти на хранение цветовой палитры:
используйте инспектор свойств для изменения цвета различных экземпляров одного символа;
используйте панель Color Mix, чтобы согласовать палитру фильма с палитрой броузера;
ограничьте применение градиентных заливок: такая заливка занимает приблизительно на 50 байт больше, чем однотонная заливка; прозрачные заливки также лучше использовать как можно реже, поскольку они могут замедлить воспроизведение фильма.
Чтобы выявить фрагменты фильма, которые замедляют его загрузку, вы можете протестировать его отдельные сцены или весь фильм, используя команды Test Scene или Test Movie. Если при загрузке SWF-файла требуемые данные не были получены к моменту перехода на следующий кадр, воспроизведение фильма приостанавливается.
В составе Flash имеется специальная утилита, которая позволяет получить в графическом виде профиль времени загрузки кадров фильма — Bandwidth Profiler (Профилировщик полосы частот). Чтобы получить с его помощью график загрузки фильма, необходимо выполнить следующие действия:
В меню Control выберите команду Test Scene или Test Movie; при этом Flash конвертирует фильм в SWF-файл, откроет его в окне плеера и начнет воспроизведение.
В окне плеера откройте меню Debug (Отладка) и выберите в нем предполагаемую скорость модемного соединения; возможны либо фиксированные значения (14.4, 28.8 и 56 Кб/с), либо устанавливаемые пользователем; чтобы установить собственные значения скорости соединения, следует выбрать пункт Customize (Настройка).
В меню Control окна плеера выберите команду Stop, чтобы приостановить воспроизведение фильма.
В меню View окна плеера выберите команду Bandwidth Profiler; при этом окно плеера окажется разделено по горизонтали на два подокна: в верхнем отображаются результаты профилирования, а в нижнем — содержание фильма (рис. 12.1); вы можете изменять размеры подокон, перемещая мышью полосу разделения.
Рис. 12.1. Формат окна плеера после выполнения команды Bandwidth Profiler
Оценка параметров загрузки фильма возможна в трех режимах:
Streaming Graph (Непрерывный график);
Show streaming (Показать процесс загрузки);
Frame by Frame Graph (Покадровый график).
В режиме Streaming Graph, который используется по умолчанию, окно профилировщика содержит следующие данные (рис. 12.2):
Рис. 12.2. Окно профилировщика времени загрузки фильма
параметры фильма (Movie) — размер окна, частота смены кадров, размер SWF-файла, длительность воспроизведения, длительность загрузки до начала воспроизведения;
условия тестирования (Settings) — выбранная вами скорость загрузки страниц сайта через модемное соединение;
текущее состояние загрузки (State) — номер последнего загруженного кадра, его размер, относительный (в процентах) и абсолютный (в байтах) размер загруженной части фильма.
В правой части окна представлена гистограмма распределения объема фильма по кадрам; для повышения наглядности цвет кадров чередуется. Линией красного цвета обозначен критический размер кадра: кадр большего размера вызывает задержку воспроизведения фильма.
Состав отображаемой информации и вид графика можно изменить с помощью следующих двух команд из меню View.
Show streaming — при выборе данного режима на шкале кадров отображается в реальном времени диаграмма загрузки кадров (рис. 12.3);
Frame by Frame Graph — в данном режиме на графике отображаются только те кадры, которые превышают критический уровень; как правило, такими кадрами являются ключевые кадры; данный режим является альтернативным режиму Streaming Graph.
Кроме того, щелкнув мышью на конкретном кадре в графической части окна, вы можете получить информацию о нем в текстовой части окна (см. рис. 12.3).
Рис. 12.3. Окно профилировщика при установке режимов Show streaming и Frame by Frame Graph
Если требуется протестировать ранее созданный SWF-файл, следует открыть его с помощью команды Open (Открыть), входящей в меню File.
Установка параметров публикации
При тестировании фильма, а также при публикации его с помощью команды Publish используются параметры публикации, установленные по умолчанию. Чтобы установить собственные значения этих параметров, следует воспользоваться командой Publish Settings (Параметры публикации) из меню File. Выбор данной команды приводит к открытию диалогового окна, с помощью которого и выполняются требуемые изменения.
В исходном состоянии окно содержит три вкладки (рис. 12.4):
Formats (Форматы) — данная вкладка предназначена для выбора форматов файлов, которые должны быть созданы при публикации фильма; дополнительно вы можете ввести собственное имя для каждого генерируемого файла, сняв флажок Use default names (Использовать имена, установленные по умолчанию); если необходимо, можно указать полный маршрут доступа к файлу, причем для каждого файла свой; при выборе одного из дополнительных форматов в окне Publish Settings создается соответствующая вкладка; если выбран какой-либо графический формат (GIF, JPEG, PNG), то в HTML автоматически будет добавлен соответствующий текст, обеспечивающий при отсутствии Flash-плеера замену фильма графикой;
Flash — данная вкладка обеспечивает установку параметров экспорта файла FLA в формат SWF;
HTML - элементы этой вкладки обеспечивают выбор некоторых дополнительных параметров размещения фильма на HTML-странице.
Рис. 12.4. Окно установки параметров публикации
Кнопка ОК обеспечивает сохранение установленных параметров без инициализации команды Publish; введенные значения будут использоваться по умолчанию для всех последующих публикаций.
Кнопка Publish, помимо сохранения установленных параметров, инициализирует выполнение команды Publish.
Вкладка Flash содержит следующие элементы (рис. 12.5):
Раскрывающийся список Version позволяет выбирать версию Flash-плеера, для которой должен быть сгенерирован SWF-файл;
Раскрывающийся список Load Order (Очередность загрузки), который позволяет выбрать очередность загрузки слоев первого кадра фильма: либо снизу вверх (Bottom up), либо сверху вниз (Top down);
Рис. 12.5. Вкладка Flash
Флажок Generate Size Report (Создать отчет о размере); если он установлен, то при публикации фильма создается отчет о размерах кадров фильма; отчет сохраняется в отдельном текстовом файле;
Флажок Omit Trace Actions (Отменить действие Trace); если он установлен, то Flash игнорирует действие Trace, которое используется при отладке сценариев на ActionScript;
Флажок Protect from Import (Защитить от импорта); установка флажка препятствует импорту SWF-файла из окна плеера (или броузера) в формат FLA; при установке флажка целесообразно также ввести в текстовом поле Password пароль, позволяющий (как бы) защитить ваш фильм от несанкционированного доступа;
Флажок Debugging Permitted (Разрешить отладку); установка флажка активизирует отладчик и разрешает удаленную отладку фильма (то есть после его размещения на Web-сервере); в этом случае вы можете ввести в расположенном ниже текстовом поле Password пароль, чтобы защитить фильм от несанкционированного доступа;
Флажок Compress Movie (Сжатие фильма), если установлен, указывает на необходимость включения алгоритма дополнительного сжатия фильма при его экспорте в формат SWF;
Ползунковый регулятор JPEG Quality (Качество JPEG-изображе-ния) и связанное с ним текстовое поле обеспечивают выбор приемлемого (на ваш взгляд) качества JPEG-изображений, используемых в фильме;
Кнопки Set (Установить) позволяют изменить параметры звукового сопровождения фильма;
Флажок Override Sound Settings (Изменять параметры звука), если установлен, разрешает индивидуальную установку параметров для отдельных элементов звукового сопровождения; это позволяет создавать две версии звукового сопровождения: лучшего качества (но большего размера) — для локального использования и более низкого качества — для публикации в Интернете.
Вкладка HTML содержит следующие элементы (рис. 12.6):
раскрывающийся список Template (Шаблон) позволяет выбрать тип шаблона, в соответствии с которым будет сгенерирован HTML-документ; список содержит следующие основные варианты (всего их более десятка):
Flash Only (Только Flash) - шаблон обеспечивает включение в HTML-документ только тех тэгов, которые необходимы для загрузки фильма (то есть тэгов <OBJECT> и <EMBED>); данный шаблон используется по умолчанию;
Flash with Named Anchor (Flash с именованными якорями) -шаблон обеспечивает включение в HTML-документ дополнительных гиперссылок, на основе которых может выполняться навигация между кадрами фильма;
Image Map (Сенсорная карта) — шаблон обеспечивает включение в HTML-документ тэга <IMG> с параметрами, позволяющими создавать клиентскую сенсорную карту; при выборе данного шаблона необходимо на вкладке Formats разрешить генерацию файла в одном из графических форматов;
Рис. 12.6. Вкладка HTML
Quit Time — шаблон позволяет включить в HTML-документ Flash-фильм в виде проектора в формате Quit Time;
раскрывающийся список Dimensions (Размеры) совместно с полями Width и Height позволяет выбрать способ измерения и размеры окна фильма (в данном случае более уместным было бы слово «экран»);
флажок Paused at Start (Пауза перед запуском); если он установлен, то фильм после загрузки не воспроизводится, пока пользователь не инициализирует воспроизведение сам; по умолчанию воспроизведение фильма начинается сразу после его загрузки;
флажок Loop (Цикл); если установлен, то воспроизведение фильма циклически повторяется, пока страница не будет закрыта;
флажок Display Menu (Показывать меню); установка флажка разрешает использование контекстного меню клипа, вызываемого щелчком правой кнопкой мыши;
флажок Device Font (Физический шрифт); его установка разрешает применение функции сглаживания (anti-aliasing) к шрифтам, не установленным на компьютере пользователя;
раскрывающийся список Window Mode (Режим окна) предназначен для выбора варианта представления содержимого фильма на Web-странице:
Window — Flash-плеер использует собственное прямоугольное окно, отображаемое внутри окна броузера; этот вариант обеспечивает наибольшую скорость воспроизведения;
Opaque Windowless (Непрозрачный, без окна) — фильм воспроизводится непосредственно на странице, «без экрана», при этом он может заслонять другие объекты страницы;
Transparent Windowless (Прозрачный, без окна) — вариант отличается от предыдущего тем, что через фильм «просвечивают» закрытые им другие элементы страницы.
Чтобы оценить установленные вами параметры публикации, целесообразно воспользоваться командой Publish Prewiev (Предварительный просмотр публикации), входящей в меню File. Данная команда по сути представляет собой заголовок каскадного меню, состав которого изменяется в зависимости от того, какие форматы публикации были установлены на вкладке Formats диалогового окна Publish Settings. Например, если помимо основных форматов (SWF и HTML) были выбраны графические форматы GIF и JPEG, меню будет выглядеть, как показано на рис. 12.7. Если вы выберите вариант GIF, то это приведет к загрузке в броузер фильма в формате GIF.
Рис. 12.7. Состав меню Publish Prewiev при использовании дополнительных форматов публикации фильма
Публикация фильма в дополнительных форматах
В предыдущем разделе было отмечено, что Flash обеспечивает возможность публикации фильма в одном из графических форматов, поддерживаемых HTML — GIF, JPEG и PNG. Такая возможность полезна в тех случаях, если вы не уверены, что потенциальные посетители вашего сайта располагают Flash-плеером, либо достаточно быстрым соединением с Интернетом.
Дня любого из указанных форматов вы можете указать требуемые параметры, которые на ваш взгляд в наибольшей степени соответствуют характеру изображения и предполагаемой аудитории. Дня этого необходимо:
Открыть диалоговое окно Publish Settings и перейти на вкладку Formats.
Поставить один или несколько флажков, соответствующих тем форматам, для которых вы хотите изменить параметры публикации; при этом окно Publish Settings будет дополнено новыми вкладками (рис. 12.8).
Рис. 12.8. Дополнительные вкладки для публикации фильма в графических форматах
Перейти на требуемую вкладку и установить параметры публикации.
В частности, для формата GIF на соответствующей вкладке могут быть заданы (рис. 12.9):
геометрические размеры изображения; они устанавливаются с помощью полей Width Height; если поставить флажок Match Movie, то будут использованы размеры стола фильма;
тип изображения (статическое или анимированное); выбор выполняется с помощью пары переключателей Playback; для ани-мированного GIF можно дополнительно определить цикличность воспроизведения:
переключатель Loop Continuously означает непрерывное воспроизведение;
переключатель Repeat связан с полем times, в котором вводится количество повторений;
Рис. 12.9. Вкладка GIF окна Publish Settings
уровень прозрачности изображения; выбирается из раскрывающегося списка Transparent;
цветовая палитра; выбор палитры производится с помощью раскрывающегося списка Palette Type; при выборе варианта Custom вы можете указать файл, содержащий используемую палитру.
На основе любого из графических форматов вы можете создать так называемую карту-изображение (или сенсорную карту) — Image Map. Сенсорные карты на Web-страницах достаточно хорошо зарекомендовали себя как удобное средство навигации по сайту. Для создания сенсорной карты требуется соответствующим образом настроить шаблон публикации.
Использование шаблонов
Шаблон представляет собой текстовый файл, который содержит «заготовку» для создания HTML-документа, обеспечивающего загрузку Flash-фильма в окно броузера. От обычного HTML-документа шаблон отличается тем, что в нем используется специальный заголовок и так называемые переменные шаблона. Переменная шаблона - это предопределенная последовательность символов, начинающаяся со знака доллара $, например, $LO.
При генерации HTML-документа Flash заменяет переменные шаблона значениями параметров, указанных в окне Publish Settings. Если вы достаточно хорошо знаете HTML, то можете открыть файл шаблона в текстовом редакторе (например, в Блокноте) или в HTML-редакторе и скорректировать его таким образом, чтобы получился требуемый HTML-документ. В частности, вы можете добавить в него сценарии на JavaScript или VBScript. Если в шаблоне не останется ни одной переменной, Flash вообще ничего не будет изменять в этом файле.
Все файлы шаблонов находятся в папке Flash MX\First Run\HTML и имеют расширение html.
На рис. 12.10 показан шаблон Default.html, открытый в редакторе Блокнот.
В таблице 12.1 приведены переменные шаблона для некоторых параметров публикации фильма.
Рис. 12.10. Пример шаблона
Таблица 12.1 Переменные шаблона для некоторых параметров публикации фильма
|
|
|
|
|
Параметр публикации |
Переменная шаблона |
|
|
Заголовок шаблона |
$ТТ |
|
|
Начало описания шаблона |
$DS |
|
|
Конец описания шаблона |
$DF |
|
|
Заголовок HTML-документа |
$TI |
|
|
Цвет фона HTML-документа |
$BG |
|
|
Ширина окна фильма |
$WI |
|
|
Высота окна фильма |
SHE |
|
|
Имя файла фильма (.swf) |
$MO |
|
|
Список URL фильма |
$MU |
|
|
Текст |
$MT |
|
|
Параметры для тэга <OBJECT> |
$PO |
|
|
Параметры для тэга <EMBED> |
$PE |
|
|
Ширина GIF-изображения |
SOW |
|
|
Высота GIF-изображения |
$GH |
|
|
Ширина JPEG-изображения |
$JW |
|
|
Высота JPEG-изображения |
$JH |
|
|
Режим окна |
$WM |
|
|
|
|
|
Из приведенных в таблице переменных шаблона дополнительного пояснения требуют две — $MU и $МТ.
Переменная $MU указывает Flash, что необходимо сформировать список URL, используемых в фильме, и поместить его в текст документа в виде комментария. Такой список может оказаться полезным при проверке корректности используемых URL.
Переменная $МТ указывает Flash, что требуется вставить весь текст из фильма в тело HTML-документа в виде комментария. Это позволит поисковым машинам проиндексировать содержимое фильма и в последующем использовать ключевые слова при поиске.
Конфигурирование Flash-сервера
Чтобы при обращении броузера посетителя Web-сервер мог правильно отработать запрос, он (сервер) должен уметь распознавать файлы Flash-фильма. Для этого необходимо добавить в конфигурационный файл сервера MIME-типы Flash-плеера и связать их с соответствующими расширениями файлов:
MIME-тип application/x-shockwave-flash — с расширением .swf;
MIME-тип application/futuresplash — с расширением .spl.
Если же вы не являетесь администратором своего Web-сервера, то лучше переложить ответственность за обеспечение работоспособности сервера на поставщика соответствующих услуг.
И еще одно достаточно важное дополнение.
При воспроизведении Flash-фильма в Web-броузере вы можете загружать данные в фильм только из файла, который находится на сервере в той же самой подобласти (в том же домене). Это предотвращает загрузку в фильм информации с других общедоступных серверов. Тем самым повышается защищенность посетителей вашего сайта.
Вообще Flash ориентируется на стандартный уровень защиты, обеспечиваемый возможностями броузера, протоколов HTTP и HTTPS. Поэтому при создании Web-страниц на основе Flash вы должны придерживаться тех же правил, что и при создании безопасных Web-сайтов на HTML.
Flash. Кривые Безье — основа основ
Сегодня мы поговорим о кривых, или, как их еще иначе называют, о путях. Эта тема была выбрана не случайно. Мы не раз уже обращали ваше внимание на то, что Flash — это программа, в большей степени работающая с векторными элементами, а пути являются основой практически любого вектора. Следует также отметить, что раньше мы рассматривали программы, предназначенные для обработки растровых изображений, такие как Adobe PhotoShop, Corel Photo-Paint, поэтому о векторах говорили лишь обзорно, но пришло время это исправить.
В
спомним
отличия между растровой и векторной
графиками. Растр — это массив элементарных
точек, пикселей, из которых составляется
изображение. Векторная графика основана
на математических формулах, описывающих
неровности контуров и способ заливки.
В PhotoShop, например, есть целая группа инструментов для работы с путями, основой которой является Pen. Подобные инструменты вы можете встретить в любом редакторе векторной графики и в большинстве хороших растровых программ.
Причина этому проста — во всех продуктах пути создаются и редактируются по одному принципу, так как в их основе лежит одно понятие — кривые Безье.
Создателем их еще в 68 году стал французский ученый, математик и инженер Пьер Безье. Тогда это все делалось для необходимости тяжелой промышленности. Пьеру была поставлена задача: научиться минимальными машинными ресурсами максимально просто и обобщенно описывать любые сложные плоскостные формы. Это нужно было для машин по обработке листового металла, которые вырезали из него необходимые детали.
Безье справился не просто хорошо, а гениально. Его система кривых, основанная на тригонометрических формулах, оказалась настолько простой и удачной, что легла в основу не только графических, но и многих других программ.
В компьютерной графике кривые Безье занимают чуть ли не главное место. Это не только основа векторной графики, но и способ описания шрифтов, универсальный способ передачи выделения. Научившись работать с ними в одной программе, вы не будете иметь никаких затруднений при работе с множеством других — повторимся, принцип везде одинаков.
Прежде, чем что-то изучать, нужно понять, какую функцию выполняет этот инструмент, средство.
Самая главная функция контуров, которая была и остается основной причиной их использования, — рисование различных геометрических фигур разной степени точности.
Согласитесь, создать правильные с точки зрения геометрии, ровные фигуры при помощи инструментов рисования не просто сложно, а фантастически сложно. Для этого нужно было бы обладать хорошими художественными способностями, серьезными навыками работы и профессиональными манипуляторами. Эти условия противоречат основной концепции практически любого графического редактора — в программе хорошие работы может делать человек, который руками рисовать совершенно не умеет.
А при помощи кривых создание сложных фигур сводится к очень простым и интуитивно понятным манипуляциям.
Кроме того, фигуры, нарисованные при помощи контуров, можно трансформировать и масштабировать без потери качества (в этом одно из главных достоинств векторной графики вообще).
Именно благодаря существованию контуров в растровой графике возможно качественное создание логотипов и тому подобных работ (хотя чаще все же используются специальные программы, предназначенные для работы с векторами).
Второе основное значение путей — выделение. Если обратиться вновь ко всеми уважаемой и любимой программе PhotoShop, то в ранних версия, например в 3, большая часть работы с выделением никак не могла обойтись без этого столь замечательного инструмента. С развитием программы появились и другие способы маскирования, однако пути не утратили своей актуальности и в данный момент, и иногда все же удобнее выделять при помощи инструментов группы Pen (Перо). Кроме того, контуры сохраняются во многих типах файлов, в отличие от чистого выделения и Альфа каналов. И при хранении размер файла от добавления в него контура почти не увеличивается, что нельзя сказать про другие способы выделения. Именно поэтому довольно часто в коммерческих библиотеках изображений, которые можно купить на CD носителях, изображения поставляются с обтравочными контурами.
Пути применяются и при создании множества эффектов, и для треппинга, и во множестве других случаев, перечислить которые просто не представляется возможным.
Рассмотрим несколько подробнее путь, из чего он состоит и как с ним работать.
Структура контура
Самое тяжелое в работе с контурами — научиться ими пользоваться сознательно. А это, наверное, наиболее тяжелый момент в изучении программы, если раньше вы не сталкивались с данным инструментом. Конечно, есть определенные правила, которые мы изложим чуть ниже, но все же успех в основном зависит не от этого.
В контурах, как нигде, нужно интуитивно чувствовать, к чему приведет то или иное изменение. А достигается это только одним способом — в ходе собственной практики.
Посмотрите на рисунок. На нем показана структура контура.
Как видно, контур состоит из четырех основных элементов: 1. Непосредственно кривая Безье. То, ради чего все и делается. Именно она называется контуром и является объектом нашей деятельности. Все остальные элементы служат только для того, чтобы придать кривой нужную форму. То есть, этот элемент можно назвать основополагающим, все остальные — вспомогательными. 2. Якорная точка (Anchor Point). Кривая Безье с двух сторон ограничена именно этими линиями, они во многом определят ее форму. В случае, если в контуре больше двух якорных точек, то, следовательно, он состоит из множества кривых Безье. Якорные точки можно передвигать относительно друг друга, настраивая вид пути. 3. Направляющая линия (Control Handle). Эта линия выходит из якорной точки. Она является касательной к кривой Безье. Для тех, кто не очень помнит математику, объясним — это значит, что эта линия касается прямой только в одной точке и что любые изменения, которые вы будете производить с направляющей линией, будут самым прямым образом отражаться и на кривой. Направляющих может быть одна или две. 4. Маркер. Именно так называется этот фрагмент, которым заканчивается направляющая линия. Служит маркер для одной цели — изменения длины и положения направляющих. С положением все ясно — уже было сказано, что это касательная к кривой Безье, поэтому, меняя положение, мы меняем ее форму. Такое же важное значение имеет и длина направляющих. Она определяет амплитуду кривой, или, если проще, — степень "выгнутости".
Таким образом, первый вывод относительно контуров — залог качественной работы с ними скрывается в умении пользоваться, прежде всего, направляющими.
Виды якорных точек
Во Flash существует два типа якорных точек. Разработчики назвали их Smooth (Гладкие) и Corner (Острые). Эта тонкость очень повышает удобство работы с контурами, но новичкам осваивать гораздо сложнее, чем если бы был один тип.
Сначала поговорим про более простые, гладкие якорные точки. Гладкий угол всегда имеет две направляющие с разных сторон. Они взаимосвязаны — при повороте одной на определенный градус точно так же поворачивается вторая. Лучше всего воспринимайте их как одну линию — это наиболее прямая аналогия.
При повороте направляющих линий кривая тоже как бы оборачивается. Внешний вид при этом зависит еще и от длины направляющих линий. Данный режим в основном используется для создания плавных, обтекаемых фигур.
Другой тип якорных точек — острые якорные точки. Они отличаются от гладких тем, что у них может быть три варианта наличия вспомогательных линий (в противовес гладким, у которых только один тип — две направляющие линии): 1. Вообще без вспомогательных линий. Да, такое возможно и предназначается для рисования, к примеру, треугольников и им подобных фигур. Работать с таким типом острых якорных точек проще всего. 2. Одна вспомогательная линия. Так как вспомогательные линии в этом режиме, в отличие от режима гладких якорных точек, не связаны, то объект можно трансформировать и при помощи одной линии. 3. Острая якорная точка с двумя направляющими. Наиболее сложный режим. Позволяет создавать действительно сложные формы, не обладающие симметрией.
Внимание
Одним из основных заблуждений начинающих пользователей является то, что они склонны считать пути частью изображения. Это совсем не так. Путь — это вспомогательный элемент, он не несет в себе графической информации в растровом смысле этого слова. Но когда путь создан, его можно или залить пикселями (в растре), или прорисовать линией, или превратить в выделение.
Еще раз повторимся, что, в принципе, при помощи контуров можно передать абсолютно любую форму — все зависит от навыков и таланта. У авторов был знакомый, который умел контурами имитировать подчерк (!) человека. Конечно, это уникальный случай, но про возможности инструментов говорит много.
Рассмотрим основные инструменты работы с путями, которые встречаются практически в каждом графическом редакторе.
Инструменты группы Pen и методы создания контуров при помощи них
Pen Tool (Перо)
Главный инструмент для работы с контурами. Нельзя сказать, что при помощи его выполняется больше работы, чем при помощи других. Дело не в этом. Просто Pen Tool обычно создает основу, путь, почти все другие — только редактируют его.
Есть два основных способа работы с Pen — создание прямоугольных, острых контуров и более сложных, плавных.
Начнем с более простого, с прямоугольных форм. Создайте новый документ. Запустите указанный инструмент. Кликните левой клавишей мыши. Появится первая якорная точка. Отведите курсор немного в сторону и снова кликните. Появится вторая якорная точка и тотчас соединится с первой кривой Безье.
Пользуясь точно такой же технологией и дальше, можно создать достаточно сложный контур.
Если же вы возвращаете курсор к точке начала создания контура, то он приобретает своеобразный вид, что значит, что при клике в эту точку контур будет закончен и превратится в так называемый замкнутый тип контура. Такой контур обладает рядом свойств, в частности, возможностью превращения в выделение.
Несколько сложнее обстоит дело с созданием плавных, обтекаемых форм.
Начинать нужно точно так же, как и при создании прямых узлов. Кликните, поставьте первую оперную точку. Отнесите курсор мыши на достаточное расстояние и снова кликните левой клавишей мыши для того, чтобы поставить вторую якорную точку. Но кнопку мыши после этого не отпускайте и начинайте передвигать курсор, при этом удерживая кнопку мыши.
Сразу появятся направляющие линии, и кривая начнет плавно изгибаться. Один маркер будет располагаться ровно под вашим курсором, то есть с этого момента вы редактируете вид кривой уже при помощи направляющих.
Далее можно преобразовывать полученную кривую, редактируя направляющие.
Примерно по такому же принципу создаются все, даже самые сложные контуры. Конечно, работу облегчают инструменты редактирования контуров, с которыми мы познакомимся чуть ниже, но основу вы уже знаете.
Freeform Pen Tool (Свободное перо)
По своему действию Freeform Pen очень похож на лассо, только создает не выделение, а контур.
Предназначен этот инструмент для создания абсолютно свободных по форме путей. Правда, действительно хорошо с Freeform Lasso работать только при наличии дигитайзера, мышью почти ничего толкового не сделать.
Пользоваться Свободным пером очень просто: зажимаете левую клавишу мыши и двигаете саму мышь. Вся траектория курсора до отпускания клавиши станет контуром.
Magnetic Pen
Этот инструмент встречается не во всех программах, но упомянуть все же стоит. Пользоваться им чрезвычайно просто. Вы кликаете левой клавишей мыши и ставите первую якорную точку. Дальше ведете вдоль объекта, вокруг которого необходимо создать путь, — и компьютер сам определяет, как располагать кривые.
Программа сама расставляет якорные точки в зависимости от перепадов яркости, то есть, сложности контура и своих собственных, определенных пользователем, параметров. Но и вы при создании пути этим способом можете определять места для якорных точек. Это необходимо в случае, когда перепад яркости в этом месте недостаточен для правильного определения программой нужного пути. Add Anchor
Point Tool (Добавить якорную точку)
Этот инструмент не умеет сам создавать пути, однако имеющиеся преобразовывает очень хорошо.
Рассмотрим это на примере. Создайте путь в виде прямоугольника.
Затем возьмите изучаемый инструмент. Кликните по одной стороне прямоугольника. Появится новая якорная точка. Вытяните ее в сторону. В результате одна сторона прямоугольника оказалась как бы раздута.
Точно таким же способом пофантазируйте с контуром и в других местах. Не забывайте о том, что можно настраивать длину направляющих линий и, как следствие, степень влияния перемещения якорной точки на кривую Безье.
Delete Anchor Point Tool (Удалить якорную точку)
Этот инструмент не столь впечатляющ, как предыдущие, и рассматривать его стоит лишь как очень редко полезное дополнение к Add Anchor Point. При помощи него можно удалять опорные точки из контуров. Это бывает полезно, если, например, какая-либо из них мешает правильной трансформации пути.
Convert Point Tool (Изменить якорную точку)
Относительно сложный в работе инструмент. Служит для редактирования пути через изменение свойств якорных точек и положения направляющих. Сформулируем основные принципы работы этого инструмента. 1. Клик по существующей якорной точке позволяет вытянуть из нее новые направляющие линии гладкого типа. 2. Если линии уже вытянуты, то манипуляции с маркером любой из них превращает якорную точку в острую. 3. Клик по якорной точке с выдвинутыми направляющими убирает их. При этом данный фрагмент пути приобретает "прямой" вид.
Основываясь на этих трех правилах, потренируйтесь немного — и вы научитесь вполне сносно обращаться с этим инструментом.
Здесь рассмотрены не все, но основные инструменты группы Pen (Перо), так как программ достаточно много и в каждой есть свои особенности, связанные с применением данных инструментов, свои дополнительные настройки, клавиатурные эквиваленты, поэтому мы посчитали, что наиболее важным является понять общий принцип работы с данными элементами.
Авторы: Галина Корабельникова, Юрий Гурский
Добро пожаловать в Macromedia Flash MX