В этом уроке мы будем рисовать простую, плоскую иконку компаса в Adobe Illustrator. Это еще один простой урок, который научит начинающих точности в работе с векторной графикой, а также плоскому, упрощенному стилю для создания подобных иллюстраций. Вы получите стильную иконку, которая подойдет для проектов, связанных с картами и географией.

Результат

Шаг 1

Создайте новый документ, выбрав в меню File > New/Файл>Создать (или нажав Control-N). Укажите настройки как показано ниже:

Шаг 2

Начнем с создания круга размером 52 x 52 px. Укажите ему толщину обводки в 4 px (#443D38), и выровняйте круг по центру рабочей области как показано ниже.

Шаг 3

Нарисуйте еще один круг — поменьше, размером 40 x 40 px с такой же обводкой. Поместите его ровно по центру предыдущего круга. Выделите обе фигуры и сгруппируйте их, нажав Control-G.

Шаг 4

Рисуем сердцевину. Это круг размером 28 x 28 px без обводки и с заливкой цвета #64E89A. Помещаем его в центр нашей композиции.

Шаг 5

Добавим четыре круга размером 4 x 4 px (#443D38), которые будут нашими точками ориентирования по четырем сторонам света. Расположите круги как показано ниже  и сгруппируйте их вместе, нажав Control-G.

Шаг 6

Теперь займемся стрелкой. Нарисуйте прямоугольник размером 12 x 28 px с нашей обводкой — толщиной в 4 px (#443D38). Укажите обводке Round Join/Скругленные углы, и выровняйте относительно рабочей области.

Шаг 7

Инструментом Add Anchor Point/Добавить опорную точку (+) добавьте четыре опорные точки по центру каждой из сторон.

Шаг 8

Инструментом Delete Anchor Point/Удалить опорную точку (-) кликните по всем углам.

Шаг 9

Возьмите инструмент Rotate/Поворот и поверните получившуюся фигуру на 45 градусов ( или кликните по фигуре правой кнопкой и выберите Transform > Rotate/Трансформировать > Повернуть > -45º).

Шаг 10

Иконки рекомендуется создавать в технике Pixel-Perfection. Для этого включите режим Pixel Preview/Пиксельный просмотр (Alt-Control-Y) и все точки стрелки притяните к пиксельной сетке. Для этого выделяйте каждую точку последовательно инструментом Direct Selection/Прямое выделение (A). Нажмите Alt-Control-Y чтобы вернуться в обычный режим.

Шаг 11

Дублируйте фигуру стрелки (Control-C > Control-F) и для копии поменяйте местами обводку и заливку. Инструментом Delete Anchor Point/Удалить опорную точку (-) удалите верхнюю точку. Выделите обе фигуры, составляющие стрелку и сгруппируйте их (Control-G).

Результат

Автор урока Andrei Ștefan

Перевод — Дежурка

Смотрите также:

• Рисуем иконку фитнес-трекера в Adobe Illustrator
• Рисуем иконку термометра в Adobe Illustrator
• Рисуем ключ в Adobe Illustrator