В. Дронов - Macromedia Flash Professional 8. Графика и анимация

Если же нам нужно получить более подробные сведения о том, как будет загружаться фильм и где находятся его "узкие места", придется все-таки воспользоваться профилировщиком загрузки. Для вызова его на экран нужно включить пункт-выключатель Bandwidth Profiler меню View или нажать комбинацию клавиш <Ctrl>+<B>. После этого окно просмотра фильма будет разделено на две части: в нижней части будет воспроизводиться сам фильм, а в верхней появятся данные профилировщика загрузки.

С нижней частью окна просмотра все ясно. Давайте посмотрим на верхнюю часть (рис. 20.2). Видно, что она также разделена на две части: левую, с текстом, и правую, с диаграммой. Мы можем перемещать мышью разделяющую части толстую серую полосу и тем самым менять их размеры.

Текст, отображаемый в левой части, представляет различные сведения о фильме. А именно:

□ в разделе Movie:

Dim — геометрические размеры "картинки" фильма в пикселах;

Fr rate — частоту кадров фильма;

Size — размер файла Shockwave/Flash, в котором хранится фильм, в килобайтах и байтах;

Duration — продолжительность фильма в кадрах и секундах;

Preload — величину задержки, необходимой для загрузки файла фильма перед началом его воспроизведения, в кадрах и секундах;

□ в разделе Settings: Bandwidth — скорость загрузки фильма, выбранную нами ранее в подменю Download Settings меню View;

□ в разделе State: Frame — номер текущего кадра и (ниже) размер данных в килобайтах и байтах, необходимых для его отображения.

Если теперь включить пункт-выключатель Simulate Download меню View, запустив имитацию загрузки, то в разделе State появится строка Loaded, отображающая количество загруженных к данному моменту кадров и их размер в килобайтах и байтах.

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

Давайте посмотрим на нее (см. рис. 20.2). На горизонтальной оси этой диаграммы отложены номера кадров нашего фильма; в верхней части ее находится также временная шкала и бегунок, показывающий, какой кадр фильма в данный момент воспроизводится. На вертикальной же оси диаграммы отложены значения размера данных в байтах и килобайтах.

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

Одно из делений вертикальной оси выделено красным цветом. Оно показывает предельный объем, при превышении которого проигрыватель Flash не сможет загружать данные достаточно быстро и будет вынужден приостановить воспроизведение фильма до тех пор, пока остальные данные не будут загружены. Таким образом, мы легко сможем узнать, какой кадр "тормозит" наш фильм, и принять необходимые меры.

Если в меню View включить пункт-переключатель Frame by Frame Graph или нажать комбинацию клавиш <Ctrl>+<F>, вид диаграммы загрузки изменится. Серые столбики теперь будут показывать размер данных, относящихся к текущему кадру (рис. 20.4). Так мы сможем узнать, сколько данных нужно, чтобы воспроизвести тот или иной кадр.

Чтобы вернуться к предыдущему виду диаграммы загрузки (см. рис. 20.3), нужно включить пункт-переключатель Streaming Graph меню View или нажать комбинацию клавиш <Ctrl>+<G>.

Мы можем остановить воспроизведение фильма, нажав клавишу < Enter> или <Esc> или выбрав пункт Stop меню Control, и выделить нужный кадр, щелкнув мышью на соответствующей ему позиции временной шкалы профилировщика. Также можно щелкнуть на столбике, представляющем размер нужного кадра. После этого Flash выведет данные по выделенному нами кадру в левой части профилировщика загрузки.

Как оптимизировать фильм

А теперь настала пора поговорить собственно об оптимизации графики Flash. Этот разговор займет довольно много времени и будет вестись отдельно о векторной графике, отдельно об импортированной растровой графике и отдельно о звуке.

Нужно твердо запомнить одно простое правило: чем длиннее и сложнее фильм Flash, тем больше места он требует на диске, тем дольше он загружается и обрабатывается перед выводом на экран и тем медленнее выводится. Поэтому следует употребить все средства, чтобы он стал насколько возможно менее сложным и менее длинным. И делать это нужно еще до его публикации.

Прежде всего, для создания множества похожих элементов следует, по возможности, использовать образцы. Также, где только возможно, рекомендуется объединять фрагменты изображения в группы — это сильно облегчит работу с ними и позволит Flash удачнее их оптимизировать. Анимированные фрагменты лучше отделять от неподвижных, "разнося" их по разным слоям. И не стоит забывать о разделяемых образцах — они позволяют уменьшить размер файлов Shockwave/Flash.

Не следует использовать в изображении слишком много линий различных стилей (точечных, пунктирных и др.) — они занимают больше места в памяти, нежели сплошные линии. (Это относится как к обычным линиям, так и к контурам фигур.) Крайне желательно использовать лишь необходимый минимум мазков "кистью" — и они весьма охочи до памяти. Рекомендуется также выполнять оптимизацию кривых с помощью пункта Optimize подменю Shape меню Modify (см. главу 3); благодаря этому они станут проще, а значит, займут меньше памяти. Вообще, лучше не использовать без необходимости слишком сложные кривые.

При выборе цвета нужно стараться, чтобы он, по возможности, совпадал с одним из цветов безопасной палитры Web, а при необходимости — использовать минимум градиентных цветов — они требуют объема памяти примерно на 50 байтов больше, чем сплошные. И помните, что чрезмерное увлечение полупрозрачными фигурами может замедлить вывод изображения на экран.

При создании текстовых блоков желательно ограничить количество используемых шрифтов необходимым минимумом. Будет лучше, если мы ограничимся шрифтами-псевдонимами (см. главу 7). Если в фильме присутствуют поля ввода или динамические текстовые блоки, нужно ограничить набор символов, которые будут внедрены в результирующий файл Shockwave/ Flash. (Как мы уже знаем, Flash при экспорте внедряет в результирующий файл информацию обо всех использованных в изображении шрифтах, что может сильно увеличить размер этого файла.)

Везде, где это возможно, лучше использовать трансформационную анимацию вместо покадровой. Для создания анимации лучше пользоваться образцами-клипами, а не анимированными графическими образцами. При создании трансформационной анимации имеет смысл задавать минимальные изменения — слишком большие изменения увеличивают размер фильма и замедляют его проигрывание. По возможности стоит отказаться от анимации импортированной растровой графики, а для создания звукового сопровождения использовать импортированный звук в формате MP3 — он занимает меньший объем памяти.

И вообще, самый лучший способ сделать фильм меньше — сделать его проще. Будьте проще — и пользователи вас поймут!

При экспорте фильма Flash, содержащего импортированную растровую графику, Flash выполняет ее сжатие. Мы можем управлять параметрами сжатия графики, а именно, степенью сжатия и выбором используемого алгоритма. Давайте выясним, как это делается.

Прежде всего, нам нужно вывести на экран панель Library. После этого отыщем в списке образцов тот, что соответствует нужному растровому изображению, выделим его и выберем в контекстном или дополнительном меню пункт Properties. На экране появится диалоговое окно Bitmap Properties (рис. 20.5).

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

□ путь и имя изначального файла, из которого было импортировано это растровое изображение;

□ дата и время создания образца;

□ размеры изображения в пикселах и его цветность.

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