0 added
0 removed
Original
2026-01-01
Modified
2026-02-21
1
<p><a>#Руководства</a></p>
1
<p><a>#Руководства</a></p>
2
<ul><li>24 сен 2021</li>
2
<ul><li>24 сен 2021</li>
3
<li>0</li>
3
<li>0</li>
4
</ul><p>Рассказываем, как изменить все одинаковые объекты на макете, за секунду найти нужный плагин и вдвое быстрее рисовать симметричные иконки.</p>
4
</ul><p>Рассказываем, как изменить все одинаковые объекты на макете, за секунду найти нужный плагин и вдвое быстрее рисовать симметричные иконки.</p>
5
<p>OlyaSnow для Skillbox Media</p>
5
<p>OlyaSnow для Skillbox Media</p>
6
<p>Редактор. Пишет про дизайн, редактирует книги, шутит шутки, смотрит аниме.</p>
6
<p>Редактор. Пишет про дизайн, редактирует книги, шутит шутки, смотрит аниме.</p>
7
<p>В Figma есть множество скрытых функций и горячих клавиш, которые самостоятельно найти не так просто. Но если их освоить, вы сможете ускорить работу над макетом: быстрее менять непрозрачность или добавлять линии только с одной стороны объекта.</p>
7
<p>В Figma есть множество скрытых функций и горячих клавиш, которые самостоятельно найти не так просто. Но если их освоить, вы сможете ускорить работу над макетом: быстрее менять непрозрачность или добавлять линии только с одной стороны объекта.</p>
8
<p>Рассказываем о пяти простых лайфхаках, которые помогут вам быстрее работать в Figma.</p>
8
<p>Рассказываем о пяти простых лайфхаках, которые помогут вам быстрее работать в Figma.</p>
9
<p>Если вы не пользуетесь горячими клавишами в Figma, то, скорее всего, меняете непрозрачность слоёв примерно так: выделяете нужный объект, переводите курсор на панель настроек и в блоке Fill меняете непрозрачность. Это всё очень долго.</p>
9
<p>Если вы не пользуетесь горячими клавишами в Figma, то, скорее всего, меняете непрозрачность слоёв примерно так: выделяете нужный объект, переводите курсор на панель настроек и в блоке Fill меняете непрозрачность. Это всё очень долго.</p>
10
<p>Чтобы не терять целую минуту на такое простое действие, пользуйтесь клавишами с цифрами от 1 до 0. Цифра 1 - 10% непрозрачности, 2 - 20% и так далее. Чтобы задать точное значение, быстро нажмите две любые цифры. Например, если нажать на 4 и 9, то непрозрачность слоя будет 49%.</p>
10
<p>Чтобы не терять целую минуту на такое простое действие, пользуйтесь клавишами с цифрами от 1 до 0. Цифра 1 - 10% непрозрачности, 2 - 20% и так далее. Чтобы задать точное значение, быстро нажмите две любые цифры. Например, если нажать на 4 и 9, то непрозрачность слоя будет 49%.</p>
11
<p>Кстати, то же самое работает и в Photoshop.</p>
11
<p>Кстати, то же самое работает и в Photoshop.</p>
12
Изображение: Skillbox Media<p>Если у вас установлено уже очень много плагинов и найти нужный в стандартном меню стало невозможно, воспользуйтесь внутренним поиском в Figma. Для этого нажмите на Ctrl (⌘) + P - откроется поисковая строка, которая ищет не только установленные плагины, но и стандартные функции редактора.</p>
12
Изображение: Skillbox Media<p>Если у вас установлено уже очень много плагинов и найти нужный в стандартном меню стало невозможно, воспользуйтесь внутренним поиском в Figma. Для этого нажмите на Ctrl (⌘) + P - откроется поисковая строка, которая ищет не только установленные плагины, но и стандартные функции редактора.</p>
13
Изображение: Skillbox Media<p>Если макет готов уже наполовину, а вы вдруг поняли, что не используете стили, это можно быстро исправить. Для этого нажмите на иконку и в выпадающем меню перейдите в пункт Edit → Select all with same. Вы можете искать объекты с одинаковыми шрифтами, соотношениями сторон, параметрами заливки.</p>
13
Изображение: Skillbox Media<p>Если макет готов уже наполовину, а вы вдруг поняли, что не используете стили, это можно быстро исправить. Для этого нажмите на иконку и в выпадающем меню перейдите в пункт Edit → Select all with same. Вы можете искать объекты с одинаковыми шрифтами, соотношениями сторон, параметрами заливки.</p>
14
<p>В зависимости от выбранного параметра Figma выделит вам все элементы, в которых они одинаковые.</p>
14
<p>В зависимости от выбранного параметра Figma выделит вам все элементы, в которых они одинаковые.</p>
15
Изображение: Skillbox Media<p>К сожалению, в Figma нет опции "добавить линию только с одной стороны объекта". Но зато вы можете сделать это самостоятельно с помощью теней!</p>
15
Изображение: Skillbox Media<p>К сожалению, в Figma нет опции "добавить линию только с одной стороны объекта". Но зато вы можете сделать это самостоятельно с помощью теней!</p>
16
<p><strong>Как добавить линию только с одной стороны</strong></p>
16
<p><strong>Как добавить линию только с одной стороны</strong></p>
17
<ul><li>Выберите нужный объект на макете.</li>
17
<ul><li>Выберите нужный объект на макете.</li>
18
<li>На панели настроек в блоке Effects нажмите на плюсик.</li>
18
<li>На панели настроек в блоке Effects нажмите на плюсик.</li>
19
<li>В появившемся пункте Drop shadow нажмите на иконку и укажите у Blur значение 0.</li>
19
<li>В появившемся пункте Drop shadow нажмите на иконку и укажите у Blur значение 0.</li>
20
</ul><p>Положение линии регулируется с помощью значений X и Y:</p>
20
</ul><p>Положение линии регулируется с помощью значений X и Y:</p>
21
<ul><li>X: 0, Y: -1 - снизу.</li>
21
<ul><li>X: 0, Y: -1 - снизу.</li>
22
<li>X: 0, Y: 1 - сверху.</li>
22
<li>X: 0, Y: 1 - сверху.</li>
23
<li>X: 1, Y: 0 - справа.</li>
23
<li>X: 1, Y: 0 - справа.</li>
24
<li>X: -1, Y: 0 - слева.</li>
24
<li>X: -1, Y: 0 - слева.</li>
25
</ul>Изображение: Skillbox Media<p>Наверняка у вас бывало так, что при рисовании симметричной иконки с одной из половин постоянно есть проблемы: то линии кажутся мятыми, то точки стоят на разных уровнях. С помощью компонентов вы можете нарисовать лишь половину иконки, а вторую часть просто скопировать и поставить рядом.</p>
25
</ul>Изображение: Skillbox Media<p>Наверняка у вас бывало так, что при рисовании симметричной иконки с одной из половин постоянно есть проблемы: то линии кажутся мятыми, то точки стоят на разных уровнях. С помощью компонентов вы можете нарисовать лишь половину иконки, а вторую часть просто скопировать и поставить рядом.</p>
26
<p><strong>Как рисовать симметричные иконки с помощью компонентов</strong></p>
26
<p><strong>Как рисовать симметричные иконки с помощью компонентов</strong></p>
27
<ul><li>Нарисуйте любой вектор с помощью инструмента .</li>
27
<ul><li>Нарисуйте любой вектор с помощью инструмента .</li>
28
<li>Сделайте из него компонент Ctrl (⌘) + Alt (⌥) + K.</li>
28
<li>Сделайте из него компонент Ctrl (⌘) + Alt (⌥) + K.</li>
29
<li>Скопируйте ваш компонент и нажмите Ctrl (⌘) + H, чтобы зеркально отразить его.</li>
29
<li>Скопируйте ваш компонент и нажмите Ctrl (⌘) + H, чтобы зеркально отразить его.</li>
30
<li>Поставьте оба компонента рядом.</li>
30
<li>Поставьте оба компонента рядом.</li>
31
</ul><p>Теперь все изменения вашего оригинального компонента будут автоматически применяться к его копии.</p>
31
</ul><p>Теперь все изменения вашего оригинального компонента будут автоматически применяться к его копии.</p>
32
Изображение: Skillbox Media<p><a>Самоучитель по Figma</a></p>
32
Изображение: Skillbox Media<p><a>Самоучитель по Figma</a></p>
33
<p>Самые полные и полезные инструкции, которые помогут вам освоить все функции графического редактора.</p>
33
<p>Самые полные и полезные инструкции, которые помогут вам освоить все функции графического редактора.</p>
34
<a>Научитесь: Figma с нуля до PRO Узнать больше</a>
34
<a>Научитесь: Figma с нуля до PRO Узнать больше</a>