Рубрика: Photoshop Уроки | Урок прочитали: 713
 (голосов: 0)

Рисуем иконку в Фотошоп

Вот что мы должны получить:

Иконки являются важной частью интерактивного и веб дизайна . Хотя иконки малы, их бывает очень сложно создать. В сегодняшнем уроке мы продемонстрируем, как создать иконку папки с использованием различных форм и рефлексов в 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 (Фильтр – Размытие - Размытие в движении). Уменьшите непрозрачность по своему вкусу.

Заключительный просмотр
Я надеюсь, вам понравился этот урок. Я добавил некоторые дополнительные значки, которые  создал с использованием тех же методов.

Автор: Cucu Tudor-Ionel
Перевод: Алевтина Акименко
Ссылка на источник

           

Похожие файлы и публикации:

Рисуем иконку в Фотошоп
Программа Photoshop – фантастическая программа, с помощью которой можно обрабатывать не только фотографии, но и создать реальные объекты. В сегодняшнем уроке, мы продемонстрируем, как создать изображение реалистичного ножа похожего на фотографию в программе Photoshop, используя векторные инструменты для рисования, стили слоя, текстуры, и эффекты.
Рисуем иконку в Фотошоп
Финальное изображение
Рисуем иконку в Фотошоп
Шаг 1. Откройте Photoshop и создайте новый документ. Я использовал размер 2560x1440 пикселей. Затем используя Градиент (Gradient Tool (G)) залейте фон радиальным градиентом двух цветов 3d2626 и 060404.
Рисуем иконку в Фотошоп
В этом уроке мы узнаем, как нарисовать веселого мальчика в Фотошоп. Вот, что должно у нас получиться.
Рисуем иконку в Фотошоп
Шаг 1: Создание формы Создайте новый документ в Фотошоп, залейте его белым (#FFFFFF). Создайте new layer (новый слой) и используйте инструмент Pen (Перо), чтобы нарисовать фигуру бейсболки (вы можете использовать в качестве  ориентира изображение бейсболки или этот контур, представленный ниже). После чего нажмите Ctrl+Enter, чтобы трансформировать контур в выделение. Затем залейте его цветом #1c1812.
Рисуем иконку в Фотошоп
В этом уроке Вы узнаете, как создать шляпу фокусника в Photoshop. Урок показывает простое использование  инструментов Pen Tool и Shape Tools, а также использование различных режимов. Создание теней также объяснено в уроке. Давайте начнем! Что получится у вас в конце урока.
Рисуем иконку в Фотошоп
Заключительный результат.
Рисуем иконку в Фотошоп
В этом уроке я покажу Вам, как создать дизайн для приложения записной книжки.
Рисуем иконку в Фотошоп
Шаг 2. Создайте новый слой и назовите его “camera2”. Выделите содержимое слоя “camera1” (CTRL + клик по миниатюре слоя). Выполните команду “Select > Modify > Contract” (Выделение > Модификация > Сжать). Установите сжатие в 7 пикселей. Залейте выделение цветом.
Рисуем иконку в Фотошоп
В этом уроке я покажу, как нарисовать красную сумку для покупок. В этом уроке будут приведены основные приёмы рисования, такие как создание фигур, затемнение, и добавление теней.
Рисуем иконку в Фотошоп
Сегодня мы создадим симпатичную кнопку-переключатель, которую вы сможете использовать в своих работах. Для начала взглянем на финальное изображение.
Рисуем иконку в Фотошоп
Изображение - существенный элемент в наборе любого дизайнера. Независимо от того - простой Ваш проект или что-то эксклюзивное, хорошее изображение будет всегда кстати. В этом уроке продемонстрированы способы того, чтобы помочь Вам создать своё собственное глянцевое изображение.
Рисуем иконку в Фотошоп
Шаг 1. Создайте новый документ 512x512 пикселей с белым или прозрачным фоновым слоем. Залейте фоновый слой серым (9D9D9D). Создайте вертикальную и горизонтальную направляющие для удобства.
Рисуем иконку в Фотошоп
Ниже приведены ссылки для загрузки материалов. Но ссылок на векторные фигуры не будет. Поэтому скачайте их самостоятельно на любом дизайнерском сайте.  Это не сложно, потому что таких векторов куча.
Рисуем иконку в Фотошоп
В этом уроке Вы узнаете, как создать иконку в виде дома. Вот так будет выглядеть иконка в конце этого урока:
Рисуем иконку в Фотошоп
Sketch (Эскиз) Rays Shape (фигура Лучи) Vtks Black Font( шрифт)
Рисуем иконку в Фотошоп
В этом уроке мы научимся рисовать губную помаду. Вот, что у нас получится.
Рисуем иконку в Фотошоп
Нам понадобятся для урока такие материалы: Пальмовый лист Шрифт
Рисуем иконку в Фотошоп
В этом уроке мы будем рисовать анимацию летающего ангела.