На главную

Библиотека Интернет Индустрии I2R.ru

Rambler's Top100

Малобюджетные сайты...

Продвижение веб-сайта...

Контент и авторское право...

Забобрить эту страницу! Забобрить! Блог Библиотека Сайтостроительства на toodoo
  Поиск:   
Рассылки для занятых...»
I2R » Сайтостроительство » Adobe Photoshop

Трюки и спецэффекты в PhotoShop 5.5 (часть 14 - "Завернутый уголок" руками)

Все новое это хорошо забытое старое. Пословица эта несомненна и вполне всеобъемлюща. Исключение не составляет и работа с Adobe PhotoShop. Особенно в следующем: подавляющее большинство дополнительных плагинов не приносят нам ничего нового, они просто упрощают процедуру создания эффектов. Как правило, от этого и рождается впечатление новых, неиспользованных возможностей — то, что мы раньше не могли сделать либо по незнанию, либо по недостаточной ровности рук, теперь лежит перед пользователями, как говаривал Великий Комбинатор, на блюдечке с голубой каемочкой. Я не спорю, что это удобно и со всех сторон положительно. Я даже не придерживаюсь мнения некоторых пользователей, которые считают, что использование дополнительных плагинов ухудшает способности пользователя (хотя такой момент, несомненно, есть — чутье теряется). Но я хочу сказать, что нет ничего, что невозможно сделать стандартными средствами Adobe PhotoShop. Хотя бы в том плане, что работаем мы с растровой графикой — и в крайнем случае можно нарисовать по точкам :). Большинство дополнительных модулей так или иначе используют возможности Adobe PhotoShop, как правило, обращаясь к его библиотекам. Некоторые вообще в принципе являются замаскированными экшенами (actions). Первая часть этой статьи как раз и будет посвящена доказательству всего вышесказанного.

Я уже несколько раз в этой серии касалась вопроса создания "загнутого уголка" в изображении. Но рассказывалось об этом только в свете дополнительных плагинов, а конкретно AV broth. Page curl и KPT 3.0. В принципе они, особенно первый, хорошо справились со своей задачей. Но мне читатели задают вполне резонный вопрос: а возможно ли реализовать этот эффект без всяких программ. Конечно, можно. Даже с тем же качеством. Но, конечно, не так быстро и просто, хотя это тоже не займет у вас много времени. Приведенный пример — самое простое, что можно сделать. Всякие навороты, вроде прозрачности, реализовать тоже не представляет труда, но чтобы сделать это реалистично, придется посидеть несколько дольше. Создание по описанию, которое идет ниже, займет несколько минут.

"Завернутый уголок" руками

Прежде всего, необходимо выбрать фотографию. Самый простой вариант — моно-цветная заливка. Однако, это имеет мало практического смысла, так как чаще всего редактируемые изображения реальные фотографии. Но, в принципе, можно работать с любым изображением. У меня на примере есть элемент, который облегчает задачу — он к низу переходит в моно-заливку. Но это совсем необязательно.

Сегодня впервые в этой серии мы коснемся инструментов серии "Перо". Люди, которые работают с векторной графикой, отлично знают этот инструмент — им рисуется почти все в Adobe Illustrator и Corel. Инструмент этот и в Photoshop я лично считаю незаменимым.

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

Для работы необходимо знание двух областей — разных перьев в основном меню и палитры "Пути". Если она у вас не открыта, то сделайте это. Начнем рассмотрение с перьев.
  1. "Перо". Выглядит как перьевая ручка. Основной инструмент в работе с путями и самый старый из всех. Пользоваться им несложно, но необходима некоторая практика. Для того чтобы вычертить прямую линию, просто щелкните по картинке первый раз в начале будущей линии, а второй — в конце. Если щелкнуть и не отпустить, то будут создаваться закругленные отрезки. Как именно они создаются, вы поймете сами, попробовав.
  2. "Магнитное перо". Действует примерно так же, как "Магнитное лассо". То есть, выделение будет производиться по цветовой грани. Этот инструмент применяется в том случае, если вы хотите, например, редактировать контур автомобиля.
  3. "Свободное перо". Очень полезный инструмент, особенно тогда, когда у вас есть дигитайзер или очень ровные руки. Примерно то же самое, что и "Лассо", но создает путь, а не выделение. Для тех, кто не помнит, что такое лассо, — этот инструмент создает выделение ровно так, как вы проводите курсором. Применяется, как правило, в сочетании со следующим инструментом.
  4. "Добавить опорную точку якоря". Мой любимый путевой инструмент. Позволяет добавлять точки и их редактировать — изменять положение и путь соответственно. Он понадобится нам сегодня.
  5. "Удалить опорную точку якоря". Удаляет точки на пути. Кроме того, при наведении на пустую область линии пути позволяет ее смещать.
  6. "Прямое выделение". Один из самых старых инструментов — был еще в третьей версии. Трансформирует имеющийся путь без изменения количества точек. Удобен именно в этом случае.
  7. "Преобразование точки". Этот инструмент преобразует любую точку в точку скругления. То есть, это идеальный инструмент для того, чтобы превратить прямую в кривую.
Рассмотрение инструментов закончено. Перейдем к панельке "Пути".

Как вы, наверное, уже обратили внимание, эта панель очень похожа на "слои". Во-первых, используя кнопку "Создать новый путь", можете иметь у себя на изображении не один, а необходимое их количество. Имеет значение и порядок их размещения. Также на этой панели есть:
  1. Заливка пути текущим цветом (черный кружок). Применяется при создании геометрических форм.
  2. Обведение пути текущим цветом (белый кружок).
  3. Преобразование пути в выделение (штриховой кружок). Очень полезный инструмент, на мой взгляд, наиболее часто применимый.
  4. Удалить путь.
Теперь, когда теоретическая часть закончена (я вообще стараюсь избегать описания инструментов в этой серии, но, как правило, пользователи не умеют применять пути), можно перейти непосредственно к созданию уголка.

Посмотрите на иллюстрацию. Под пунктом "1" отображен путь, который вам необходимо создать. Делается это проще простого. Для начала вам потребуется инструмент "перо". Первую точку закрепите в нижнем левом углу изображения, вторую — на правой стороне, на примерной высоте начала сворота, третью — в его вершине. В результате вы получите треугольник. Правую его сторону теперь необходимо закруглить так, как это показано на иллюстрации. Для этого стоит использовать инструмент "Добавить опорную точку якоря". Создайте точку в центре отрезка и вытяните внутрь. Результат должен быть похож на тот, который изображен на рис. 1. Затем преобразуем путь в выделение.

Теперь перейдем к следующему этапу работы. Нам необходим инструмент "градиент". Откройте его и при помощи панели "параметры" создайте новый градиент, похожий на тот, что изображен у нас на иллюстрации "2". Затем наложите его в виде "линейный градиент" на выделение. Не забудьте стереть тот угол изображения, который вы как бы загнули. Ну вот, почти вся работа сделана. Для пущего реализма можно применить к слою, на котором находится уголок, стандартный эффект "тень". Результат работы на иллюстрации 3.

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

Стоит отметить, что 3D трансформ не является единственным фильтром, позволяющим обрабатывать трехмерные объекты в PhotoShop. Еще до того, как компания Adobe изобрела данный инструмент, был создан другой, который назывался Series 2: 3D filter, выпущенный Andromeda ( www.andromeda.ru ), а также после него был создан еще целый ряд дополнительных фильтров с наиболее проработанным интерфейсом, предоставляющих множество новых возможностей.

Я хочу предложить вам убедиться на простом примере, что реализация трехмерных объектов в PhotoShop благодаря фильтру 3D transform превращается в довольно увлекательное и простое занятие.

Сперва несколько слов о данном фильтре. Находится он в разделе "Рендер". После того, как вы примените данный фильтр, откроется диалоговое окно, состоящее из области предварительного просмотра, палитры инструментов и области управления камерой.

Всего в данной программе существует 12 инструментов. Из них три простые формы: куб (М), сфера (N), цилиндр (C) (в скобках указаны клавиши, при помощи которых вы можете выбрать данный инструмент с клавиатуры). В PhotoShop 6.0 примитивов значительно больше.

Два инструмента редактирования: выделение (V) — черная и непосредственное выделение (А) — белая стрелочка. При помощи инструмента "Выделение" вы можете перетаскивать ваш объект по области предварительного просмотра, а при помощи "Непосредственного выделения" — редактировать его форму. Между данными инструментами можно переключаться при помощи сочетания клавиш Ctrl+Tab.

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

Далее идут два инструмента, которые и объясняют название данного фильтра, а именно 3D трансформ. Итак, это "Панорамная камера" (Е) — круг с четырьмя стрелками. При использовании данного инструмента вы как бы двигаете камеру, при помощи которой наблюдаете за объектом, т.е. если вы переместите изображение влево, то сможете получше увидеть его правый бок. Второй инструмент трекбол (R) — круг с одной стрелкой. При помощи данного инструмента вы вращаете объект в пространстве.

Оставшиеся инструменты рука (Н) и масштабирование (Z) работают аналогично таким же инструментам, находящимся в основной палитре PhotoShop.

После того, как вы вкратце ознакомились с данным фильтром и уловили принцип его работы, можно перейти к непосредственному созданию рисунка. Откройте новое изображение и напишите на нем что-нибудь, только ваша надпись должна быть не очень больших размеров, а то вам придется столкнуться с кое-какими трудностями в последующем. После написания текста вы можете его слегка подредактировать, нажав сочетание клавиш Ctrl+T. После того, как вы добьетесь желаемого результата, вам следует отрисовать слой с текстом, для этого сделайте следующее: щелкните правой клавишей мыши по данному слою и из раскрывшегося меню выберите "Рендеринг слоя".

Сейчас приступим к непосредственной работе с фильтром 3D. Для это проделайте операции: Фильтр — Рендер — 3D transform. В данной статье будет описан пример работы с наиболее простым объектом, а именно со сферой, однако вы можете выбрать и более сложные и интересные фигуры.

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

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

Создайте новый слой и назовите его "Сфера". На этом слое сделайте круглое выделение при помощи стандартного инструмента PhotoShop "Элиптическое выделение". Для того чтобы выделенная область имела форму круга, применяйте данный инструмент при нажатой клавише Shift. Расположите его так, чтобы оно совпадало с кругом, образованным фильтром 3D transform.

Затем создайте градиентную заливку от черного к белому цвету при помощи инструмента "Радиальный градиент". Светлая часть градиента должна располагаться ближе к центру, а черная — по периметру. Для того чтобы шар не заслонял надпись, поменяйте слой с текстом и слой с градиентом местами при помощи простого перетаскивания.

Сейчас возьмите инструмент "Ластик", небольшую кисть и на слое с текстом сотрите серые участки сферы, которые появились при применении фильтра 3D.

Теперь попытаемся создать эффект нависающего текста над шаром. Что для этого необходимо? Прежде всего, конечно, тень от букв. Для ее создания вы можете воспользоваться каким-либо дополнительным фильтром, а можете и эффектами слоя. Для этого сделайте активным слой с текстом и, проделав следующее: Слой — Эффекты — Отбросить тень, подберите настройки, подходящие к вашему изображению. Я использовала такие параметры: непрозрачность — 70 процентов, угол — 114 градусов, дистанция — 17 пикселей, размытие — 1, интенсивность 60%. Если не довольны получившейся тенью, то можете отменить действие либо слегка подредактировать ее, нажав сочетание клавиш Ctrl+T.

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

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

Для того чтобы осуществить первый пункт, вам необходимо сделать активным слой с текстом и еще раз воспользоваться эффектами слоя, а именно "Слой — Эффекты — Скосы и Рельеф". Здесь вы можете поэкспериментировать с настройками, однако ниже приведен пример тех параметров, которые были использованы при создании изображения представленного вашему вниманию. Блики: Mode — экран, непрозрачность — 100%; Тень: Mode — Умножить, прозрачность — 75%; Style — Inner Bevel, угол — 48, глубина — 14 пикселей, размытие — 15, направление — вверх.

После того, как работа над буквами завершена, следует разукрасить шар, наиболее простой способ сделать это — воспользоваться таким параметром, как "Цвет, Насыщение". Данная опция находится в раскрывающемся меню Изображение — Коррекция. Работая с данными настройками, не забудьте установить флажок возле указателя цвет.

Ну а напоследок, чтобы создать еще большую иллюзию объема, можете добавить тень от шара, аналогичным способом тому, как создавали тень от букв, только на этот раз активным должен быть слой "Сфера".

Галина Корабельникова
Компьютерная газета

Спонсор раздела

Рассылки Subscribe.ru:

Библиотека сайтостроительства - новости, статьи, обзоры
Дискуссионный лист для web-разработчиков
Подписка на MailList.Ru
Автор: NunDesign
Другие разделы
Оптимизация сайтов
Web-студии
» Новое в разделе
Web-дизайн
Web-программирование
Интернет-реклама
Раскрутка сайта
Web-графика
Flash
Adobe Photoshop
Рассылка
Инструменты вебмастера
Контент для сайта
HTML/DHTML
Управление web-проектами
CSS
I2R-Журналы
I2R Business
I2R Web Creation
I2R Computer
рассылки библиотеки +
И2Р Программы
Всё о Windows
Программирование
Софт
Мир Linux
Галерея Попова
Каталог I2R
Партнеры
Amicus Studio
NunDesign
Горящие путевки, идеи путешествийMegaTIS.Ru

2000-2008 г.   
Все авторские права соблюдены.
Rambler's Top100