КомпьюАрт

7 - 2000

Fireworks 3*

Fireworks 3 в тесной интеграции с Dreamweaver 3 – грозное оружие, однако эта программа и сама по себе может помочь в выполнении множества различных задач – от оптимизации до анимации

Библиотека

Анимация

Поддержка Flash в Fireworks

Многоугольные фрагменты

Предварительный просмотр и оптимизация

Самое важное нововведение в Fireworks 3 – отнюдь не улучшенный интерфейс, предлагающий средства оптимизации рабочего процесса, которые можно применять по мере работы с документом. Это также и не система стилей со множеством готовых настроек, и даже не панель Library, позволяющая сохранять кнопки и объекты многократного использования. Принципиальным новшеством в Fireworks 3 является гораздо более тесная интеграция с Dreamweaver 3: изображения из Dreamweaver 3 можно редактировать и оптимизировать с помощью механизмов Fireworks 3, а поддержка сценариев на основе JavaScript означает, что работой одной программы можно управлять из другой.

Другие дополнения, например возможность создания своих макрокоманд для Fireworks 3 и панель History, появились и в Dreamweaver 3. Впрочем, хотя Fireworks и Dreamweaver образуют идеальную среду разработки для Web, не следует забывать, что программа Fireworks сама по себе является мощным средством для работы с графикой в области мультимедиа. Эта программа превосходно подходит для создания несложных печатных изображений, разработки мультимедийных интерфейсов, а теперь – и для анимации в формате Shockwave Flash. Ознакомившись с новыми возможностями Fireworks, вы увидите, что эта программа просто великолепна и без Dreamweaver.

Библиотека

Создание, редактирование и использование символов в Fireworks 3, работа с кнопками и экземплярами

  1. В Fireworks 3 представлен улучшенный метод создания и использования символов. Этот метод может повысить эффективность работы по созданию страниц – в частности, страниц, включающих многократно используемые объекты и анимацию.

  2. Есть два основных способа создания символов. Можно начать работу с существующего объекта, выделенных объектов или группы объектов в текущем документе, выбрав команду Insert>Convert to Symbol. Выбранный объект превращается в символ и появляется на панели Library (Библиотека).

  3. Чтобы создать новый символ «с нуля», выберите команду Insert>New Symbol. В появившемся диалоговом окне присвойте новому символу имя и выберите Graphics or Button. С помощью инструментов рисования редактора Symbol Editor создайте объект, который будет использоваться в качестве символа.

  4. После создания символа его можно использовать в документе нужное число раз, перетаскивая его копии из панели Library в текущий документ. Каждая копия называется «экземпляром». В нижнем левом углу выбранного экземпляра выводится небольшая стрелка, показывающая, что экземпляр выделен.

  5. Положение, угол поворота, масштаб и прозрачность экземпляра можно изменять без воздействия на другие экземпляры данного символа в документе. Однако такие параметры изображения, как контур или заполнение по умолчанию, изменять нельзя.

  6. Чтобы отредактировать символ, дважды щелкните на нем в панели Library или дважды щелкните на экземпляре на странице документа. Это приведет к запуску редактора Symbol Editor, в котором можно внести изменения в параметры изображения. Любые вносимые изменения отражаются во всех экземплярах символа, уже находящихся в документе.

  7. В Fireworks 3 кнопки являются специальным классом символов. Для автоматического добавления к библиотеке многократно используемой кнопки откройте документ и выберите команду Insert>New Button. Отредактируйте имя кнопки в библиотеке, чтобы отличать ее от других кнопок.

  8. С помощью инструментов рисования в появившемся редакторе Button Editor создайте изображение кнопки в состоянии Up (не нажата). Перейдите к вкладке Over и выберите команду Copy Up Graphic, чтобы вставить копию изображения со вкладки Up в окно Over. Внесите изменения в изображение, затем перейдите к вкладке Down и выберите команду Copy Over Graphic.

  9. Щелкните на вкладке Active Area. По умолчанию редактор Button Editor автоматически создает фрагмент размером с кнопку, так что лучше оставить функцию Set Active Area Automatically включенной. Выйдите из редактора Button Editor, чтобы вставить новую кнопку в документ. При перемещении кнопок в документе область фрагмента изменяется автоматически.

В начало

В начало

Анимация

Отличаются ли методы анимации в версии 3? Посмотрим...

  1. В методах анимации в Fireworks 3 не так уж много принципиальных изменений — создание промежуточных кадров и «луковой шелухи» появилось еще в Fireworks 2. Однако теперь улучшенная поддержка символов и оптимизированный интерфейс сделали этот процесс несколько более гладким.

  2. Создайте документ размером 480x60 пикселов. Чтобы создать в нем простую анимацию с движением, начните с создания нового символа, затем добавьте к документу два экземпляра данного символа из библиотеки. Поместите первый экземпляр в левой части документа, а второй — в правой части.

  3. Выделите оба экземпляра и выберите команду Modify>Symbols>Tween Instances. Сохраните количество этапов по умолчанию (10) и выберите параметр Distribute to Frames, чтобы для каждого этапа анимации автоматически были созданы отдельные кадры.

  4. В окне документа щелкните на вкладке Preview и нажмите кнопку Play, чтобы посмотреть на результаты анимации. Символ будет двигаться слева направо. Это связано с тем, что анимация с созданием промежуточных кадров в Fireworks всегда движется от нижних объектов к верхним. Правый экземпляр был помещен в документ последним, поэтому он находится поверх левого экземпляра.

  5. Этой особенностью можно воспользоваться для того, чтобы создать эффект постепенного появления и исчезновения. Продублируйте последний кадр текущей анимации 12 раз и воспользуйтесь инструментом Text, чтобы добавить на новом слое слово Text (полужирным шрифтом размером примерно 56 пунктов). Преобразуйте текст в символ (Insert>Convert to Symbol), затем перейдите к меню Edit и выберите команду Clone.

  6. Щелкните на свободном месте в документе, чтобы отменить выделение исходного текста, затем снова щелкните на тексте, чтобы выбрать дублированный текст (который, как можно увидеть, является просто вторым экземпляром текстового символа, расположенным поверх первого). На панели Object установите уровень прозрачности в 0 процентов. Затем выберите команду Modify>Arrange>Send to Back.

  7. Проведите мышью вокруг текста, чтобы выделить оба экземпляра, а затем выберите команду Modify>Symbols>Tween Instances, убедившись, что флажок Distribute in Frames установлен, а параметр Steps равен 10. Нажмите кнопку OK. Fireworks создаст кадры, необходимые для анимации данного перехода.

  8. Снова вернитесь к вкладке Preview и нажмите кнопку Play. Текст постепенно появляется, поскольку прозрачный экземпляр текстового символа был размещен снизу. Чтобы добиться исчезновения текста, необходимо сначала выбрать последний кадр анимации.

  9. Выберите экземпляр текста и продублируйте его, затем установите прозрачность продублированного текста в 0 процентов. Создайте анимацию точно так же, как до этого. Теперь текст должен исчезать в результате того, что анимация объектов происходит от нижних к верхним. Отсутствующий элемент «круга» можно добавить с помощью ниспадающего списка Frames.

В начало

В начало

Поддержка Flash в Fireworks

Огромным преимуществом Fireworks 3 является возможность экспорта в формат Shockwave Flash!

  1. Экспорт в формат Shockwave Flash позволяет создавать изображения и анимации, которые можно редактировать с помощью Flash 4. Анимационные фрагменты, экспортированные в формат Shockwave Flash, можно сразу же размещать в Web.

  2. При экспорте в формат Shockwave Flash можно воспользоваться различными установками в зависимости от того, будет ли файл редактироваться и далее, или же он будет сразу размещен на странице. Выберите Maintain Appearance, чтобы сохранить вид контуров и заполнений, затем выберите команду Text>Convert to Paths, чтобы сохранить настройки кернинга и трекинга.

  3. Выберите параметр Maintain Editability, если файл предполагается импортировать в Macromedia Flash. К сожалению, вне зависимости от выбранного параметра информация о фрагментах, активных областях, картах ссылок и поведениях будет потеряна при преобразовании.

В начало

В начало

Многоугольные фрагменты

С помощью инструмента Polygon Slice можно создавать пересекающиеся фрагменты необычной формы...

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

  2. С помощью инструмента Polygon Slice нарисуйте многоугольные фрагменты, соответствующие форме каждого объекта. Fireworks автоматически создаст нужное число прямоугольных фрагментов на основе нарисованных многоугольных фрагментов. В качестве альтернативы можно выделить объект и выбрать команду Insert>Hotspot, а затем Insert>Slice.

  3. Чтобы создать эффект смены изображения для каждого объекта, назначьте поведение Swap Image для каждого фрагмента с помощью панели Behaviours. При экспорте в файл Fireworks экспортирует нужное число фрагментов и установок, соответствующих внешнему виду сменяющегося изображения нестандартной формы.

В начало

В начало

Предварительный просмотр и оптимизация

Предварительный просмотр результатов работы сильно упростился...

  1. Предварительный просмотр результатов применения поведений и оптимизации стал гораздо проще и выполняется с помощью окна, содержащего различные вкладки. Вкладка Preview позволяет тестировать смену изображений и анимацию, а также проверять установки прозрачности и экспорта.

  2. Вкладки 2 up и 4 up позволяют просматривать до четырех наборов установок экспорта в одном окне документа, что дает возможность сравнивать качество, скорость загрузки и размеры файлов. Щелкните на панели, используемой для предварительного просмотра, и скорректируйте настройки оптимизации.

  3. На панели Optimization в основной программе находятся все установки, которые раньше располагались в диалоговом окне Export (и до сих пор присутствуют там, если выбрать команду File>Export Preview). Появилась и дополнительная установка Loss, позволяющая выбирать процент потерь для GIF-файла в целях уменьшения размера файлов.

КомпьюАрт 7'2000

Выбор номера:

Популярные статьи

Удаление эффекта красных глаз в Adobe Photoshop

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

Мировая реклама: правила хорошего тона. Вокруг цвета

В первой статье цикла «Мировая реклама: правила хорошего тона» речь шла об основных принципах композиционного построения рекламного сообщения. На сей раз хотелось бы затронуть не менее важный вопрос: использование цвета в рекламном производстве

CorelDRAW: размещение текста вдоль кривой

В этой статье приведены примеры размещения фигурного текста вдоль разомкнутой и замкнутой траектории. Рассмотрены возможные настройки его положения относительно кривой, а также рассказано, как отделить текст от траектории

Нормативные требования к этикеткам

Этикетка — это преимущественно печатная продукция, содержащая текстовую или графическую информацию и выполненная в виде наклейки или бирки на любой продукт производства