Как уменьшить вектор в фигме

В этой инструкции разбираем как редактировать вектор в фигме с инструментом «Edit object». Это можно использовать для любых векторных элементов (иконок, иллюстраций, фигур созданных с помощью стандартных инструментов фигмы).

Если выбрать элемент, который был нарисован с помощью стандартных инструментов в Figma или любой дургой векторный элемент, то сверху появится иконка «Edit object».

Если её нажать, то на объекте появятся точки и возможность их перемещать. Сверху появятся дополнительные инструменты, которые вы можете использовать.

Bend tool — это инструмент Figma для изгиба, который помогает скруглять углы. Если выбрать этот инструмент и нажать на какую-то точку левой клавишей мыши, а затем потянуть в сторону, то появятся рычаги, с помощью, которых вы можете изменять фигуру.

Если при редактировании задать клавишу «Alt», то можно передвигать один из рычагов.

При зажатии клавиши «Shift», будет возможность изменять расположение рычагов на 45 градусов.

Инструмент «Paint bucket» позволяет закрашивать какие-либо области или наоборот убирать из них заливку.

Вы можете ставить дополнительные точки внутри отрезков фигуры, как показано на скриншоте выше и перемещать их.

Инструменты «Pen tool» и «Pen» помогают дорисовывать дополнительные точки у вашей фигуры.

Видео:Уроки Figma | Симметричный векторСкачать

Заключение

Итак, в этом небольшом видео и статье вы узнали как редактировать вектор в фигме и разобрали про инструмент «Edit object».

Видео:#14 Как перевести растровую картинку в векторную в Figma плагином Image tracer.Скачать

Как рисовать векторные изображения в Figma

Рисуем мяч для регби, хитрим с наложением слоёв и избегаем «мятых» линий.

Meery Mary для Skillbox Media

Часто Figma ассоциируется только с проектированием интерфейсов. Однако в ней можно рисовать полноценные иллюстрации и векторные иконки.

Вместе с иллюстратором Виктором Засыпкиным рассказываем, как работает режим векторного редактора в Figma и как рисовать в нём мяч для регби.

Виктор Засыпкин

Иллюстратор. Рисовал иллюстрации для электронного учебника «Японский язык без страха» и рассылки «Как сделать проект».

Редактор. Пишет про дизайн, редактирует книги, шутит шутки, смотрит аниме.

Видео:Вектор из любой картинки за 1 секунду #вебдизайн #логотип #figmaСкачать

Как работает режим векторного редактора в Figma

Прежде чем рисовать, важно разобраться, как работают инструменты для создания векторных иллюстраций. Если вы уже всё о них знаете — сразу переходите к практике. Если нет — читайте нашу инструкцию.

Для начала нарисуйте простой квадрат:

1. На панели инструментов нажмите на иконку и кликните в любую часть макета.

2. Кликните ещё раз в любую другую часть макета, и у вас появится линия.

3. Таким же образом сделайте ещё три линии, чтобы у вас получился квадрат. Последняя линия должна соединиться с первой. Чтобы линии получились ровными, делайте их с зажатой клавишей Shift.

Обратите внимание, что, создав первую точку, вы вошли в режим векторного редактора, и панель инструментов изменилась:

Добавьте на квадрат дополнительные точки, чтобы получился многоугольник:

1. На панели инструментов нажмите на иконку , наведите курсор на одну из линий — посередине вы увидите точку.

2. Зажмите эту точку правой кнопкой мыши и тяните её от центра фигуры.

3. Повторите то же самое с остальными сторонами фигуры.

Сгладьте углы получившегося прямоугольника:

1. На панели инструментов нажмите на иконку и дважды кликните на любую из точек фигуры.

2. Зажмите любой из краёв появившихся линий — их называют усами. Тяните ус в сторону изгиба угла, чтобы он не пересекал линию дуги. Иначе ваша линия может получиться «мятой».

3. Повторите то же самое с остальными точками. Если получившееся скругление вам не нравится, нажмите правой кнопкой мыши на нужную вам точку.

Как и у стандартных фигур в Figma, у вектора можно изменить цвет заливки и параметры обводки:

Любую стандартную фигуру в Figma — круг , квадрат , треугольник или многоугольник — можно редактировать как вектор. Чтобы это сделать, создайте фигуру и дважды кликните по ней правой кнопкой мыши:

Чтобы выйти из режима редактирования вектора, нажмите Done на панели инструментов. Если захотите что-то изменить, дважды кликните по вектору.

Видео:4 СПОСОБА ОБЪЕДИНЯТЬ В FIGMA. Соединяем элементы, слои, фреймы, фигуры, векторы, объекты в фигме.Скачать

Как нарисовать мяч для регби

Человеческий мозг запоминает только основные детали объектов, поэтому перед началом работы обязательно подыщите референс, чтобы ничего не выдумывать на ходу.

Мы будем рисовать мяч для регби, на фотографии вы сразу увидите его основные и второстепенные детали:

1. Создайте круг и растяните его по длине и высоте мяча, чтобы получился овал.

2. В режиме векторного редактора подгоните форму овала под мяч, чтобы они были похожи.

Видео: Виктор Засыпкин / Skillbox Media

1. Создайте круг и растяните его по основному шву, который пересекает его.

2. В режиме векторного редактора подгоните форму овала под шов.

3. Удалите фон, добавьте на вектор обводку и перенесите его на овал в форме мяча.

Видео: Виктор Засыпкин / Skillbox Media

1. Создайте квадрат и подгоните его размеры под форму дополнительного шва.

2. Удалите у фигуры фон, добавьте обводку и скруглите углы . В качестве эталона для скругления возьмите угол шва, который виден лучше всего. В нашем референсе — это левый нижний.

3. В режиме векторного редактора располагайте точки фигуры по направлению шва, а усами регулируйте скругление так, чтобы вектор повторял форму шва.

4. Этот шов не сплошной, а строчной. Укажите в настройках обводки пунктирный стиль. Чтобы это сделать, в блоке Stroke на панели инструментов нажмите и в появившемся меню в пункте Stroke Style укажите стиль Dash. Отрегулируйте настройки Dash (количество точек) и Gap (шаг), чтобы пунктир примерно напоминал шов настоящего мяча.

Видео: Виктор Засыпкин / Skillbox Media

1. Скопируйте основной овал, выделите его и укажите цвет заливки: белый.

2. Поместите белый овал на мяч и подгоните его под размер блика — он будет примерно на треть меньше основного овала.

3. Поместите блик на мяч. Скорее всего, он будет великоват, поэтому уменьшите его и подправьте ломаные углы с помощью усов.

Видео: Виктор Засыпкин / Skillbox Media

Левая белая полоска

Чтобы её сделать, воспользуйтесь хитростью с наложением слоёв:

1. Создайте круг и с помощью одной из его сторон повторите внешний левый край полоски.

2. Создайте ещё один круг и с его помощью повторите внутренний правый край полоски. Важно, чтобы этот круг в палитре слоёв находился ниже предыдущего.

3. В режиме векторного редактора подправьте оба круга, чтобы они точно повторяли изгибы полоски. Для удобства укажите непрозрачность кругов на 50%, чтобы видеть и сами фигуры, и контуры мяча.

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

5. Сделайте копию основной формы мяча и подложите её под полоску. Если она выходит за края фигуры, выделите и полоску, и форму мяча, затем на панели инструментов нажмите на иконку и в выпадающем списке выберите . В результате останется видимой только та часть, где ваши круги пересекаются.

6. Поместите получившуюся фигуру на мяч. Если она залезает на шов, его можно немного уменьшить.

Правая белая полоса

Правую полосу можно сделать так же, как и левую, либо нарисовать её самостоятельно с помощью инструмента :

Видео: Виктор Засыпкин / Skillbox Media

1. Белый шов повторяет форму основного. Возьмите поперечный шов, с зажатой клавишей Ctrl (⌘) выделите все точки снизу и удалите их. У вас должна получиться короткая линия длиной с поперечный шов.

2. Поместите линию на референс и, если нужно, сделайте её длиннее или короче в режиме векторного редактора.

3. Поместите вектор на нижний край шва и с помощью пера обведите и остальной контур шва.

4. С помощью пера повторите контуры всех стежков.

Видео: Виктор Засыпкин / Skillbox Media

В результате у вас получится примерно такой мяч:

Видео:КРИВЫЕ В FIGMA. Как перевести текст или фигуры в кривые | Уроки фигма на русскомСкачать

Основы Figma VII. Кривые

В седьмой части по основам Figma вы освоите работу с кривыми на продвинутом уровне. И хотя вы уже знакомы с булевыми операциями, которые позволяют создавать сложные векторные фигуры — это лишь верхушка айсберга. С помощью инструмента Pen (переводится как ручка или перо) можно воспроизвести буквально любую форму.

Зачем дизайнеру уметь работать с кривыми? Особенно пригодится в разработке собственных иконок, которые являются неотъемлемой частью любого интерфейса. Необязательно создавать пиктограммы с нуля, достаточно скачать подходящую заготовку и подправить/подогнать ее вручную под вашу задачу.

Во-вторых: отрисовка иллюстраций, к которым применимы те же приемы, единственное отличие: они обычно более сложны и выполняют другую функцию по сравнению с иконками (привлечение внимания).

Видео:Плагин Figma для перевода PNG в векторСкачать

Кривые Безье

Кривые Безье — это математический аппарат для описания кривых, который использовал Пьер Безье в 1960-х годах для проектирования дизайна кузовов автомобилей компании Renault.

Впоследствии это открытие сыграло ключевую роль в проектировании и компьютерной графике в 2d и 3d направлениях. Фигуры на основе кривых Безье называют по-разному, в зависимости от приложения, но суть не меняется. Вы можете встретить такие термины: сплайны (spline) и «пути» (path).

Видео:6 урок по Figma — Инструмент Перо и работа с вектором [Figma уроки]Скачать

Виды кривых

Все кривые Безье можно условно поделить на несколько видов в зависимости от количества точек, из которых они составлены, что и определяет их сложность (смотрите рисунок сверху слева направо):

• линейные
• квадратичные
• кубические
• высших порядков

Обычно в графических приложениях используются последовательности кубических кривых Безье для построения любых форм. С теорией разобрались, переходим к практической части.

Видео:РАСТР В ВЕКТОР FIGMA | jpeg to svgСкачать

Инструмент Pen в Figma

Для построения кривых в Figma используется специальный инструмент Pen (горячая клавиша P). Интересно, что с его помощью можно создать любой стандартный примитив (прямоугольник, круг и так далее). Более того, любой примитив можно быстро конвертировать в кривые. Но начнем мы с линейных кривых, особенность которых заключается в том, что контрольные точки не сглаживаются и итоговая фигура выглядит угловато.

Видео:Как изменить цвет png в Figma. 2 способа как поменять цвет картинки пнг в фигма.Скачать

Создание кривой

Последовательность действий для создания кривой выглядит так:

1. Выбираем Pen с помощью клавиши P или кликнув по иконке ручки на панели инструментов.
2. Кликаем в том месте, где хотим поставить первую точку. Обратите внимание, что верхняя панель мгновенно поменялась и теперь включает лишь 4 инструмента и кнопку «Done». Так Figma сигнализирует, что находится в режиме редактирования кривой.
3. Продолжаем кликать по рабочей области для задания новых точек. Как только у нас есть две точки, начинают появляться линии между ними.
4. Зажимаем клавишу Shift, чтобы временно ограничить угол наклона создаваемых линий и сделать их кратными 45 градусам. На практике это позволяет с легкостью рисовать идеальные горизонтальные, вертикальные и диагональные линии.
5. Чтобы указать последнюю точку фигуры есть несколько способов:
   • Нажать мышкой кнопку «Done» верхней панели.
   • Нажать Enter на клавиатуре.
   • Нажать Esc дважды. Первое нажатие заставит завершить создание кривой внутри векторного объекта. То есть вы можете продолжить кликать и создать еще одну линию в рамках одного слоя. Второе нажатие Esc заставит Figma выйти из режима редактирования.

Как видите, наша кривая получилась угловатой. Чтобы сгладить линию, вместо клика в процессе создания нужно зажать левую кнопку мыши и перемещать ее пока не получите нужную форму. Далее отпускаем левую кнопку мыши.

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

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

Видео:Адаптивные привязки в Фигме (Figma лайфхаки). Бесплатные нескучные урокиСкачать

Рисуем круг

Как я ранее упоминала, с помощью кривых можно нарисовать все что угодно. Знаю, что круг не самая сложная форма из возможных, но хорошее упражнение для новичка. К тому же, нам нужно попрактиковаться в построении сглаженных и замкнутых фигур. Чтобы упростить себе задачу, я нарисовала вспомогательную сетку. Дело в том, что при рисовании идеального круга, нужно отметить точки на одинаковом расстоянии и с идентичными степенями сглаживания. Приступим.

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

Видео:Масштабирование в Figma | Как менять размер объекта без проблемСкачать

Редактирование кривых

Как и в случае с примитивами, вы можете изменить пропорции векторных объектов просто выделив их и потянув за любой из углов или сторон. Но на этом возможности редактирования не заканчиваются, вы можете:

• Добавить еще линий
• Изменить или переместить точки
• Настроить кривизну
• Добавить заливку замкнутым контурам

Для начала нужно войти в режим редактирования:

Выделить векторный объект. Это может быть не только кривая, но и большинство примитивов: прямоугольник, эллипс, линия и так далее.

Далее один из вариантов ниже:

• Нажать клавишу Enter
• Сделать двойной клик по векторному объекту. В этом случае предварительно выделять не нужно. Пожалуй это самый простой способ.
• Кликнуть по левой иконке квадратика (Edit Object) сверху в центре.

После этого панель инструментов преобразится. Слева появятся новые кнопки для работы с инструментами редактирования сплайнов.

Видео:РАСТР В ВЕКТОР В FIGMA. Как перевести с плагином «Image Tracer» | Уроки фигма на русскомСкачать

Инструмент Move. Перемещение точек

Горячая клавиша V. Позволяет выделить и переместить одну или несколько точек векторного объекта мышкой. Тут работает зажатие клавиши Shift, как и при построении новой кривой. Также для перемещения точек можно использовать клавиатуру (клавиши с стрелками). Этот инструмент активируется по-умолчанию, когда вы переходите в режим редактирования.

Видео:Видео урок по Figma Как убрать функцию компонента с объектаСкачать

Инструмент Bend. Управление кривизной

Сначала активируем инструмент Bend (в переводе означает сгибать, что уже подсказывает назначение), кликнув по иконке закругленной линии с двумя точками (вторая справа) на панели инструментов. Для управления сглаживанием линии:

1. Подносим курсор к любой линии между двумя точками. В правом нижнем углу курсора появится иконка изогнутой линии.
2. Зажимаем левую кнопку мыши и тянем. Линия начнет повторять ваши движения, пытаясь подстроится под положение курсора. Если фигура была угловатой, то одновременно появятся направляющие точек, которые и задают кривизну.
3. Отпускаем левую кнопку мыши, чтобы зафиксировать кривизну.

Для управления сглаживанием через точку кривой:

1. Подносим курсор к любой точке кривой. В правом нижнем углу курсора появится иконка с точкой и двумя направляющими.
2. Зажимаем левую кнопку мыши и тянем. Из точки вытянется две симметричные направляющие, линии по бокам точки сгладятся. Чтобы управлять лишь одной направляющей, зажмите кнопку Alt. Чтобы включить привязку к углу наклона (кратная 45 градусам), зажмите кнопку Shift.
3. Отпускаем левую кнопку мыши, чтобы зафиксировать кривизну.

Ниже показаны все вышеперечисленные приемы, включая использование клавиш Shift и Alt:

Для управления сглаживанием через направляющие точки:

1. Подносим курсор к любой направляющей точки кривой. В правом нижнем углу курсора появится иконка с точкой и двумя направляющими.
2. При клике левой кнопкой мыши направляющая будет удалена.
3. Кликаем левой кнопкой мыши и тянем курсор, чтобы изменить угол направляющей вместе с противоположной направляющей, то есть симметрично. Если вы хотите изменить угол исключительно одной направляющей, зажмите клавишу Alt. Также тут работает зажатие клавиши Shift для привязки к углу наклона.

Часто случается, что направляющих не видно, но по форме линии видно, что они там есть. В таких случаях нужно переключиться на инструмент Move и выделить нужную точку. Появятся направляющие, после чего нужно переключиться назад в режим Bend.

Не самый удобный способ показать направляющие. Но есть решение. Достаточно постоянно работать в режиме Move, чтобы выбирать точки и показывать направляющие. А в режим Bend переходить с помощью горячей клавиши Ctrl или Command на MacOs. Обратите внимание, что горячую клавишу нужно зажать пока вы используете инструмент, так как сразу после отпускания клавиши вы вернетесь в режим Move.

Посмотрим, как это выглядят на практике. Обратите внимание, мы начинаем в режиме Bend, видны направляющие только двух точек. Далее переключаемся в режим Move, выделяем нужные точки и зажимаем Ctrl (Command на MacOs), чтобы быстро подправить направляющие точек или кривизну линий:

Видео:МАСШТАБ В FIGMA. Как увеличивать и уменьшать по умному. Горячие клавиши | Уроки фигма на русскомСкачать

Инструмент Paint Bucket. Заливка замкнутых контуров

Позволяет выборочно закрасить замкнутые контуры векторной фигуры. Настройки заливки доступны в секции Fill и полностью повторяют возможности обычных примитивов. Инструкция по использованию:

1. Выбираем инструмент кликнув по иконке капли или нажав горячую клавишу B.
2. Кликаем внутри замкнутого контура, чтобы закрасить область. К иконке капли добавится плюсик.
3. Повторно кликаем внутри закрашенного контура, чтобы убрать заливку.

Видео:Масштабирование интерфейса Figma (Фигма)Скачать

Настройка обводки

Мы уже знакомы с некоторыми настройками обводки из первого урока по Figma. Давайте теперь разберем и продвинутые опции:

• Выпадающие меню внизу слева и справа задают форму начальной и конечной точки контура. Конечно, если контур замкнутый, то мы ничего не заметим.
• По клику на иконку с тремя точками внизу справа можно получить доступ к продвинутым настройкам. Смотрите пункты ниже.
• Stroke style — стиль обводки: Solid — сплошная, Dashed — пунктирная. При выборе пунктирного стиля добавляются дополнительные параметры: Dash — длина пунктира, Gap — длина пропуска, Dash cap — форма пунктира.
• Join — форма соединения точек: Miter — автоматически скашивается если угол наклона меньше заданного полем Miter angle, Bevel — постоянно скошенная, Round — скругленная.

Видео:Фигма для новичков - из PNG в SVG или почему не стоит использовать плагин Image TracerСкачать

Скругление углов

Скруглить точки кривой можно, и альтернативным способом:

1. Выделите сплайн и перейдите в режим редактирования.
2. Выделите нужные точки.
3. Укажите степень скругления в поле Corner radius в панели свойств справа.

Заметьте, что такой способ скругления не влияет на направляющие точек и работает только с угловатыми контурами. Если вы задали кривизну линий с помощью инструмента Bend, то скругление не будет работать.

Видео:Как вырезать объект в Figma | Простое действие по удалению фонаСкачать

Добавление и удаление точек

Как я упоминала выше, добавить и удалить точки можно в любой момент. Предварительно войдя в режим редактирования, попробуйте следующее для копирования точки:

1. Выбираем инструмент Move (клавиша V).
2. Наводим курсор на точку, которую хотим скопировать.
3. Зажимаем кнопку Alt. Курсор изменится на двойной, как бы подсказывая нам, что готов к копированию точки.
4. Зажимаем левую кнопку мыши и перетаскиваем курсор. Новая точка последует за курсором. Обратите внимание, что образуется еще одна линия, так как оригинальная точка была связана линией с другой.

Для добавления точки внутри существующей линии:

1. Выбираем инструмент Pen (клавиша P).
2. Наводим курсор внутрь линии туда, куда собираемся добавить точку. Figma будет подсказывать нам середину линии. Также к курсору в правом нижнем углу добавится плюсик.
3. Делаем клик левой кнопкой мыши. Точка добавлена.

Для удаления точки:

1. Выбираем инструмент Pen (клавиша P).
2. Наводим курсор на точку, которую хотим удалить.
3. Зажимаем клавишу Alt. К курсору добавится минус в правом нижнем углу.
4. Делаем клик левой кнопкой мыши. Точка удалена.
5. Еще один хороший вариант: если выделить точку инструментом Move и удалить ее кнопкой Delete, то Figma не будет соединять соседние точки и может образоваться отдельный контур внутри слоя. Этот способ идеален если вы удаляете отдельные контуры, например, лишние элементы скачанной иконки, чтобы упростить ее.

Добавлять точки можно и вне существующих линий. В таком случае векторный объект будет состоять из нескольких контуров.

Видео:Как обрезать фигуру в ФИГМА │ 3 СПОСОБАСкачать

Преобразование обводки в кривые

На некоторых этапах работы, а особенно перед экспортом иконки в формат SVG может понадобиться преобразовать все линии в контуры. Другими словами конвертировать обводку в закрытые контуры с заливкой. Это нужно делать для того, чтобы иконки корректно отображались в браузере. После этой операции вы уже не сможете настроить толщину обводки или любые другие ее свойства кроме цвета. Поэтому выполняйте эту операцию в последнюю очередь. Чтобы конвертировать есть несколько способов:

• Выделите векторный объект и нажмите Ctrl + Shift + O или Shift + Command + O на MacOs.
• Вызовите контекстное меню нажав правой кнопкой мыши на нужном векторном объекте. Выберите команду Outline stroke.

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

Видео:#17 Дизайн Landing Page в Figma. Как сделать векторную иллюстрацию для главного экрана лендинга.Скачать

Сайты с бесплатными иконками

Теперь вы знаете большинство приемов работы с кривыми. Во втором уроке по работе с Figma вы узнали, как импортировать файл с помощью перетаскивания. Тогда мы использовали растровые файлы, но с векторными SVG-файлами все происходит точно также.

Существует множество сайтов с бесплатными SVG-иконками. Они удобны тем, что позволяют искать по ключевым словам. Тут нам не обойтись без знаний английского языка или Google Translate. А вот и наш список:

• The Noun Project — 3 000 000+ (да, более 3-х миллионов) бесплатных иконок с удобным поиском. Много готовых наборов по темам.
• Font Awesome — 1600+ бесплатных иконок в одном стиле с рубрикатором.
• Cursor.in — крошечный сайт с коллекцией всех курсоров MacOs.

Чтобы скачать иконку на The Noun Project, воспользуйтесь строкой поиска. Для примера я ввела ключевое слово energy и нажала Enter. Загрузится список иконок, по понравившейся нужно кликнуть. В открывшейся странице нужно нажать кнопку Get this icon. Далее выбираем Basic Download, потом Continue. Теперь нажимаем кнопку SVG. Иконка скачивается.

Видео:Как перевести в кривые в фигмеСкачать

Экспорт в SVG

Для экспорта иконки в SVG-файл ее нужно предварительно подготовить:

1. Создать пустой фрейм и вставить внутрь векторный объект. Их может быть несколько. Размеры фреймов для иконок обычно кратны 8 пикселям. Подойдут такие: 16×16, 24×24, 32×32 и так далее. Если иконка не влазит, уменьшаем ее.
2. Выровнять иконку по центру фрейма. Убедиться, что вертикальные и горизонтальные отступы равномерные.
3. Перевести все обводки в кривые.
4. Перекрасить все элементы в черный цвет. Дело в том, что разработчики умеют перекрашивать иконки, если нужно.

Теперь все готово. Осталось выполнить сам экспорт:

1. Выделяем фрейм с иконкой.
2. В правой панели кликаем по плюсику напротив секции Export (она последняя).
3. В выпадающем меню меняем формат на SVG.

Домашнее задание

1. Выберите 8 иконок и нарисуйте их с использованием инструмента Pen.
2. Задание повышенной сложности. Выполнять необязательно. Выберите 4 иконки, упростите их и сделайте обводку потолще.
3. Подготовьте все нарисованные иконки и экспортируйте их в две отдельные папки (light, regular — для толстых). Убедитесь, что иконки имеют понятные названия. Поместите две папки в zip-архив. Самостоятельно научитесь архивировать файлы, если не умеете.

Выводы

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

Придумывание и отрисовка иконок это очень широкая и сложная тема, которую мы еще не раз затронем в дальнейшем.