Zero #4
Меню
  Главная
  Авторам
  Разделы
  Ссылки
HiTech
  Samsung мобилизует силы на выпуск NAND-флэш.
  Все мужчины делают это.
  Дикий запад.
Моддинг
  В шкуре леопарда.
  Аналоговый индикатор загрузки винчестера с подсветкой.
  Аналоговый индикатор загрузки винчестера с подсветкой 2.
  Запретная зона или куда смотрит винт.
  Запретная зона или куда смотрит винт 2.
  Запретная зона или куда смотрит винт 3.
Mobile
  «МегаФон»: бесплатный чат для влюбленных.
  Nokia: Make a Connection.
Windows
  Предварительный обзор Windows XP.
  Обзор операционной системы Windows XP 64-bit Edition .
  Windows XP против WinME и Win2000 - проверка производительности.
Интернет - программинг
  Начинаем программировать на языке Java. Часть 1
  Начинаем программировать на языке Java. Часть 2
  Начинаем программировать на языке Java. Часть 3
Интернет - design
  Аква-кнопка.
  Черно-белое фото в цветное.
  Как подобрать гармоничную комбинацию цветов для Web-сайта.
Софт
  Программа выпуска.
Чтиво
  Книга выпуска.
  Написано читателями.
  Воспоминания
Games
  Казаки II.
  Need For Speed Underground.
  Тормозилки.
  Cheats.
Интервью
  Полная труба.
  Интервью Дельфина журналу Молоток.
  Кролик из Playboy на Спасской башне.
Музыка
  Кайли собирается выйти замуж.
  ВИА ГРА в новом имидже - притяжения больше нет.
  Смотрелка.
Здоровье
  Отдых для беременных.
  Есть ли у тебя риск спиться Тест.
  Пристальный взгляд на проблему боли.
www.mzero.by.ru
Содержание

Аква-кнопка

 

Сегодня мы с Вами познакомимся с одним из многочисленных способов создания в Photoshop реалистичной аква-кнопки. Почему одним из многочисленных? Дело в том, что найти или придумать процесс создания такого нехитрого объекта весьма несложно, и некоторым может показаться довольно утомительным занятием; однако мы попытаемся пойти немного дальше и оптимизировать или сократить время его выполнения, насколько это возможно. Удастся нам это сделать или нет, - судить, конечно, Вам. Настоящий урок потребует от Вас максимум 10-ти минут на выполнение и, возможно, вполовину меньше, на понимание и запоминание его элементов. Засечем время?

Рисунок 1

 

1

Итак, все, что нам понадобится в ходе урока, - это знание основ работы с инструментами Градиент (Gradient Tool) и Выделение (Selection).
Создадим новое изображение размером 300х58 пикселей: Файл>Новый (File>New) или Ctrl+N, что проще и, как правило, быстрее.

Рисунок 2

 

2

Для начала работы, используя инструмент Прямоугольное выделение (Rectangular Marquee Tool) или Эллиптическое выделение (Elliptical Marquee Tool), нарисуем на новом слое объект необходимой нам формы; в нашем случае - это кнопки круглой и овальной формы.
На всякий случай напомню, что правильный круг лучше рисовать с помощью инструмента Эллиптическое выделение (Elliptical Marquee Tool), удерживая Alt+Shift; выделение, представленное на иллюстрации, удобней создавать с помощью инструмента Прямоугольное выделение (Rectangular Marquee Tool) с последующим применением команды Выделение>Модифицировать>Сглаживание (Select>Modify>Smooth). Опцию Сглаживание (Anti-aliased) в настройках инструмента полезней отключить.
После того, как выделение готово, для инструмента Градиент (Gradient Tool) подберем нужные цвета - переднего и заднего плана. В нашем случае - это темно- и светло-красный.

Рисунок 3

 

 

3

Зальем выделение определенными нами цветами. В нашем случае более светлый оттенок находится снизу; более темный - сверху.
Не сбрасывая выделение, сожмем его на 5 пикселей: Выделение>Модифицировать>Сжать (Select>Modify>Contract), а затем сгладим его на 3 пикселя: Выделение>Сглаживание (Select>Feather).
Конечно же, указанные значения команд достаточно условны и зависят лишь от размера рабочего изображения.

 

Рисунок 4

4

Опять же, не сбрасывая выделение, перейдем к палитре Слои (Layers), создадим новый слой и поместим его над активным (комбинация Shift+Ctrl+N слегка ускорит этот процесс).
Определим цвет переднего плана как белый, а затем изменим опцию инструмента Градиент (Gradient Tool) на: От переднего фона к прозрачному (Foreground to Transparent), и теперь зальем вертикальным градиентом выделение, проводя линию сверху вниз, от границы выделения примерно до его середины.

Рисунок 5

5

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

Остановим секундомер!

Успехов Вам и до следующей встречи!




Сайт: www.webb.bip.ru


Copyright by ZERO
Копирование и использование данных материалов разрешается
только в случае указания на журнал "
ZERO", как на источник получения информации.
При этом во всех ссылках обязательно явное указание адреса вэб-сайта
www.mzero.by.ru.
Журнал тестировался на IE 5.0/6.0.