Компьютерная графика

Уроки Photoshop
Уроки Photoshop В предыдущей главе вы познакомились с интерфейсом и инструментами редактора растровой графики Photoshop. Еще раз повторяем, что данная книга не является учебником по Phot
Текст «в горошек»
Текст «в горошек» Создаем новый документ. А потом создаем новый канал. В этом канале создаем квадратное выделение по центру. В результате первого этапа у нас должна получиться репродукц
Применим фильтр «Скручивание»

Применим фильтр «Скручивание». Установим значение параметра Angle, например, 336 К полученному изображению применяем другой фильтр: FilterPixelateCoIor Halftone. Та
В результате получили узор из
В результате получили узор из множества точек на голубом фоне В принципе, узор уже готов. Аналогичным способом можно создать и текст. Для этого на самом начальном этапе
Текст «в кирпичик»
Текст «в кирпичик» При оформлении Web-страниц нередко используют специфическую заливку текста небольшим рисунком (текстурой). Как это сделать? В новом документе создаем необходимый текст
На начальном этапе создаем текст используя крупный шрифт
На начальном этапе создаем текст, используя крупный шрифт Теперь открываем файл, содержащий собственно текстуру, которую будем применять в качестве заливки. Мы выбрали текс
Текстуру «каменная кладка» будем
Текстуру «каменная кладка» будем использовать для заливки букв текста Выделяем все изображение текстуры: SelectAlI (Ctrl+A). Выполнив команду Edit
Другой способ создания рамок

Другой способ создания рамок Описанный в предыдущем разделе способ обрамления подразумевает потерю части изображения, которая не попадает в рамку. А если рамка не сплошная, если в ней е
Эту фотографию мы собираемся поместить в очередную рамку
Эту фотографию мы собираемся поместить в очередную рамку Инструментом Rectangular Marquee («Прямоугольное выделение») (М) выделяем прямоугольную область на изображен
В палитре Channels создаем новый
В палитре Channels создаем новый канал, который будет содержать будущую рамку Активизируем этот канал, просто щелкнув на его миниатюре. Изображение на рабочем столе примет в
Заготовка для будущей рамки
Заготовка для будущей рамки Включаем RGB-канал, щелкнув на его миниатюре в палитре Channels (Каналы). При этом канал с рамкой также должен оставаться активным. Далее, ка
И еще одна рамка
И еще одна рамка Настоящий пример демонстрирует еще один способ создания стильных рамок для фотографий. На этот раз рамка будет создаваться с использованием режима редактирования быстро
Рамка с полупрозрачной шумовой

Рамка с полупрозрачной шумовой (штриховой) заливкой, обведенная внутри сплошной линией
Фотомонтаж
Фотомонтаж Фотомонтаж подразумевает последовательность некоторых действий над несколькими фотографическими изображениями, в результате которых получается принципиально новое изображение
Первое исходное изображение — из него «вырежем» девушку
Первое исходное изображение — из него «вырежем» девушку
Второе исходное фото послужит фоном
Второе исходное фото послужит фоном После того как картинки подобраны, необходимо окончательно уяснить, что у нас будет фоном, а что — изображением на этом самом фоне. В данном
Изображение девушки уже выделено контуром
Изображение девушки уже выделено контуром Теперь остается лишь скопировать сделанное выделение в буфер, а затем вставить его в нужное место на фоне. Надеюсь, вы знаете, как это

Окончательный результат — девушка помещена в пивной зал
Окончательный результат — девушка помещена в пивной зал
Реставрация старинных фотографий
Реставрация старинных фотографий В любом семейном фотоальбоме можно отыскать старинные снимки прадедушки или прабабушки. Время берет свое, а потому качество таких фотографий оставляет ж
Так выглядит фотография сделанная в г Осташков в 1920 году
Так выглядит фотография, сделанная в г. Осташков в 1920 году Настоящую фотографию предварительно следует отсканировать. "Несмотря на то что изображение черно-белое, ск
Левый нижний угол изображения
Левый нижний угол изображения до реставрации с использованием инструмента Clone Stamp

Левый нижний угол изображения
Левый нижний угол изображения после реставрации с использованием инструмента Clone Stamp Если в процессе работы произошла непредвиденная ошибка, не стоит сразу спешить восп
Это уже отреставрированная фотография
Это уже отреставрированная фотография — трещин и царапин практически не видно Применив этот фильтр, устанавливаем радиус размытия таким, чтобы на изображении стало не видно
Применяем фильтр Gaussian Blur
Применяем фильтр Gaussian Blur и размываем наше изображение до полного помутнения Вместе с недостатками пропадет резкость всего изображения. Но это не беда! Далее будем поль
Фрагмент изображения — вот так
Фрагмент изображения — вот так возвращается из небытия исходное изображение
Это изображение с размытым фоном смотрится уже подругому
Это изображение с размытым фоном - смотрится уже по-другому
Кстати, совершенно необязательно восстанавливать все изображение полностью. Можно восстановить только изобра
Имитация старинной фотографии
Имитация старинной фотографии На предыдущем уроке мы говорили о том, как отреставрировать старинную фотографию, удалить с нее лишние трещинки, пятна и т. д. Однако в дизайне иногда треб
Исходная фотография сделанная в наши дни
Исходная фотография, сделанная в наши дни Выполняем команду LayerNew Adjustment LayerHue/Saturation. Здесь нам предлагают ввести имя нового слоя, с которым будем работат
Окно New Layer создаем новый слой
Окно New Layer: создаем новый слой В окне Hue/Saturation сразу устанавливаем флажок Colorize, что обеспечит черно-белые тона изображения. Теперь выставляем значения парамет
В результате преобразований получаем чернобелое изображение
В результате преобразований получаем черно-белое изображение В результате преобразований мы получим черно-белое фото. Далее, в палитре Layers (Слои) активизируем слой с фот
Окно Levels уменьшаем контрастность изображения

Окно Levels: уменьшаем контрастность изображения В результате этих опытных преобразований мы получаем ту же картинку, но уже с низкой контрастностью, что-то в роде эффекта «сепи
В результате работы с кривыми
В результате работы с кривыми, добиваемся реальной мутности, низкой контрастности и яркости изображения Вновь активизируем слой с исходным изображением цветной фотографии.
Фильтр Film Grain добавит в изображение
Фильтр Film Grain добавит в изображение шум, имитирующий крупнозернистость старинных фотографий Далее объединяем слои командой LayerMerge Visible (Shift+Ctrl+
Обработка текста
Обработка текста Создание и обработка текстов в графическом редакторе весьма актуальны в Web-дизайне, а также при разработке рекламных буклетов, объявлений и т. п. Речь идет о создании
Эскиз с фотографии
Эскиз с фотографии Допустим, у нас есть какой-нибудь фотоснимок. Но нам требуется оформить Web-страницу стилизованными рисунками, а присутствие фотографий на ней нежелательно вообще. На
Исходный фотоснимок

Исходный фотоснимок Для такого опыта наиболее удачно подходят фотографии с размытым фоном и относительно крупными объектами переднего фона с ярко выраженными границами (конт
Еще один портрет акварелью
Еще один портрет акварелью Открываем документ, содержащий портретную фотографию. Теперь выделяем все изображение: SelectAll (Ctrl + A) и копируем это выделение в буфе
Темные оттенки нашего изображения еще более усугубятся
Темные оттенки нашего изображения еще более усугубятся Применяем фильтр FilterPixelateCrystallize с значением 10 параметра Cell Size. А потом выполняем команду
Фильтр Fade Crystallize преобразует
Фильтр Fade Crystallize преобразует изображение к мозаичному виду
Применяем фильтр Dry Brush
Применяем фильтр: Dry Brush
Применяем фильтр Fresco

Применяем фильтр: Fresco
Так будет выглядеть портрет в акварели
Так будет выглядеть портрет в акварели При желании здесь также можно использовать фильтр: FilterTextureTexturize, который придаст изображению эффект нанесения на холст.
Изображение с использованием эффекта нанесения на холст
Изображение с использованием эффекта нанесения на холст Приведенные ниже примеры использования редактора Photoshop также связаны с обработкой фотографических изображений и
Паззл
Паззл Эффект паззла позволяет сымитировать головоломку-мозаику, где все отдельные элементы имеют затейливые неровные формы и соединяются пазами. В осуществлении данного эффекта напрямую
Так выглядит содержимое файла
Так выглядит содержимое файла Puzzle.psd после его открытия а редакторе Photoshop Выделяем все изображение, используя команду SelectAll или комбинацию клавиш Ctrl
Интересные примеры

Интересные примеры Естественно, что редактор Photoshop не ограничивается только обработкой фотографических изображений. Здесь можно успешно рисовать собственные изображения, а также, пр
Использование фильтра имитации 3D
Использование фильтра имитации 3D Честно говоря, редактор Photoshop позволяет создавать только плоские рисунки. Однако в нем имеется фильтр, позволяющий создавать так называемые псевдот
Создание бочонка
Создание бочонка Как же сделать плоскую фигуру объемной? Для начала необходимо решить, какую фигуру мы собираемся создать. Затем выбираем подходящий фон, подойдя к этому этапу творческ
Исходный рисунок — плоский дощатый забор
Исходный рисунок — плоский дощатый забор В настоящем примере мы будем пытаться сделать деревянный бочонок. В качестве фона открываем файл, содержащий полотно из досок. Конеч
уем черные линии — заготовки для колец бочонка
уем черные линии — заготовки для колец бочонка Эти линии наносятся с помощью инструмента «Кисть» (Brush) при нажатой клавише Shift (чтобы линии были прямыми). Теп
В настройках фильтра 3D Transform выбираем группу цилиндров

В настройках фильтра 3D Transform выбираем группу цилиндров Так как мы собрались делать бочонок, выбираем инструмент Cylinder («Цилиндр»). Его можно активизировать прос
Контур цилиндра планируем по центру фона
Контур цилиндра планируем по центру фона Модернизацию фигуры осуществляем инструментом Direct Selection (A) — это белая стрелка в самом верху палитры инструментов в
Придаем цилиндру форму бочонка
Придаем цилиндру форму бочонка Используя другую, черную стрелку (Selection), можно передвинуть всю фигуру в нужное место. Ориентируем контуры будущего бочонка так, чтобы че
Для сохранения результата на прозрачном
Для сохранения результата на прозрачном фоне, в окне Options необходимо снять флажок Display Background После некоторой доработки изображения мы получаем вполне правдоподобный
Готовый бочонок
Готовый бочонок С помощью данного фильтра можно делать и другие, весьма абстрактные фигуры или комбинации фигур. Создание планеты В предыдущем примере мы рассмотрели дово
Одно из простейших применений фильтра ЗDшар

Одно из простейших применений фильтра ЗD-шар Далее, создадим обруч, опоясывающий наш шар. Для этого используем инструмент Cylinder (Цилиндр) фильтра. Но высоту цилиндра
А вот что получается при совместном
А вот что получается при совместном использовании нескольких элементов, полученных при помощи фильтра 3D Вот и готово! Все дальнейшие операции совсем необязательны, но они прид
То же самое изображение но после
То же самое изображение, но после дополнительного применения фильтра FilterRenderDifference Clouds
Продолжение эксперимента — ко
Продолжение эксперимента — ко всему уже созданному мы применили фильтр HlterRenderLans Flare. Он создает солнечный блик
Применен фильтр FttterRenderLightmg
Применен фильтр FttterRenderLightmg Effects. Сего помощью можно сделать еще и не такую подсветку!
А это мы сделали применив ко всему

А это мы сделали, применив ко всему прочему еще и фильтр FilterBrush StrokesAccented Edges
Пулевое отверстие
Пулевое отверстие На нашем очередном уроке речь пойдет о специфическом эффекте оформления. Он действительно довольно уникален, но применять его можно довольно разнообразно, была бы фант
В принципе — это уже готовое отверстие
В принципе — это уже готовое отверстие, но не помешало бы придать больше реализма В принципе, мы уже получили требуемое отверстие. Оно даже рваное. Однако не хватает еще ре
На последнем этапе создаем видимость
На последнем этапе создаем видимость того, что отверстие является входным Вот, в общем-то, и все. Отверстие готово! Для того чтобы это действительно было пулевое отверстие,
Штрихкод
Штрих-код Штрих-код — сугубо технический товарный символ-код, в котором зашифрована вся полезная и полная информация о продаваемом товаре. Цифрами и полосками здесь кодируется информаци
Просто зашумляем все рабочее поле

Просто зашумляем все рабочее поле документа, используя окно Add Noise (Добавим шум) Теперь применим фильтр FiIterBlurMotion Blur. Значение параметра Angle устанавли
Фильтр Motion Blur с значением
Фильтр Motion Blur с значением Angle=90 позволяет «растянуть» шум сверху вниз После выполнения этих установок вы получите нечто, напоминающее штрих-код — но это еще только
Диалоговое окно Curves Изменяя
Диалоговое окно Curves. Изменяя вид кривой, можно изменить и вид штрих-кода Поработайте с кривой самостоятельно — вы можете изменить вид штриха. Однако его внешний вид во м
Готовый штрихкод
Готовый штрих-код Теперь полученное изображение можно применять как элемент оформления для вашего дизайна.
Эффект молнии
Эффект молнии Изображение молнии, электрического разряда или звезды — излюбленные эффекты многих дизайнеров. Поэтому мы никак не могли обойти эту тему. Создаем новый небольшой (400x200 п
Размытие градиента получается

Размытие градиента получается в результате применения команды Difference Clouds Инвертируем полученное изображение, используя команду ImageAdjustInvert (CtrlFmd Edges, что придаст прямоугольнику темную окантовку Применяем фильтр FilterBlurMotion Blur с значениями параметров: Ang
Параметр Distance устанавливает глубину тени
Параметр Distance устанавливает глубину тени Разукрашиваем изображение, используя команду ImageAdjustHue/Saturation. Однако первоначальный цвет делаем спокойным: не ярк
Выпуклую область кнопки немного
Выпуклую область кнопки немного высветляем, используя для этого кривые Таким образом, мы получили светлый прямоугольник, вписанный в более темную рамку.
Еще одна кнопка
Еще одна кнопка Есть еще один, принципиально отличающийся от рассмотренного выше, способ создания прямоугольных кнопок. Итак, создаем новый документ небольшого размера (в з
Создаем новый документ в зависимости
Создаем новый документ, в зависимости от габаритов будущей кнопки На палитре инструментов выбираем инструмент Rectangular Marquee (Прямоугольное выделение) (М). Для
Значение радиуса округляем примерно в 10 пикселов

Значение радиуса округляем примерно в 10 пикселов Таким образом, мы получили прямоугольник с закругленными углами. Теперь заливаем выделение нужным цветом (у нас — красным).
В заключение набираем и центрируем нужный текст
В заключение набираем и центрируем нужный текст Для того чтобы применить кнопку на Web-странице с прозрачным фоном, сохраняем изображение в файле GIF-формата (команда FiIeSa
Заливаем квадратик градиентом
Заливаем квадратик градиентом из левого нижнего в правый верхний угол Выполняем команду SelectionModifyContract. Устанавливаем значение параметра Contract — 4 п
Подгоняем клавишами управления
Подгоняем клавишами управления курсором необходимый объем кнопки Снимаем уже не нужное выделение: SelectDeselect. Выделяем всю кнопку целиком. Удерживая комбинацию клав
Путем копирования маленького фрагмента
Путем копирования маленького фрагмента увеличиваем кнопку до нужного размера В результате мы получили колонку из нескольких (в нашем примере из семи) кнопок будущего меню.
Составляем колонку из необходимого

Составляем колонку из необходимого числа кнопок — это основа будущего меню. Создаем новый слой, щелкнув на значке
Выделенную овальную область заливаем
Выделенную овальную область заливаем вертикальным серым градиентом так, чтобы более темный цвет был ближе к кнопкам Заливаем выделенную область вертикальным серым градиентом та
Выделяем область образованной фигуры а лишнее — удаляем
Выделяем область образованной фигуры, а лишнее — удаляем Создаем новый слой. На верхней кнопке делаем прямоугольное выделение так, чтобы до границ кнопки оставалось немного
Для большего эффекта по углам
Для большего эффекта по углам кнопок расставляем черные точки — «винтики» Используя команду ImageAdjustHue/Saturation (Ctrl+U), изменяем цвет заливк
На заключительном этапе вписываем необходимые пункты меню
На заключительном этапе вписываем необходимые пункты меню Вот все и готово. Полученную картинку можно использовать на Web-странице. Соответствующие текстовые ссылки можно с
Работа с цветом

Работа с цветом Выделение цветом Настоящий урок позволяет выделить цветом объект, на котором мы хотим акцентировать внимание зрителя.
Открываем документ содержащий цветное изображение
Открываем документ, содержащий цветное изображение. Сразу же делаем копию этого изображения: ImageDupIicate. Командой ImageModeGrayscaIe преобразуем изображ
На этом рисунке цвет имеют только котенок и третья рюмка
На этом рисунке цвет имеют только котенок и третья рюмка Начинаем тереть «ластиком» то место, где расположен выделяемый объект. Постепенно он начнет приобретать свой цвет,
Исходное изображение — песик одет
Исходное изображение — песик одет в красный костюм Санта-Клауса
Замена цвета элемента изображения
Замена цвета элемента изображения А вот еще один способ изменения цвета конкретного фрагмента изображения. Этот способ практически не отличается от описанного выше. Он демонстрирует во
Исходный рисунок — все помидоры красные

Исходный рисунок — все помидоры красные Для начала выделяем объект, цвет которого будем изменять. Мы будем менять цвет второго верхнего красного помидора. На панели инструме
Создание теней
Создание теней Начнем с самой простой и часто встречающейся в Web-дизайне задачи — создания объемных заголовков (надписей). Эффект объемности легко получить за счет иллюзии тени, отбрас
Слово на прозрачном фоне
Слово на прозрачном фоне Далее выполним команду LayerLayer StyIeDrop Shadow (СлойСтиль слояОтбросить тень). Откроется диалоговое окно Layer Style (Стиль сло
Окно параметров стиля слоя в котором
Окно параметров стиля слоя, в котором можно задать параметры тени
Текст отбрасывает тень
Текст отбрасывает тень
Создание текстуры

Создание текстуры Для создания фона Web-страницы, для заливки некоторых полей таблиц или меню в Web-дизайне иногда используют так называемые текстуры. Существуют довольно обширные колле
Фильтр Emboss немного смягчит
Фильтр Emboss немного смягчит эффект, полученный на первом этапе Параметры устанавливаем в следующие значения: Angle (Угол) — 53°, Height (Высота) — 2 (пиксела), Amount
Плавный переход в другую картинку
Плавный переход в другую картинку Подбираем две более-менее подходящие друг к другу картинки и последовательно открываем их.
Это две исходные картинки
Это две исходные картинки Теперь активизируем нашу первую картинку. На ней изображен самолет в полете. Но самолет летит в нижней части картинки, что не очень подходит для н
Инструментом Clone Stamp переносим самолет немного повыше
Инструментом Clone Stamp переносим самолет немного повыше После того как новый самолет будет готов, на место старого аналогичным способом клонируем облака. Материал для кло
В режиме редактирования быстрой

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

Окончательный вариант коллажа — гора на переднем плане, как будто так и было! Используя инструмент Eraser (Ластик), удаляем все ненужные элементы. При работе с мелкими дета
Оригинальная фотография
Оригинальная фотография Теперь создаем новый документ приблизительно таких же размеров, как выделенный фрагмент. Первоначально он будет иметь абсолютно белый фон. Именно эт
Зальем фон подложки розовым цветом и добавим шума
Зальем фон подложки розовым цветом и добавим шума Используя инструмент
В режиме свободного деформирования
В режиме свободного деформирования изображения Free Transform растягиваем треугольное выделение в сторону изображения В итоге наше треугольное выделение немного растянется в ст
Для создания свободно загибающегося
Для создания свободно загибающегося уголка, сделаем выделение в виде овала Затем переходим в режим редактирования быстрой маски (Q). Входим в режим свободного дефор
Конечный результат вполне правдоподобно завернувшийся уголок

Конечный результат: вполне правдоподобно завернувшийся уголок
Имитация оттиска штампа
Имитация оттиска штампа Настоящий пример демонстрирует возможность имитации печатей на официальных документах. В принпапку. Чтобы открыть файл в Photoshop, достаточно просто перетащить
Сначала создаем форму будущего штампа
Сначала создаем форму будущего штампа Затем выбираем инструмент Text (Текст) и внутри рамки пишем нужный текст с учетом оговоренных условий.
Для написания текста в штампе
Для написания текста в штампе лучше использовать самые простые шрифты Обычно никто штампы ровно горизонтально не ставит. Поэтому, используя команду ImageRotate CanvasQ.
Изображение станет еще хуже Осталось
Изображение станет еще хуже. Осталось разместить оттиск штампа в нужном месте документа.
«Сверкающий текст»

«Сверкающий текст» Для начала создаем новый документ (файл) примерно 600x600 пикселов, в режиме RGB, на прозрачном фоне. Затем заливаем черным цветом текущий слой. Используя инструме
Исходный текст для эксперимента
Исходный текст для эксперимента Теперь применим фильтр FilterBlurGaussian Blur (ФильтрРазмытиеГауссовское размытие) с радиусом размытия 2 пиксела. В результ
Текст после применения фильтра BlurGaussian Blur
Текст после применения фильтра BlurGaussian Blur
Текст после применения фильтра Stylize Solarize
Текст после применения фильтра Stylize Solarize Обратимся к палитре Layers (Слои). Для включения этой палитры выполняем команду WindowShow Layers (ОкноПоказать
Мы инвертировали а затем повернули
Мы инвертировали а затем повернули на 90° по часовой стрелке исходное изображение
Исходный текст после его перевода

Исходный текст после его перевода в полярную систему координат Полученное изображение инвертируем. Самый удобный для этого способ — нажать комбинацию клавиш CtrI+StylizeWind
Применение фильтра FilterStylizeWind, который имитирует смазанность от дуновения ветра
После автоматической регулировки
После автоматической регулировки уровней, текст получил темный оттенок Для этого используем уже знакомый вам фильтр FilterDistortPolar Coordinates, но здесь обязате
В результате всех действий мы
В результате всех действий мы получили прежний текст с интересным свечением (или сиянием) Настало время вспомнить и о первом слое QWERTY. Получившийся у нас текст со свечен
Результат вполне читаемый текст со свечением
Результат вполне читаемый текст со свечением
«Стеклянный текст»
«Стеклянный текст» Следующий способ представления текста называется «Стеклянный текст». Особенность его заключается в том, что текст не просто является прозрачным, но и создает некоторо

Картинка которая будет служить фоном
Картинка, которая будет служить фоном Как вы уже знаете, при использовании инструмента редактирования текста Тyре весь текст записывается в отдельный слой. Таким образом, н
На фоновое изображение наносим
На фоновое изображение наносим текст, который будем делать стеклянным Создаем копию получившегося документа. Для этого используем команду ImageDuplicate. Затем переключ
Мы залили весь фон черным цветом
Мы залили весь фон черным цветом, используя комбинацию клавиш Alt+Backspace После правильно выполненных операций должен получиться белый текст на черном фон
Используем фильтр DistortDisplace
Используем фильтр DistortDisplace Далее, удерживая нажатой клавишу Ctrl, щелкнем по текстовому слою на палитре слоев Layers. На искаженном изображении текста до
Готовое изображение стеклянный текст
Готовое изображение - стеклянный текст
Нужно проследить, чтобы активным по-прежнему оставался слой с фоновым изображением, а не с текстом! Дальнейшая работа будет связана с ме
Окно Layer Style с новыми параметрами для стиля Drop Shadow
Окно Layer Style с новыми параметрами для стиля Drop Shadow Теперь нам останется проделать аналогичные действия еще для двух стилей: Bevel and Emboss и Satin (Атлас). Их де
Окончательный вариант изображения со стеклянным текстом
Окончательный вариант изображения со стеклянным текстом

---

Forekc.ru
Рефераты, дипломы, курсовые, выпускные и квалификационные работы, диссертации, учебники, учебные пособия, лекции, методические пособия и рекомендации, программы и курсы обучения, публикации из профильных изданий

---