Как нарисовать иллюстрацию в Sketch, используя только прямоугольник, круг и кривую

Я нарисовал 18 известных роботов для Chato.ps (один из продуктов нашей компании), и множество людей спрашивало меня, как можно нарисовать иллюстрацию в Sketch, сложно ли это? Вообще-то, не очень, а точнее очень просто и быстро. В этом уроке я вам все покажу.

Итак, рисуем иллюстрацию в Sketch

Вам нужно только использовать инструмент ручки (Pen), чтобы добавить множество векторных точек и настраивать кривые. И вам не нужно использовать мышку, чтобы бродить по меню Sketch для поиска всех нужных функций, потому что 98% таких функций управляется через горячие клавиши. Я разделил робота на несколько частей, после их создания нужно просто правильно разместить все фрагменты, и все. Вот моя пошаговая инструкция:

1. Нажмите R и удерживайте SHIFT, чтобы создать новый прямоугольник. B, чтобы спрятать границу.
2. ENTER – перейти в режим редактирования Удерживайте CMD, чтобы поместить ручку на верхний контур. Вам покажется точка посередине нажмите на нее, чтобы добавить срединную точку.

1. Выделите верхние 2 точки. Нажмите DELETE, чтобы удалить их.
2. Удерживайте SHIFT и нажмите на контрольную точку, чтобы удлинить ее.

1. Нажмите О, чтобы нарисовать овал. Измените цвет и размер.
2. Нажмите R, чтобы нарисовать прямоугольник. Измените цвет и размер.

1. Добавьте радиус для углов.
2. CMD + D скопируйте прямоугольник. Измените цвет, размер и радиус.

1. CMD + D скопируйте прямоугольник. Измените цвет, размер и радиус. OPTION + CMD + DOWN разместите его сзади.
2. О создайте овал. Измените цвет и размер. OPTION + CMD + DOWN разместите его сзади. CMD + D скопируйте овал. SHIFT + RIGHT передвиньте вправо.

1. R создайте прямоугольник. Измените цвет и размер. Выделите его вместе с фигурой головы. CMD + G сгруппируйте их.
2. Выделите фигуру головы. CONTROL + CMD + M использовать ее как маску. OPTION + CMD + DOWN поместите ее назад.

1. О нарисуйте овал.
2. CMD + D скопируйте овал. Удерживайте CONTROL и измените размер.
3. CMD + D скопируйте овал и поверните на 90'.

1. Выделите все. F скрыть заливку. Увеличьте толщину границы.
2. R нарисуйте прямоугольник. B скройте границы.
3. SHIFT + CMD + T сузьте верх прямоугольника. Выделите все. Создайте из выделения символ.

1. CMD + D скопируйте символ.
2. Поверните на 45'.
3. CMD + D скопируйте. Разверните по горизонтали.

1. Выделите прямоугольник, сделанный раньше. CMD+D скопируйте его. Измените цвет и размер.
2. ENTER перейдите в режим редактирования. Выделите две верхние точки. Увеличьте размер углов.

Соедините все элементы. CMD + G сгруппируйте.

1. R нарисуйте прямоугольник. B скройте границы.
2. ENTER перейдите в режим редактирования. Выделите две верхние точки. Увеличьте углы.
3. CMD+D скопируйте его. Разверните по вертикали и измените цвет. Выделите все. Создайте символ.

1. О нарисуйте овал. B скройте границы.
2. R нарисуйте прямоугольник. B скройте границы.
3. Увеличьте радиус границы прямоугольника. Выделите все. Выровняйте по центру. Создайте символ.
4. CMD+D скопируйте его. Поверните на 90'.

Соедините все элементы. CMD + G сгруппируйте.

1. О нарисуйте овал.
2. CMD+D скопируйте его. SHIFT + OPTION измените размер.
3. Выделите все. SHIFT + OPTION + S скомбинируйте их в режим вычитания.
4. R нарисуйте прямоугольник.

1. Выделите все. CMD + Option + U скомбинируйте их в режим объединения.
2. B скройте границы.
3. R нарисуйте прямоугольник. B скройте границы. Выделите все. Создайте символ.
4. CMD+D скопируйте его. Поверните на 90'.

1. О нарисуйте овал. B скройте границы.
2. L создайте линию. Выделите все. Выровняйте по центру.
3. Выделите линию. ENTER перейдите в режим редактирования. Выделите верхнюю точку. SHIFT + влево передвиньте точку немного влево.

1. Выделите линию. CONTROL + C захватите цвет овала. Увеличьте толщину границы. Перейдите в настройки границы. Измените края на закругленные.
2. Выделите линию. CMD+D скопируйте ее. Разверните по горизонтали. Выделите все. Создайте символ.
3. CMD+D скопируйте его. Поверните на 90'.

1. R нарисуйте прямоугольник. B скройте границы. Увеличьте радиус границ.
2. CMD+D скопируйте ее. Измените цвет и размер.
3. О нарисуйте овал. B скройте границы. Измените цвет. Выделите все. Выровняйте по горизонтали. Создайте символ.

1. О нарисуйте овал. B скройте границы.
2. С помощью Ножниц отрежьте правый контур.
3. CMD+D скопируйте половинку. Разверните по горизонтали.

Скомпонуйте все элементы. CMD + G сгруппируйте.

1. О нарисуйте овал. F скройте заливку. Измените цвет.
2. Измените форму.
3. CMD+D скопируйте 4 раза. Увеличьте толщину границ.
4. CMD+D скопируйте 4 раза. Выделите верхний овал. Измените цвет. Увеличьте толщину границы.

1. L создайте линию посередине. OPTION + CMD + DOWN поместите линию на задний план.
2. Выделите один голубой овал. OPTION + CMD + C скопируйте стиль. Выделите линию. OPTION + CMD + V вставьте стиль.
3. CMD+D скопируйте ранее созданный прямоугольник. OPTION + CMD + DOWN поместите его на задний план. Выделите все. CMD + G сгруппируйте.
4. Выделите прямоугольник. OPTION + CMD + M используйте как маску.

Выделите прямоугольник-маску. F скройте заливку. Вот и все! Перевод статьи medium.com автора Yuki_erqiudao.