Когда вы будете изготавливать свои фотореалистические рисунки, приготовтесь к тому что на них потребуется потратить значительно больше времени чем на обычные рисунки, но зато вам не нужно импровизировать, и придумывать, так же такой рисунок, можно будет распечатать на очень и очень большом формате и он будет выглядеть замечательно (в отличии от фотографии)

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

итак начнём. первое что нужно сделать создатть 4 дополнительных слоя, вам больше и не понадобиться.

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

Перед тем как действительно сделать что-нибудь, вам следует понять важность исходной фотографии. В действительности,
чем она больше тем лучше! почему это так важно, ну хотябы потому, что вы хотите получить высокодетализированную
векторную графику в конце, а для этого вам нужно разглядеть много деталей. Всё что вам нужно это чистый чёткий
снимок, высокого разрешения. начните хотя бы с фотографии в 1024х768 (не меньше)
в дополнениии, попытайтесь найти фотографию со студийным освещением. Тенями и подсветками которые чётко
просматриваются, картинка в целом что бы тоже чётко просматривалась. Более важная вешь, я думаю, отсутствие
какихнибудь странных отражений окружающей среды на снимке (можно конечно и с ними справиться, но для начала лучше их избегать).

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

красные линие указывают на основной рисунок. Или, другими словами, показывают область которая будет находиться на самом первом слое (ниже всех сотальных). Остальные тени и подсветки будут накладываться на него

эта часть основного освещения

пример теней, лежаших на третем слое. Они добавляются ко второму слою, и создают более сложную форму

и наконец, различные детали освещения. Всё что я не смогла охватить третим слоем, будет лежать здесь (на 4м). Это значит что четвёртый слой не так уж необходим, потому как освещение обычно не такое сложное, и второго с третим слоем будет достаточно для создание модели с различным освещением.

Только для пояснения. Здесь контуры всех слоёв. В конце, вы будете иметь что-то похожее.

основной слой:

слой с основными тенями и подсветками:

дополнительное освещение (создание смешанного освещения фотореалистического рисунка)

и вот добавочные незначительные детали

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

Первое что нужно сделать это создать контуры используя инструмент линии или карандаш (я предпочитаю первое). Сейчас контуры отделяют различные цвета друг от друга.

Я начинаю с наружи диска

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

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

Процес разукрашивания:
первое что я делаю, очищаю всё из панели цветовой палитры (color swatches) всё равно стандартные цвета мне больше не нужны, без них у моя цветовая палитра будет более упорядоченной.
Затем я начинаю собирать цвета с фотографии (как показанно ниже). и на пробу пытаюсь закрашивать этими цветами свой основной слой.

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

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

Прямо сейчас, градиент закрашивает в неправельном направлении и переход цвета не такое как я задумывала. Чтобы изменить это, мне нужно использовать инструмент трансформации градиента (gradient transform tool). Пожалуй не нужно объяснять что этот инструмент делает, его имя говорит само за себя. когда выбрав этот инструмент вы счёлкаете на градиенте, появляются две голубые линии - пока это линейный градиент - два регулятора. Кружок меняет направление градиента, а квадратик меняет ширину.

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

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

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

если у вас какието проблемы с нахождением контуров, я покажу как они выглядят у меня:

ещё одна деталь. Как вы успели заметить, в центральной часте диска есть эмблема Mercedes Benz и на ней кое какой текст, тоже. У вас есть два варианта что бы справиться с текстом: вы можете напичатать текст в ручную, разбить его на части (Modify - Break Apart или Ctrl + B), и выровнять его с текстом на фотографии и в конце просто применить градиентную или обычную заливку для каждой буквы, или вы можете также просто оконтурить их, и так далее как с остальной частью изображения. Я предпочитаю последнее. Это может занять немного больше времени и сил, но зато я могу быть уверенна что результат будет действительно близок к оригиналу.

В любом случае, это зависит от вас. Я знаю некоторые люди предпочитают просто напичатать текст и всё и они обычно получают хороший результат.

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

сложно описать как выглядит форма тени - и я думаю вы и сами можете её видеть.
давайте нарисуем контуры этой тени

выберите два цвета и сделайте линейную градиентную заливку контура.

или круговую градиентную заливку,значения не имеет всё равно на оригинал сильно походить не будет

Что мы делаем сейчас - отделим разные части тени. мне кажется что наша тень состоит из 3х частей.

В главной части два полу круга, идут от центра на право, и маленький элипс слева, указывающий на другую часть диска. Это значит, что мы должны расположить эти части на разных слоях
на втором слое, мы можем разместить основную форму (два полу круга) а на третий слой, положить маленький элипс указывающий наверх. Есть одна проблемка у нас уже есть основная часть расположенная на основном слое.
Нам восновном надо один цвет градиента и что в действительности не существует. мы можем просто взять цвет и закрасить им форму, но тк цвет должен плавно проявляться, закрашивая основной слой. И для этого во флэше есть одна отличная вешь для таких вещей - использование прозрачного градиента.
Так что измените контуры второго слоя. Мы можем на самом деле сделать их даже побольше. всё равно края будут не видимы.

выберите цвет и вернитесь к панели смешивания цветов (color mixer). Сделайте radial gradient c цветом которые вы выбрали.второй такойже цвет с установленной прозрачностью до 0%. обе части контуров залейте таким градиентом.

теперь трегулируйте градиент с помошью инструмента трансформации градиента (gradient transformation tool). у вас должно получиться что-то типа этого

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

Изложенное в предыдущей главе свидетельствует о том, что при работе с графическими объектами можно использовать Flash как обычный графический редактор типа MS Paint или Paint Shop Pro. Тем не менее, при описании возможностей по созданию и модификации изображений мы будем исходить из того, что они (изображения) рано или поздно должны стать элементами Flash-фильма .

Инструменты рисования

Рисование выполняется с помощью инструментов, расположенных на панели Tools.

Основными из них являются (рис. 5.1):

  • Line Tool (Линия) - инструмент позволяет рисовать прямые и ломаные линии, которые при необходимости могут использоваться в качестве контура объекта; инструмент не имеет кнопок-модификаторов; в качестве параметров настройки пользователь может выбирать толщину и цвет линии; настройка выполняется с помощью инспектора свойств;

Рис. 5.1. Инструменты рисования

  • Oval Tool (Овал) - инструмент предназначен для создания стандартных геометрических фигур: эллипсов и окружностей различного радиуса; созданная фигура состоит из двух компонентов, которые могут редактироваться отдельно друг от друга: контура (Outline) и заливки (Fill); в качестве параметров настройки пользователь может выбирать толщину и цвет линии; настройка выполняется с помощью инспектора свойств;
  • Rectangle Tool (Прямоугольник) - инструмент предназначен для создания соответствующих геометрических фигур; созданная фигура состоит из двух компонентов, которые могут редактироваться отдельно друг от друга: контура и заливки; в качестве дополнительного параметра можно указывать радиус скругления углов прямоугольника; кроме того, пользователь может выбирать толщину и цвет линии; указанные параметры устанавливаются с помощью инспектора свойств; установка параметров инструмента будет подробнее рассмотрена ниже;
  • Pen Tool (Перо) - инструмент позволяет рисовать прямые и сглаженные кривые линии с высокой точностью на основе механизма кривых Безье; для этого в процессе рисования Flash создает базовые точки (Anchor points) и затем строит по ним нарисованный сегмент; данный инструмент является, пожалуй, наиболее сложным в использовании, поэтому ниже мы рассмотрим работу с ним подробнее;
  • Pencil Tool (Карандаш) - инструмент предназначен для рисования произвольных линий, однако при соответствующей настройке параметров он выполняет «распознавание» нарисованных фигур и автоматическое их преобразование к стандартным геометрическим фигурам; параметры настройки инструмента будут рассмотрены ниже;
  • Brush Tool (Кисть) - инструмент позволяет рисовать линии, напоминающие мазки кистью; несмотря на относительную простоту использования, кисть имеет достаточно большое число дополнительных параметров, которые мы рассмотрим отдельно;
  • Eraser Tool (Ластик) - это обычная для графических редакторов «старательная резинка», по принципу действия и по набору дополнительных параметров она очень близка инструменту Brush Tool.

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

Теперь рассмотрим подробнее особенности применения некоторых инструментов.

Инструмент Rectangle Tool

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

Как было указано выше, допускается изменение следующих параметров работы инструмента Rectangle:

  • величина угла скругления прямоугольника; для изменения этого параметра следует щелкнуть кнопку-модификатор Round Rectangle Radius (Радиус скругления- прямоугольника), и в открывшемся диалоговом окне ввести величину скругления (в точках), как показано на рис. 5.2;
  • цвет контура и цвет заливки, которые выбираются с помощью соответствующих кнопок, расположенных на панели инспектора свойств инструмента (рис. 5.3);
  • толщина и стиль линии контура, которые также устанавливаются с помощью инспектора свойств; по умолчанию толщина контура изменяется с дискретностью 0.25 точки (points), но с клавиатуры может быть введено любое значение в диапазоне от 0 до 10;
  • дополнительный параметр Sharp Corners (Острые углы), задающий форму контура; изменение параметра выполняется в дополнительном диалоговом окне (рис. 5.4), которое открывается при щелчке на кнопке Custom... (Настройка); в этом окне также можно изменить толщину контура (с помощью раскрывающегося списка Thickness), значение в этом списке зависит, от значения, установленного в панели инспектора свойств, и наоборот.

Рис. 5.2. Диалоговое окно для установки величины скругления углов прямоугольника

Рис. 5.3. Инспектор свойств инструмента Rectangle

Рис. 5.4. Диалоговое окно для установки дополнительных параметров инструмента Rectangle

Формат инспектора свойств, приведенный на рис. 5.3, аналогичен используемому для инструментов Line и Oval.

После того, как с помощью одного из трех инструментов будет нарисована соответствующая фигура, для корректировки ее параметров может применяться расширенный формат инспектора свойств (рис. 5.5). От рассмотренного выше он отличается наличием четырех текстовых полей, которые содержат следующую информацию:

  • для линии - координаты левого (поля X и Y) и правого (поля W и Н) ее концов; координаты измеряются относительно верхнего левого угла стола фильма;
  • для круга - координаты центра (поля X и Y) и радиус (поля W и Н);
  • для прямоугольника - координаты верхнего левого угла (поля X и Y) и длины сторон (поля W и Н).

Рис. 5.5. Расширенный формат инспектора свойств для стандартных фигур

Инструмент Pen Tool

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

Чтобы нарисовать прямую линию, необходимо указать первую и последнюю точки отрезка. Точка создается щелчком на столе. Например, чтобы получить ломаную, состоящую из трех отрезков, требуется четыре точки (рис. 5.6 а).

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

Рис. 5.6. Ломаная, нарисованная инструментом Pen Tool

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

Чтобы нарисовать сегмент кривой, необходимо выполнить следующие действия:

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

Рис. 5.7. Рисование кривых с помощью пера

  1. При достижении требуемой формы сегмента отпустить кнопку мыши; касательная исчезнет, а базовые точки (первая и конечная точки сегмента) будут представлены маленькими окрашенными прямоугольничками.

Чтобы добавить еще один сегмент к созданному ранее, требуется повторить шаги 2, 3, 4 описанной выше процедуры.

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

Рис. 5.8. Добавление сегмента

После завершения рисования линии она может быть изменена с помощью любого из четырех инструментов: Pen, Arrow, Free Transform или Subselect.

Для инструмента Реп, как и для других инструментов рисования, пользователь может установить толщину и цвет линии, а также цвет заливки (Q работе с цветом будет рассказано в следующем разделе).

Установка толщины линии выполняется с помощью инспектора свойств, формат которого аналогичен приведенному на рис. 5.3. Если в момент включения инструмента панель инспектора свойств закрыта, следует войти в меню Window и выбрать в нем пункт Properties.

Установленные значения параметров применяются к вновь создаваемым линиям. Чтобы назначить их ранее созданным линиям и фигурам, они должны быть предварительно выбраны. Результат «проявляется» после того, как будет снято выделение.

Еще раз повторим, что эффективное применение инструмента Реп требует определенных практических навыков, тем не менее затраты времени на его освоение окупятся, как только вы захотите создать для оформления Web-страницы нечто нестандартное (рис. 5.9).

Рис. 5.9. «Росчерк» пера («Белеет парус одинокий...»)

Инструмент Pencil Tool

«Карандаш» имеется во многих графических редакторах, поэтому мы остановимся на отличительных особенностях его реализации во .

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

Рис. 5.10. Меню режимов работы Pencil Tool

Таких режимов три:

  • Straighten (Выпрямление);
  • Smooth (Сглаживание);
  • Ink (Рисунок чернилами).

Режим Straighten обеспечивает преобразование исходного изображения, нарисованного «вручную», в одну из геометрических фигур (рис. 5.11). Простейшим случаем такого преобразования является выпрямление линии, нарисованной, мягко говоря, не очень ровно.

Режим Smooth является менее «жестким» и позволяет просто избавиться от некоторых шероховатостей в рисунке.

Третий режим - Ink - практически не отличается от режима Smooth, но оказывает еще меньшее воздействие на исходное изображение.

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

Цвет и толщина линии настраиваются с помощью инспектора свойств инструмента (рис. 5.12).

Рис. 5.12. Инспектор свойств инструмента Pencil

Инструмент Brush Tool

Инструмент позволяет создавать линии, напоминающие мазки кистью. Для него предусмотрен целый ряд дополнительных специальных эффектов, включая эффект каллиграфического письма.

При создании изображений с помощью Кисти вы можете использовать в качестве заливки импортированное растровое изображение.

Для инструмента предусмотрено пять режимов работы. Выбор режима выполняется с помощью кнопки-модификатора (рис. 5.13):

Рис. 5.13. Меню режимов использования инструмента Brush Tool

  • Paint Normal (Обычное закрашивание) - «мазок» кисти покрывает все линии и заливки редактируемого изображения, а также любой другой объект или участок стола, оказавшиеся на пути кисти (рис. 5.14 б);
  • Paint Fills (Закрашивание заливок) - обеспечивает закрашивание заливок, не влияя на контуры, линии и пустую область стола (рис. 5.14 в);
  • Paint Behind (Закрашивание позади) - «мазок» кисти покрывает расположенную за изображением пустую область стола, оставляя все линии и заливки на редактируемом изображении без изменения (рис. 5.14 г);

Paint Selection (Закрашивание выбранной области) - «мазок» кисти влияет только на выбранную заливку (или заливки, если их выбрано несколько), оставляя без изменения линии, контуры, не выбранные заливки и пустую область стола (рис. 5.14 д);

Paint Inside (Закрашивание внутри) - закрашивается только та заливка, с которой операция была начата; другие заливки, линии, контуры и стол остаются без изменения (рис. 5.14 е); если вы начнете закрашивание в пустой области рабочего стола, то эффект будет аналогичен применению режима Paint Behind.

а) исходное изображение

б) режим Paint Normal

в) режим Paint Fills

г) режим Paint Behind

д) режим Paint Selection

е) режим Paint Inside

Рис. 5.14. Эффект применения различных режимов инструмента Brush Tool

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

Дополнительно пользователь может выбрать размер, форму, цвет кисти. Установка первых двух параметров выполняется с помощью кнопок-модификаторов (рис. 5.15, вверху), а выбор цвета - либо с помощью кнопки Fill Color панели Tools, либо с помощью инспектора свойств Кисти (рис. 5.15, внизу).

Рис. 5.15. Средства установки дополнительных параметров Кисти

Инструмент Eraser Tool

Инструмент действует подобно обычному ластику, удаляя линии, контуры и заливки.

Для инструмента предусмотрено шесть режимов работы. Выбор режима выполняется с помощью двух кнопок-модификаторов (рис. 5.16): Eraser Mode и Faucet.

Рис. 5.16. Меню режимов использования инструмента Eraser Tool

Кнопка Faucet (Кран) обеспечивает включение соответствующего режима, при использовании которого одним щелчком мыши удаляется («стирается») та часть объекта (контур или заливка), на которой установлен указатель в форме водопроводного крана; причем «горячей точкой» указателя является не сам кран, а капелька; это позволяет с достаточно высокой точностью позиционировать указатель при стирании тонких линий и контуров, и даже отдельных точек изображения.

Включение режима Faucet отменяет любой из пяти других режимов, выбираемых с помощью кнопки Eraser Mode, и наоборот, щелчок на этой кнопке отменяет режим Faucet.

С помощью кнопки Eraser Mode может быть установлен один из следующих режимов:

  • Erase Normal (Обычное стирание) - ластик удаляет все линии заливки редактируемого изображения, а также любой другой объект или фоновое изображение, расположенные в активном слое;
  • Erase Lines (Стирание линий) - ластик удаляет линии и контуры, оставляя заливки на редактируемом изображении без изменения;
  • Erase Selected Fills (Стирание выбранных заливок) - ластик удаляет только выбранную заливку (или заливки, если их выбра-

Рис. 5.17. Эффект применения различных режимов

но несколько), оставляя без изменения линии, контуры, не выбранные заливки и т. д. (рис. 5.17 г);

  • Erase Fills (Стирание заливок) - обеспечивает стирание заливок, не влияя на контуры, линии и пустую область стола;
  • Erase Inside (Стирание внутри) - стирается только та заливка, с которой операция была начата; другие заливки, линии, контуры и стол остаются без изменения; если вы начнете закрашивание в пустой области рабочего стола, то все объекты останутся без изменения.

При работе с Ластиком, как и при работе с Кистью, эффект установленного режима проявляется не во время выполнения операции, а после ее завершения (то есть когда кнопка мыши будет отпущена).

Дополнительно пользователь может выбрать форму и размер ластика.

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

Начнем. Запускайте Flash и приготовьтесь читать. Получайте удовольствие!

Импорт наброска

Перво-наперво, я импортирую свой набросок, сделанный с помощью Photoshop`а или карандаша со сканером. Для этого, надо выбрать пункт меню File -> Import и выбрать файл, содержащий набросок (Замечание: я как минимум дважды проверяю, что мой набросок как минимум в два раза больше того, что я хочу получить в итоге).

В результате, набросок находится на самом первом слое в ключевом кадре.

Теперь я конвертирую свой набросок в символ (прим. пер.: название объекта во Flash`е). Для этого нажимаю F8, ввожу требуемое имя и в качестве поведения задаю "graphic" (можно и другое, здесь это не принципиально, просто так мне больше нравится).

Теперь я щелкаю по наброску и с помощью панели "Effect" изменяю непрозрачность изображения (экземпляр символа "Rough"), чтобы его было легче обрабатывать (обычно ставлю 20%).

Настройка слоя

Теперь я изменяю тип слоя на "Guide". Для этого щелкаю на него правой клавишей мыши и в выпадающем списке выбираю "Guide". Благодаря этому, когда я буду формировать мое окончательное изображение (как.swf или в каком-нибудь растровом формате), сам набросок не будет обрабатываться и в итоге не отобразится.

Еще я блокирую слой, что бы случайно не нарисовать на нем.

Обводка (наложение чернил)

Теперь я создаю новый слой, на котором буду выполнять обводку с помощью кисти. Цвет выбираю черный и включаю чувствительность к нажатию (прим.пер.: это относится к графическим планшетам). Какую толщину установить выбирайте сами, лично я использую 4й или 5й снизу списка.

Итак, теперь я выполняю обводку черным, не обращая внимания на неаккуратные линии и т.д., но пытаюсь быть точным и аккуратным настолько, насколько это возможно.

Чистка проведенных линий

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

Затем я нажимаю на кнопку "Smooth" несколько раз (если настроить для этой операции горячую клавишу можно реально сэкономить время) и в результате грязные линии вычищаются.

Если вы не собираетесь печатать ваше изображение, не надо слишком усердствовать со сглаживанием линий, т.к. мы работаем с изображением, которое минимум в два раза больше окончательного, не так ли?

Закраска

Пришло время раскрашивать! Это и легко и просто. Я использую инструмент "Bucket" и заливаю области, ограниченные замкнутыми линиями.

Вы можете задаться вопросом, как заливать области, которые не замкнуты (подобно глазам на моей картинке). Я беру карандаш, включаю режим "Smooth" и, используя сильно контрастный цвет, рисую небольшие дуги, которые закрывают области так, чтобы я мог их заливать.

Теперь я заливаю полученные замкнутые области нужным цветом. Что бы избавиться от вспомогательных линий, используя инструмент "Arrow" дважды щелкните на любой части карандашной линии и нажмите "Delete".

Наложение теней

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

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

Когда вы уверены, что все линии, обозначающие тени перекрываются и соединены с контуром, можно начинать заливать требуемые области с помощью инструмента "Bucket" .

Теперь, что бы избавиться от вспомогательных линий, дважды щелкаем по ним нажимаем "Delete". В результате вы должны получить великолепные, ясные тени (двойной щелчок выберет все линии присоединенные к сегменту, по которому вы щелкнули).

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

Теперь вы готовы к тому, что бы вывести ваше изображение и греться в лучах славы. ;o)

Кисть

Первое - это заливка, то есть активный цвет кисти. Раскрыв его, можно обнаружить там панель Swatches с уже предустановленными цветами. В качестве цвета можно выбирать и градиент.

Далее идут две неактивные кнопки, их можно пропустить.
Кнопка Lock Fill позволяет заблокировать градиент, чтобы он растягивался на все рисуемые объекты. В обычном состоянии, градиент будет границами совпадать с шириной каждого объекта. Попробуйте порисовать, выбрав в качестве цвета, градиент и попробовать нажать эту кнопку.
Brush Mode - режим рисования кисти. Внутри этой кнопки есть несколько других, Смотрите ниже их описание.

Две последние кнопки служат для выбора формы и размера кисти. Так-же, прошу учесть, что размер кисти зависит от масштаба отображения.

В это же самое время, если посмотреть на панель Properties, там можно обнаружить кнопку выбора цвета и регулятор Smoothing, который отвечает за сглаживание линий при рисовании. Это же вектор, как-никак.

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

На панели Properties, на этот раз, побольше информации:

Теперь тут можно выбрать толщину линии, ее стиль, а так-же различные другие параметры.

Рисование фигур

Rectangle Tool - Обычный прямоугольник. После выбора этого инструмента и перед тем, как начать его рисовать, можно выбрать цвет заливки и обводки, а так-же дополнительные свойства на панели Properties. Из новых свойств я бы отметил возможность скругления углов, притом, для каждого угла можно назначить свое скругление. Попробуйте, это очень интересно. И как обычно, можно рисовать квадраты, с зажатой кнопкой Shift.

Oval Tool - Овалы и окружности. Здесь можно задавать дополнительные свойства, на панели Properties, такие, как начальный и конечный углы и внутренний радиус, что позволяет рисовать дуговые сегменты окружности. Это тоже стоит попробовать. Я сам узнал об этом только сейчас, когда начал про это писать и посмотрел на панель Properties:)

Rectangle Primitive Tool - Процедурный прямоугольный примитив. Отличается от обычного прямоугольника тем, что дополнительные свойства можно устанавливать и изменять потом, уже после того, как фигура нарисована.

Oval Primitive Tool - Процедурный овальный примитив. Тоже, возможна установка дополнительных свойств после его создания.

PolyStar Tool - Инструмент для рисования многоугольников или звезд. Имеет дополнительные свойства на панели Properties, при нажатии кнопки Options, открывается такое окно:

Тут можно выбрать тип объекта (polygon или star), количество углов и радиус их внутренних точек.

Нарисуйте прямоугольник с заливкой и обводкой, при невключенном режиме Object Drawing. Теперь щелкните на пустом месте рабочей области, чтобы снять выделение. Затем, поверх фигуры можно нарисовать окружность и тоже снять с нее выделение. Теперь возьмите инструмент выделения ("V ") и проведите рамку из пустой области, до середины всех объектов, получится примерно вот такое:

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

Чтобы такого не происходило, при создании объектов нужно включать режим Object Drawing. Тогда вы сможете редактировать объекты по отдельности и они не будут откусывать части друг друга. Еще можно рисовать различные части объекта в разных слоях. Этот способ возможен, как на основном таймлайне, так и внутри символов любых типов.

Чтобы выделить объект с заливкой и обводкой, щелкните на его заливке инструментом Selection Tool. Выделится заливка. если щелкнуть на обводке, выделится она, но не вся, а только сегмент между двумя точками. Чтобы выделить всю обводку, щелкните на ней два раза. Чтобы выделить весь объект целиком, обведите его рамкой, если это возможно. Если нет, щелкните два раза на заливке. Выделится вся фигура, вместе с заливкой и обводкой.

С основными свойствами текста легко разобраться самостоятельно, а цифрами отмечены пункты, которые требуют дополнительного объяснения. Итак:
1. Text type - Тип текстового блока. Их может быть три: Static - просто текст, Dynamic - используется, для динамического вывода текста из ActionScript и Input - используется для ввода текста пользователем. Для начала, мы будем пользоваться типом Static, далее, когда речь зайдет о программировании, я объясню, как работают остальные типы.
2. Letter Spacing - Межсимвольное расстояние в тексте.
3. URL Link - Ссылка, назначенная на текст. Если в этом поле написать что-нибудь, то текст станет активным и его можно использовать в качестве гиперссылки.
4. Selectable - Возможность выделять и копировать текст в готовом Flash-ролике.
5. Font rendering method - Несколько способов сглаживания текста, при экспорте во Flash-ролик.
6. Edit format options - Дополнительные свойства текста, применительно к параграфу.
Indent - Отступ первой строки.
Line spacing - Межстрочное расстояние.
Left margin - Левая граница параграфа.
Right margin - Правая граница параграфа.

7. Edit orientation of text - Меняет ориентацию текста между горизонтальной и вертикальной.

Пипетка
Копирует свойства объекта, в зависимости от того, откуда они забираются.

Настройка градиентов

В Adobe Flash CS3 существует два типа градиента: линейный и радиальный. Включение градиентной заливки и выбор ее типа осуществляется на панели Color. За это отвечает параметр Type. При выборе одного из режимов, на индикаторе цвета сразу появляется градиент.

На его краях можно увидеть две крайние точки. Щелкнув на одной из них, можно установить ее цвет. Также, параметром Alpha можно установить прозрачность. Для добавления точек, просто щелкайте в нужном месте, между крайними точками. Чтобы убрать дополнительную точку, потяните ее вниз.

Градиент можно назначать, как для заливки, так и для обводки объектов.

1. Треугольник - Центр градиента. Если сдвинуть его в сторону, центральная точка градиента изменит свое положение, однако сам градиент останется на месте. Это важно, когда нужно, чтобы края градиента совпадали с краями объекта.
1. Точка - Общий центр градиента. Если ее сдвинуть, градиент переместится вместе с границами.
2. Искажение градиента по горизонтали. Немного некорректная формулировка, так как, по вертикали он не искажается. Скорее подойдет определение "перспективное искажение".
3. Радиус градиента.
4. Вращение градиента.

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

Итак, общий обзор программы у нас есть, рисовать вы научились. Пора переходить к более важным вещам...

Все о рисовании во флеше и не только. Информация о том, как создается графика для флеш-игр, как нарисовать персонажа, как рисуются фоны для флеш-игр и мультиков, основы гейм-дизайна.

Рисование одежды во flash

Время от времени ко мне через сайт обращаются с просьбой подсказать что-то по рисованию или по анимации во флеше.

Я всегда стараюсь отвечать на вопросы, если, конечно, сама владею информацией.

Сегодня пришло письмо с просьбой написать урок по рисованию:

Цветовые ключи (Color keys). Поиск цветового решения

Чтобы ускорить процесс заливки, стоит использовать цветовые ключи. Тем, кто учился в художественной школе, наверняка знаком этот термин. Но не всем так повезло, среди художников и аниматоров много самоучек, как я, например:) На самом деле, цветовые ключи - это поиск цветового решения для персонажей, фонов и всего прочего. Просмотрев немало видео-уроков по рисованию, пришла к выводу, что многие заливают цветом интуитивно, подбирая цвета поочередно, наугад.

Как нарисовать волосы

Не так давно через сайт поступила просьба написать, как я рисовала волосы . Давненько не выкладывала уроков, и решила - а почему бы и нет, напишу пару строчек про волосы:) Я бы не называла это руководством к действию, как верно рисовать волосы. Что именно так они рисуются, и никак иначе. Просто коротко опишу сам процесс, как это делала я. Возможно, будет интересно не только одному человеку.

Техники и стили рисования во флеше

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

По характеру линий можно класифицировать:

1. Однородный контур – рисуется карандашом (Y), в итоге получаются линии одинаковой толщины. Чтобы рисунок не выглядел очень однообразно, можно использовать линии разной толщины, например, по краям толщину линии берем больше, а более мелкие детали (например, элементы одежды) прорисовываем линией потоньше. Такой контур очень удобен для быстрой заливки.