Aqua-интерфейс -это так просто!

Интерфейс Aqua с полупрозрачными элементами, появившийся в Mac OS, приобретает все большую популярность у web-дизайнеров. В этой статье будет рассмотрена методика создания Aqua-объектов с помощью Adobe Photoshop 6 — моего любимого растрового редактора.

Только создавать мы будем не кнопки, а объемные прозрачные буквы. В описанном ниже примере основная роль отводится различным режимам наложения слоев друг на друга Blending Modes и фильтру Lighting Effects (Эффект света).

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

1. Создаем документ () размерами 400x400 пикселей. Для цвета переднего плана (двойной щелчок на образце цвета в палитре инструментов) устанавливаем темно-синий — 25, 100, 175 (палитра RGB).

Используем курсивное начертание шрифта Times New Roman

Выбираем шрифт с засечками (например, Times New Roman) любого размера и используем инструмент Text. При этом создается новый слой, текстовый, закрашенный цветом переднего плана. Photoshop присвоит ему название, соответствующее введенному тексту (кстати, в Photoshop 7 названия текстовых слоев автоматически меняются соответственно изменениям в тексте, в ранних версиях они статичны). Затем доводим размер буквы до величины экрана — Edit, Free transform (Редактирование, Трансформации).

Теперь мы имеем базу для дальнейшей работы над элементом. Будем добавлять дополнительные слои, которые и придадут букве объемность. Бликами займемся в самом конце, а пока придадим рельефность внутренней части буквы.

2. Удерживая клавишу , щелкните по слою в палитре Layers, чтобы получить его маску прозрачности. То же самое делается командами Select, Load Selection (Выделение, Загрузить выделение). Photoshop создаст выделение по контуру нашего символа. Чтобы в дальнейшем беспрепятственно работать с ним, сохраним его маску прозрачности в виде отдельного слоя.

Заготовка сделана

Для этого сначала щелкаем по «иконке» New Layer (Создать новый слой) в палитре Layers (Слои). Затем уменьшаем размеры нашего выделения на 8 пикселей с помощью Select, Modify, Contract (Выделение, Модифицировать, Сокращать). Кстати, для Photoshop 5 предел — 16 пикселей, а поздние версии редактора сокращают на целых 100 пикселей, что будет полезно, например, для качественной полиграфии.

Теперь в качестве переднего фона устанавливаем белый цвет, которым и зальем получившуюся область (я пользуюсь для операций заливки цветом переднего или заднего плана клавишами и , соответственно). Снимаем выделение командой Select, Deselect (Выделение, Снять выделение) или . Результат трехкратного применения Gaussian Blur

3. После этого применим операцию распушивания границ объ-екта на новом слое, для чего воспользуемся фильтром Gaussian Blur; команды Filter, Blur, Gaussian Blur… (Фильтр, Размытие, Размытие по Гауссу…). Фильтр создает эффект равномерного размытия изображения во всех направлениях, что сделало его одним из самых популярных среди компьютерных художников. Он имеет единственную настройку — радиус размытия (задается в пикселях). Растушуем наш объект на ту же величину, которую мы задавали при сокращении области выделения (8 пикселей). Для достижения требуемого эффекта нам необходимо создать специфическое размытие, которое фильтр за один раз сделать не может. Поэтому мы будем применять этот же фильтр еще два раза, но уже с меньшими значениями размытия — например, 4 пикселя и 2.

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