Иллюстрированный самоучитель по Web-графике

Уроки Photoshop

  • Обработка текста

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

    Начнем с самой простой и часто встречающейся в Web-дизайне задачи – создания объемных заголовков (надписей). Эффект объемности легко получить за счет иллюзии тени, отбрасываемой буквами заголовка. Хотя это далеко не единственный путь, ведущий к указанной цели, рассмотрим данный прием подробнее.
  • Сверкающий текст

    Для начала создаем новый документ (файл) примерно 600x600 пикселов, в режиме RGB, на прозрачном фоне. Затем заливаем черным цветом текущий слой. | Используя инструмент Type (Текст), напишем (лучше светлым начертанием шрифта) свой текст.
  • Стеклянный текст

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

    Продолжаем применять различные эффекты для оформления текстов. На сей раз речь пойдет о выполнении надписей из специфических материалов. Выбор материала остается за вами. Главное, чтобы конечный стиль текста гармонировал с той средой, куда вы его желаете вставить.
  • Огненный текст

    Следующий урок мы назвали "Огненный текст". Результатом нашего эксперимента будет статическое изображение текста в огне. | Рис.204. Создаем новый документ, выполнив команду File › New (CTRL + N) | Итак, создаем новый документ, в котором будем разрабатывать изображение.
  • Текст в подтеках

    Данный пример имитирует текст, написанный краской (или кровью), которая еще не успела подсохнуть, поэтому образовались подтеки. | Итак, создаем новый документ и вводим нужный текст. Обратить внимание следует на то, что фон необходимо установить черный, а цвет шрифта – белый. Отцентрируем текст.
  • Ледяной текст

    Как обычно, создаем новый документ с белым фоном и черным шрифтом набираем нужный текст. | Рис. 218. | Используя команду Select › Load selection, задаем имя нашего выделения. Впрочем, можно оставить и то, что предлагается по умолчанию. | Рис. 219.
  • Текст в горошек

    Создаем новый документ. А потом создаем новый канал. В этом канале создаем квадратное выделение по центру. В результате первого этапа у нас должна получиться репродукция знаменитой картины Малевича "Черный квадрат". Снимаем выделение.
  • Текст в кирпичик

    При оформлении Web-страниц нередко используют специфическую заливку текста небольшим рисунком (текстурой). Как это сделать? | В новом документе создаем необходимый текст. Пусть первоначально наш текст будет черным на белом фоне.
  • Разжижение

    Мы не можем не упомянуть еще один инструмент, позволяющий модифицировать изображение – фильтр Liquify (Разжижение). В Photoshop 6.0 соответствующая команда находится в меню Image (Изображение). Однако в Photoshop 7.0 эта команда уже перемещена в более подходящее для нее меню Filter (Фильтр).
  • Обработка фотографий. Создание рамок.

    Редактор Photoshop в гораздо большей степени предназначен для обработки фотографических изображений, чем текста. Он предлагает огромное количество разнообразных способов обработки фотографий. | Создание рамок | При создании домашней Web-страницы иногда хочется поместить на нее несколько своих фотографий, оформив их в виде фотоальбома.
  • Другой способ создания рамок

    Описанный в предыдущем разделе способ обрамления подразумевает потерю части изображения, которая не попадает в рамку. А если рамка не сплошная, если в ней есть прозрачные участки? Следующий пример демонстрирует возможность сохранения изображения под "дырявой" рамкой.
  • И еще одна рамка

    Настоящий пример демонстрирует еще один способ создания стильных рамок для фотографий. На этот раз рамка будет создаваться с использованием режима редактирования быстрой маски (Quick Mask). | Для примера открываем тот же файл с фотографией, который использовался в прошлый раз.
  • Фотомонтаж

    Фотомонтаж подразумевает последовательность некоторых действий над несколькими фотографическими изображениями, в результате которых получается принципиально новое изображение – попросту коллаж из первичных снимков. | Для начала подбираем пару картинок, которые будут участвовать в нашем фотомонтаже.
  • Реставрация старинных фотографий

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

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

    Допустим, у нас есть какой-нибудь фотоснимок. Но нам требуется оформить Web-страницу стилизованными рисунками, а присутствие фотографий на ней нежелательно вообще. На этом уроке мы как раз и будем решать задачу о преобразовании фотографии в карандашный или акварельный эскиз. | Рис. 278.
  • Еще один портрет акварелью

    Открываем документ, содержащий портретную фотографию. | Теперь выделяем все изображение: Select › All (CTRL + A) и копируем это выделение в буфер: Edit › Copy (CTRL + C). На палитре Layers (Слои) создаем новый слой щелчком на значке Create a New Layer (Создать новый слой).
  • Пазл

    Эффект пазла позволяет сымитировать головоломку-мозаику, где все отдельные элементы имеют затейливые неровные формы и соединяются пазами. В осуществлении данного эффекта напрямую используются свойства непосредственно редактора Photoshop 6.0.
  • Интересные примеры. Использование фильтра имитации 3D.

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

    На нашем очередном уроке речь пойдет о специфическом эффекте оформления. Он действительно довольно уникален, но применять его можно довольно разнообразно, была бы фантазия. Этот эффект имитирует пулевое отверстие в плоской поверхности. | Итак, создаем новый документ.
  • Штрих-код

    Штрих-код – сугубо технический товарный символ-код, в котором зашифрована вся полезная и полная информация о продаваемом товаре. Цифрами и полосками здесь кодируется информация о фирме-производителе, товаре, его цене т. д. Такие знаки есть и на отечественных продуктах.
  • Эффект молнии

    Изображение молнии, электрического разряда или звезды – излюбленные эффекты многих дизайнеров. Поэтому мы никак не могли обойти эту тему. | Создаем новый небольшой (400x200 пикселов) документ. В качестве фона создаем вертикальный градиент серых тонов. Для этого выбираем инструмент
  • Создание кнопок

    Кнопки часто встречаются на Web-страницах, имеющих навигационную систему. Конечно, вполне можно обойтись средствами HTML, а также редакторов Web-страниц, которые уже имеют довольно широкий выбор стандартных кнопок.
  • Работа с цветом

    Выделение цветом | Настоящий урок позволяет выделить цветом объект, на котором мы хотим акцентировать внимание зрителя. | Рис. 373. Открываем документ, содержащий цветное изображение. | Сразу же делаем копию этого изображения: Image › DupIicate.
  • Создание текстуры

    Для создания фона Web-страницы, для заливки некоторых полей таблиц или меню в Web-дизайне иногда используют так называемые текстуры. Существуют довольно обширные коллекции текстур. Однако сейчас вам предлагается один из простейших способов создать собственную текстуру.
  • Плавный переход в другую картинку

    Подбираем две более-менее подходящие друг к другу картинки и последовательно открываем их. | Рис. 386. Это две исходные картинки | Теперь активизируем нашу первую картинку. На ней изображен самолет в полете. Но самолет летит в нижней части картинки, что не очень подходит для нашего будущего слияния.
  • Имитация оттиска штампа

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