3D иконка для вашего сайта
3D иконка для вашего сайта


Работать будем в новом документе, который тут же и создаем. Размеры – 750px на 550px. Из палитры инструментов берем Произвольную фигуру (Custom Shape Tool) и находим в настройках значок, изображенный на скриншоте. Устанавливаем Контур (Paths) и создаем фигуру:



3D иконка для вашего сайта


Приступаем к рисованию верха. Создаем новый слой с названием Top Surface, после чего, находясь на нем, открываем палитру контуров и выполняем заливку выделения цветом #497923.

3D иконка для вашего сайта

v>

Прячем слой Top Surface и создаем еще один (Create New Layer), назовем его Body. Теперь выполняем действия из предыдущего шага, за исключением цвета – в этот раз он должен быть #4AC1FF. Непрозрачность данного слоя (Opacity) нужно уменьшить до 50%.

3D иконка для вашего сайта


Настала очередь создать середину фигуры. Переходим на слой Body и выделяем весь холст (команда Ctrl + A). Берем Перемещение (Move Tool) и нажимаем комбинацию клавиш Ctrl + Alt + T и, нажав на стрелку перемещения один раз, двигаем слой на 1px вниз, после чего нажимаем на клавиатуре Enter. Теперь, нажав Ctrl + Alt + Shift + T, повторяем трансформацию. Выполняем этот шаг до тех пор, пока не достигнем результата, изображенного на скриншоте.

3D иконка для вашего сайта


Теперь нужно сделать верхние грани фигуры. Возвращаем видимость слою Top Surface и изменяем ему Режим наложения на Наложение (Blending Mode–>Overlay), а Непрозрачность (Opacity) на 50%, после чего в стилях слоя устанавливаем Внешнее свечение (Layer Style->Outer Glow) со следующими параметрами: Режим (Mode) – Замена светлым (Lighten); Цвет – Белый; Непрозрачность (Opacity) – 100%; Размер (Size) – 5 пикселей.

3D иконка для вашего сайта


Переходим к рисованию нижней части. Снова создаем новый слой (Create New Layer), имя которому – Base, в списке он должен находиться ниже слоев Body и Top Surface. Теперь повторяем второй шаг, посвященный созданию формы, только цвет используем другой - #00F5FF (см. скриншот).

3D иконка для вашего сайта


Следующим шагом будет создание тени под основанием иконки. Делаем дубликат слоя Base, помещаем его под слой-оригинал и называем его Shaddow. Чтобы тень была слегка размытой, нужно для слоя-тени применить фильтр Размытие по Гауссу (Gaussian Blur Filter). Значение радиуса – 10px.

3D иконка для вашего сайта


Теперь можно оснастить нашу 3D-фигуру блеском. Снова обращаемся к созданию нового слоя, который назвам Gross. Расположить его следует поверх всех. С помощью Овальной области (Elliptical Marquee Tool) делаем выделение с радиусом, достаточным для того, чтобы получить область, показанную на скриншоте. Теперь выбираем мягкую Кисть (Brush Tool) в режиме Аэрографа, прописываем ей диаметр, равный 300px и зарисовываем нижнюю область выделения. После этого уменьшаем непрозрачность слоя до 60%.

3D иконка для вашего сайта


И эти же действие повторяем для стрелки.

3D иконка для вашего сайта


Боковушкам можно добавить горизонтальные блики. Для этого создаем еще один слой, назовем его Reflection. С помощью инструмента Прямоугольник, создаем две фигуры, как показано на скриншоте и ластиком стираем те части прямоугольников, которые выходят за грани, после чего устанавливаем непрозрачность данного слоя на 30%.

3D иконка для вашего сайта


Такие же блики создаем на внутренних боковинах.

3D иконка для вашего сайта


Фигура готова, можно лишь украсить ее фоном и блеском.

3D иконка для вашего сайта


Источник: 10steps.sg
Переведено специально для 8ART.RU


Информация
Комментировать статьи на нашем сайте возможно только в течении 10 дней со дня публикации.