Чтобы в разы ускорить разработку - использование клавиатурных сокращений обязательно.

Найти все клавиатурные сокращения вы можете, нажав в левом нижнем углу на знак вопроса и, перейдя во вкладку “Keyboard Shortcuts”. Или вы можете использовать клавиатурное сокращение “Ctrl + Shift + ?”.

Горячие клавиши Figma часть 1

Ниже я привел скриншоты с разделами, а также с переводом.


Вкладка №1 (Основные параметры)

Горячие клавиши Figma часть 2
1 - Показать/Скрыть “Боковые панели”
2 - Инструмент “Пипетка”
3 - Поиск команд, опций в разделе “Меню”


Вкладка №2 (Инструменты)

Горячие клавиши Figma часть 3

Столбец №1:

1 - Стандартный инструмент выделения
2 - Инструмент создания фреймов
3 - Инструмент “Перо”
4 - Инструмент “Карандаш” (Как “Перо” только рисовать можно любые формы)

Столбец №2:

1 - Инструмент “Текст”
2 - Инструмент “Прямоугольник”
3 - Инстурмент “Элипс”
4 - Инструмент “Линия”
5 - Инструмент “Стрелка”

Столбец №3:

1 - Добавить или показать комментарии к текущему макету
2 - Инструмент “Пипетка”
3 - Инструмент “Нож” (Вырезает область в виде картинки)


Вкладка №3 (Просмотр):

Горячие клавиши Figma часть 4

Столбец №1:

1 - Показать/Скрыть “Линейки”
2 - Показать/Скрыть “Обводки всех элементов”
3 - Показать/Скрыть “Пиксельный просмотр”

Столбец №2:

1 - Показать/Скрыть “Сетку”
2 - Показать/Скрыть “Пиксельную сетку”

Столбец №3:

1 - Показать/Скрыть “Боковые панели”
2 - Показать/Скрыть “Курсоры других пользователей”
3 - Показать/Скрыть “Только слои”
4 - Показать/Скрыть “Только компоненты”
5 - Показать/Скрыть “Многопользовательская библиотека”


Вкладка №4 (Масштабирование):

Горячие клавиши Figma часть 5

Столбец №1:

1 - Перемещение по рабочему пространству
2 - Увеличение масштаба
3 - Уменьшение масштаба
4 - Включить отображение 1:1 к экрану

Столбец №2:

1 - Масштабировать все рабочее пространство
2 - Масштабировать выделенный элемент
3 - Масштабировать предыдущий фрейм
4 - Масштабировать следующий фрейм

Столбец №3:

1 - Предыдущая страница
2 - Следующая страница
3 - Предыдущий фрейм
4 - Следующий фрейм


Вкладка №5 (Инструмент “Текст”):

Горячие клавиши Figma часть 6

Столбец №1:

1 - Выделить жирным
2 - Выделить курсивом
3 - Подчеркнуть
4 - Вставить и сопоставить элемент

Столбец №2:

1 - Выровнять текст по левому краю
2 - Выровнять текст по центру
3 - Выровнять текст по правому краю
4 - Выровнять текст по ширине

Столбец №3:

1 - Изменение размера текста
2 - Изменение расстояния между символами
3 - Изменение расстояния между строками


Вкладка №6 (Векторные изображения):

Горячие клавиши Figma часть 7

Столбец №1:

1 - Перо
2 - Карандаш
3 - Заливка

Столбец №2:

1 - Удалить заливку
2 - Удалить обводку
3 - Поменять местами обводку и заливку
4 - Преобразовать в кривые
5 - Также преобразование в кривые (но функция отличается, я ей не пользуюсь)

Столбец №3:

Работа с точками векторных изображений (Эти функции я не использую)



Вкладка №7 (Выделение):

Горячие клавиши Figma часть 8

Столбец №1:

1 - Выделить все
2 - Выделить все, кроме…
3 - Отменить выделение
4 - Выделение слоев, которые находятся под другими слоями
5 - Выделение слоя на боковой панели

Столбец №2:

1 - Выделить дочерний элемент
2 - Выделить родительский элемент
3 - Выделить следующий по порядку элемент
4 - Выделить предыдущий по порядку элемент

Столбец №3:

1 - Сгруппировать элементы
2 - Разгруппировать элементы
3 - Преобразовать в фрейм
4 - Показать/Скрыть элемент
5 - Заблокировать/Разблокировать элемент


Вкладка №8 (Курсор):

Горячие клавиши Figma часть 9

Столбец №1:

1 - Выделение элемент при клике
2 - Копирование элемент при движении

Столбец №2:

1 - Выделение слоев, которые находятся под другими слоями
2 - Показывается иерархия выделенного элемента

Столбец №3:

1 - Изменение размера относительно центра элемента
2 - Изменение размер пропорционально
3 - Перемещение во время изменения размеров элемента


Вкладка №9 (Редактирование):

Горячие клавиши Figma часть 10

Столбец №1:

1 - Копировать
2 - Вырезать
3 - Вставить
4 - Вставить поверх выделенного элемента

Столбец №2:

1 - Создание копии
2 - Переименование
3 - Экспорт элемента

Столбец №3:

1 - Копировать свойства элемента
2 - Вставить скопированные свойства


Вкладка №10 (Трансформирование):

Горячие клавиши Figma часть 11

Столбец №1:

1 - Отразить по горизонтали
2 - Отразить по вертикали
3 - Создать маску

Столбец №2:

1 - Включить редактирование векторных объектов или изображений
2 - Вставить изображение
3 - Обрезать изображение

Столбец №3:

1 - Задать прозрачность элементу - 10%
2 - 50%
3 - 100%


Вкладка №11 (Выравнивание):

Горячие клавиши Figma часть 12

Столбец №1:

1 - Переместить на 1 уровень ближе к переднему плану
2 - Переместить на 1 уровень дальше от переднего плана
3 - Переместить на передний план
4 - Переместить на задний план

Столбец №2:

1 - Выровнять по левой стороне
2 - Выровнять по правой стороне
3 - Выровнять по верхней стороне
4 - Выровнять по нижней стороне

Столбец №3:

1 - Выровнять согласно горизонтальной линии элементов
2 - Выровнять согласно вертикальной линии элементов
3 - Не пользуюсь функцией
4 - Выравнивание с распределением горизонтального пространства
5 - Выравнивание с распределением вертикального пространства

Вкладка №12 (Компоненты):

Горячие клавиши Figma часть 13
1 - Показать все компоненты
2 - Создать компонент
3 - Преобразовать компонент в фрейм
4 - Многопользовательская библиотека

Также очень важный вопрос: как отменить действие в фигма? Для того чтобы отменить действие в Figma - нужно всего лишь нажать клавиатурное сокращение "Ctrl + Z". И в зависимости от количества нажатий, вы отмените предыдущие действия.

Важно! Когда вы изучили все клавиатурные сокращения в Figma - рекомендую для закрепления отработать их на реальных макетах. По этой и этой ссылкам вы можете найти готовые макеты для оттачивания своих навыков.