Вот что мы должны получить:
Иконки являются важной частью интерактивного и веб дизайна . Хотя
иконки малы, их бывает очень сложно создать. В сегодняшнем уроке мы
продемонстрируем, как создать иконку папки с использованием различных
форм и рефлексов в Photoshop. Давайте начнем!
Автор использовал: Adobe Photoshop CS4
Шаг 1 - Новый файл / Техника Пера
Откройте Photoshop и создайте новый документ (Ctrl + N). Используйте следующие настройки:
Разрешение: 72dpi
Цветовой режим: RGB цвет
Размеры: 600 × 600 пикселей
Создайте следующую фигуру с помощью инструмента Pen Tool (P) (Перо). Цвет: # 3da1e2
Шаг 2 - Создание фигур с помощью Пера
Нарисуйте заднюю часть папки с помощью Pen Tool (Пера), используя ту же технику рисования. Затем нарисуйте полосу, как показано на рисунке.
Цвет: # 003658 # 3da1e2 # 08517e
Шаг 3 – Закончим форму
Как только Вы закончили рисунок папки, нужно добавить лист бумаги и
стрелку, как показано на рисунке. Теперь у вас должны быть 5 слоев.
Каждая форма будет на отдельном слое. Назовите каждый слой.
Цвет: # ffffff # 32e732
Шаг 4 - Добавление цветовых эффектов
Добавьте следующие стили слоя к передней части папки. Понизьте непрозрачность до 90%.
Добавить следующие стили слоя для бумаги. Понизьте непрозрачность слоя примерно до 90-95%.
Добавьте следующие стили слоя для полосы.
Добавьте следующие стили слоя к задней части папки.
Добавьте следующие стили слоя для стрелки.
Теперь ваша иконка выглядит так.
Шаг 5 - Добавление Рефлексов
Добавить новую группу под названием "Рефлексы". Используйте Pen Tool
(Перо), чтобы нарисовать отражение, как показано на рисунке. Убедитесь,
что вы рисуете только контур, а не фигуру. После того как вы закрыли
путь, щелкните правой кнопкой мыши по рабочей области и выберите make selection
(Создать выделение) (растушевка (feather) 0). Возьмите большую кисть
(диаметром около 470, твердость 0) и закрасьте правую часть выделения,
как на рисунке, для создания белого отражения. Измените режим смешивания
на Overlay (Перекрытие) и уменьшить непрозрачность до 63%.
Шаг 6 - Края
Создайте новую группу под названием "Края", создайте новый слой в ней
(Ctrl + Shift + N или нажмите значок создания нового слоя). Добавление
бликов на краях придает иконке 3D эффект. Используйте Pen Tool
(Перо), чтобы создать линии обводки вокруг углов и всех полей папки,
бумаги и стрелки. Затем щелкните правой кнопкой мыши по рабочей области и
выберите Stroke Path (Выполнить обводку) – Brush (Кисть). Настройки кисти должен быть изменены заранее, master diameter (диаметр) 8 пикселей а hardness (твердость) 0.
Шаг 7 - Тени
Создайте новый слой (Ctrl + Shift + N) для теней и поместить его в
новую группу (Ctrl + G). Сделайте выделение, как вы это делали в 5 шаге,
для создания отражений. Заполните выделение черным цветом, а затем
размойте поля с помощью инструмента Blur tool (Размытие). Если тени выглядят слишком тёмными, снизьте непрозрачность слоя до 40%.
Шаг 8 - Добавление текста
Добавьте текст, используя любой шрифт, который вам нравится. Я выбрал
"Agency FB". Размер шрифта: 40, непрозрачность слоя: 75%.
Шаг 9 – Итоговое добавление рефлексов и тени
Добавьте еще несколько рефлексов на бумагу, используя те же методы, что приведены в 5 Шаге.
Добавить тень, используя Ellipse Tool (E) (Эллипс). Нарисуйте эллипс, как показано на рисунке и добавьте немного Filter – Blur - Motion blur (Фильтр – Размытие - Размытие в движении). Уменьшите непрозрачность по своему вкусу.
Заключительный просмотр
Я надеюсь, вам понравился этот урок. Я добавил некоторые дополнительные
значки, которые создал с использованием тех же методов.
|