Сделать стартовой Добавить в закладки Обратная связь Новости по RSS 2.0
ZEROlayer.ru » Уроки Photoshop » Креатив » Создание в фотошопе иконки для карты. Часть II.

Создание в фотошопе иконки для карты. Часть II.

Автор: sondar | Категория: Уроки Photoshop » Креатив | 13-11-2014, 21:22
3. Рисуем иконку отметки на карте

Шаг 1
Прежде всего, нарисуем круг. Выберите инструмент Эллиптическая область (Elliptical Shape Tool). В моем случае использован розовый (#d27eee) цвет. Вам ничто не мешает выбрать любой другой цвет на свое усмотрение.

Создание в фотошопе иконки для карты. Часть II.


Шаг 2
Продублируйте созданный круг, выделив его при помощи инструмента Выделение контура (Path Selection Tool), и последовательным нажатием Control-C, Control-V. Далее, нажатием Control-T, активируйте Свободную трансформацию. Сместите вершину каркаса деформации внутрь, уменьшая размер дубликата.

Создание в фотошопе иконки для карты. Часть II.


Шаг 3
Чтобы получить фигуру в виде бублика, убедитесь, что контур дубликата находится в режиме Вычесть из области фигуры (Subtract Front Shape).

Создание в фотошопе иконки для карты. Часть II.


Шаг 4
Выберите инструмент Стрелка (Direct Selection Tool). Данный инструмент позволяет выделять отдельные опорные точки контура. Выделите самую нижнюю точку круглого контура и сместите ее по вертикали вниз последовательным нажатием клавиши со стрелкой вниз. В этот момент вы можете получить предупреждение Фотошопа о выполняемом преобразовании фигуры. В этом случае просто подтвердите свое действие.

Создание в фотошопе иконки для карты. Часть II.


Шаг 5
Переключитесь на инструмент Угол (Convert Point Tool ), и кликните по показанной ниже точке

Создание в фотошопе иконки для карты. Часть II.


Создание в фотошопе иконки для карты. Часть II.


Шаг 6
Вот что у нас должно получиться на данный момент

Создание в фотошопе иконки для карты. Часть II.


Шаг 7
Дважды кликните по слою с созданной фигурой и в открывшемся окне параметров наложения примените следующие стили слоя: Внутренняя тень (Inner Shadow) и Наложение градиента (Gradient Overlay). Настройте стили так, как показано на скриншотах ниже: 

Создание в фотошопе иконки для карты. Часть II.


Создание в фотошопе иконки для карты. Часть II.


Шаг 8
Продублируйте фигуру нажатием Control-J. Активируйте Свободную трансформацию (Control-T) и сместите верхний манипулятор вниз, делая дубликат короче:

Создание в фотошопе иконки для карты. Часть II.


Шаг 9
Двойным кликом по слою с фигурой снова откройте окно параметров наложения и примените стили слоя Наложение градиента (Gradient Overlay) с настройками, показанными ниже. Снимите галочку с раздела Внутренняя тень (Inner Shadow).

Создание в фотошопе иконки для карты. Часть II.


Шаг 10
Ниже показано, что у нас должно получиться. Внутренняя часть нашей иконки стала темнее. Но нам все равно нужно вручную немного подкорректировать появившуюся тень, так, чтобы она выглядела более реалистично.

Создание в фотошопе иконки для карты. Часть II.


Шаг 11
Кликните, удерживая Ctrl, по слою с фигурой, образующей заднюю часть иконки, создав, таким образом ее выделенную область. Далее пройдите в меню Редактирование > Выполнить обводку (Edit > Stroke). Задайте размер: 1 пиксель, и цвет #faedff. Это чуть более светлый оттенок примененного ранее розового цвета. В зависимости от цвета вашей иконки, вы можете выбрать другой цвет.

Создание в фотошопе иконки для карты. Часть II.


Шаг 12
Пройдите в меню Фильтр > Размытие > Размытие по Гауссу (Filter > Blur > Gaussian Blur), и задайте достаточно малый радиус размытия, что бы лишь слегка размыть обводку. Так у нас получится отсвет на кромке иконки.

Создание в фотошопе иконки для карты. Часть II.


Создание в фотошопе иконки для карты. Часть II.


Шаг 13
Примените еще одну обводку, только на этот раз для внешней поверхности иконки. Кликните по ее слою, удерживая Ctrl, и воспользуйтесь командой Выполнить обводку (Stroke):

Создание в фотошопе иконки для карты. Часть II.


Шаг 14
Смягчите обводку, применив Гауссовское размытие:

Создание в фотошопе иконки для карты. Часть II.


Шаг 15
Создайте для этого слоя слой-маску. Нажмите D, затем Control-Delete, залив, таким образом, поверхность маски черным цветом. Тонкая сплошная линия отсвета на кромке окажется полностью скрытой под маской. Выберите инструмент кисть, и прокрасьте белым цветом выборочные участки, восстанавливая на них видимость тонкого блика.

Создание в фотошопе иконки для карты. Часть II.


Шаг 16
Выберите инструмент Лассо (Lasso Tool ), и вручную создайте показанную ниже выделенную область:

Создание в фотошопе иконки для карты. Часть II.


Шаг 17
Создайте новый слой, залейте выделенную область черным цветом и примените Гауссовское размытие:

Создание в фотошопе иконки для карты. Часть II.


Шаг 18
Уменьшите Непрозрачность этого слоя до 18%.

Создание в фотошопе иконки для карты. Часть II.


Шаг 19
Создайте еще один новый слой и прокрасьте черным цветом нижнюю часть иконки, а так же выборочные участки вдоль ее гарней.

Создание в фотошопе иконки для карты. Часть II.


Шаг 20
Уменьшите Непрозрачность этого слоя:

Создание в фотошопе иконки для карты. Часть II.


4. Расположение иконки на карте

Шаг 1
Займемся созданием тени иконки. Здесь придется поработать вручную. Выберите инструмент Кисть и прокрасьте черным цветом место соприкосновения иконки и карты.

Создание в фотошопе иконки для карты. Часть II.


Шаг 2
Кликните, удерживая Ctrl по иконке слоя с фронтальной поверхностью иконки. Кликните по образованной выделенной области ПКМ, и выберите в открывшемся контекстном меню пункт Трансформировать выделенную область.

Создание в фотошопе иконки для карты. Часть II.


Шаг 3
Зажмите клавишу Ctrl, и сместите манипуляторы так, чтобы выделенная область “легла” на карту в соответствии с перспективой.

Создание в фотошопе иконки для карты. Часть II.


Шаг 4
Создайте новый слой и залейте выделенную область цветом #652b78. Смягчите созданную тень за счет применения фильтра Гауссовского размытия.

Создание в фотошопе иконки для карты. Часть II.


Шаг 5
Создайте для слоя с этой тенью слой маску и залейте ее черным цветом. Теперь прокрасьте белым цветом те участки, где тень должна проявиться.

Создание в фотошопе иконки для карты. Часть II.


5. Фон

Шаг 1
Создайте новый слой, который будет содержать наш фон. Наложите на него легкий градиент от серого к более темному серому.

Создание в фотошопе иконки для карты. Часть II.


Шаг 2
Примените слой коррекции Цвет (Solid Color), задав синий цвет, и уменьшите Непрозрачность этого слоя.

Создание в фотошопе иконки для карты. Часть II.


Заключение
Надеюсь, урок вам понравился, и вы научились в процессе его выполнения новым приемам. Здесь у вас была возможность наглядно убедиться в том, что рисовать объемно выглядящие объекты с помощью простых фигур в Фотошопе очень просто. Главное - правильно наложить свет, тени и блики.

Создание в фотошопе иконки для карты. Часть II.


 
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь. Мы рекомендуем Вам зарегистрироваться либо зайти на сайт под своим именем.

Другие новости по теме:


Просмотров: 7912 | Напечатать | Комментарии (0)

Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.
Навигация по сайту

Новые уроки

Легкое тонирование при помощи режимов наложения
Легкое тонирование при помощи режимов наложения


Хотите поближе познакомиться с магией тонирования? Методов и техник тонирования существует великое множество, но сегодня я познакомлю вас с такой техникой, которая, за счет использования режимов наложения слоев, максимально упрощает весь процесс.

Популярные статьи

Друзья
Семейный портал
Полезная информация о недвижимости
Реклама

Мы в соц сетях

Рейтинг блогов


Главная страница | Регистрация | Добавить новость | Новое на сайте |

При перепечатке материалов с сайта ссылка на источник обязательна (кликабельная и не шифрованая).
Запрещено вносить изменения в графический материал, например, обрезание водяного знака или перекрытие его своим знаками.