Figma горячие клавиши windows
Обновлено: 04.07.2024
3… 2… 1! Вот полный список самых последних и самых удобных комбинаций клавиш и техник Figma. Они сэкономят ваше время и сделают ваш рабочий процесс в Figma максимально комфортным.
Дублирование слоев
Чтобы дублировать слой, выберите необходимый, и перетащите с зажатой клавишей Option. Чтобы сделать еще больше копий вы можете использовать Cmd + D.
Наименования слоев по умолчанию
Просто удалите старое имя слоя и нажмите Return, если вам нужно сбросить наименование текстовых слоев, и имя будет скопировано с текстового поля.
Необычные круги
99% практики, реальные задачи от крупных компаний страны и шанс попасть на работу мечты.Нарисуйте круг и используйте инструмент Arc, чтобы превратить его в какой-нибудь крутой график.
Применение непрозрачности
Чтобы изменить значения непрозрачности для любого выбранного объекта, используйте цифры на клавиатуре. Для еще большей точности быстро нажмите две цифры.
Как копировать стиль
Чтобы скопировать стиль выбранного элемента, используйте Command + Shift + C, а затем Command + Shift + V, чтобы вставить его в другой объект.
Как копировать выбранные свойства
Все точно также, как и со стилями. Просто выделите необходимые свойства на панели (можно выбрать несколько свойств ) и скопируйте их с помощью Cmd + C, а затем вставьте другой объект с помощью Cmd + V.
Сверхбыстрое изменение
Наведите курсор на любое значение на панели «Свойства», зажмите и перетаскивайте – значения будут плавно изменяться.
Умное выделение
Одновременно выберите несколько элементов и чтобы отрегулировать расстояние используйте линии между ними. Кроме того, чтобы изменить положение элементов, вы можете нажать на кружок в центре объекта и перетащить его.
Перемещение выделения
Сделайте рамку выделения кликом мыши и не отпуская ее нажмите и удерживайте клавишу пробела, потом просто перетащите выделение в любое место.
Производительность Figma
В меню (доступ к нему с помощью Cmd + /), найдите «Использование ресурсов» и посмотрите состояние ресурсов, используемых Figma.
Сочетания клавиш
Поиграем с комбинациями клавиш! Введите Ctrl + Shift +? и посмотрите, какие комбинации вы недавно использовали.
Наложения в прототипах
Для плавного, мягкого эффекта создайте модальное окно в виде отдельного фрейма, свяжите его с другим фреймом и установите в свойствах прототипа значение «Наложение».
Позиционирование оверлеев
Когда вы выбираете для «Overlay» «Пользовательский» режим наложения, вы можете легко перетащить его в любое место. Если вы наведите курсор мыши за пределы этого поля, сохраняя при этом выделение, вы можете использовать стрелки клавиатуры для большей точности изменений.
Состояния оверлеев
Чтобы установить несколько состояний для оверлеев, создайте несколько версий Overlay и добавьте взаимодействия между ними. Убедитесь, что вы установили свойство Swap для выбранного перехода, чтобы состояния заменяли друг друга.
Невидимые цели
Чтобы создать цель для ваших прототипов, нарисуйте прямоугольник и уменьшите его непрозрачность до 0%, или просто нажмите 0 на клавиатуре.
Специальные действия и триггеры
Вы можете использовать разные триггеры для переходов ваших прототипов, а также специальные действия, такие как возврат к предыдущему экрану или закрытие наложения.
Значение шага смещения
Найдите «Смещение» в меню (Cmd + /) и отрегулируйте большое и малое смещение для большей точности, управляя стрелками на клавиатуре. Большой сдвиг – стрелки клавиатуры + Shift, и вы можете установить его на 8 пикселей, если вы работаете с сеткой 8 пикселей.
Выбор заблокированных слоев
Чтобы получить доступ к заблокированным слоям, просто нажмите Ctrl + клик правой кнопкой мыши. Вуаля!
Пакетная разблокировка/отображение объектов
Найдите в Figma Menu (Command + /) «Unlock» или «Unhide» и вы получите параметр, который будет выполнять эту операцию за вас.
Пакетный импорт изображений
Нажмите Cmd + Shift + K чтобы открылось меню импорта изображений, а затем выберите несколько изображений. Тогда вы сможете нажимать на отдельные фигуры, чтобы заполнить их изображениями.
Импорт изображений и GIF
Чтобы заполнить форму изображением, перетащите изображение или gif файл на слой «Заливка» на панели «Свойства». Если вы используете GIF-файлы, нажмите на миниатюру, и вы сможете настроить кадр. Когда вы откроете файл, GIF будет работать.
Советы по копированию и вставке
Чтобы вставить другую фигуру в верх определенного слоя, используйте комбинацию Cmd + C, а затем Cmd + Shift + V.
Выбор с помощью клавиатуры
Вы можете использовать Return для редактирования векторных фигур, но также Return полезен для навигации в структуре группы. Вы можете выбрать группу и нажать Return, чтобы войти в нее.
Регулировка цветовых значений
Откройте настройки цвета и чтобы изменить его значения, просто нажимайте стрелки клавиатуры вверх / вниз. Работайте быстрее используя Shift.
Вставка значений из CSS
Выберите любой код из CSS, который содержит значения цвета, независимо от того, является ли он rgba, hex или hsla, и вставьте его в шестнадцатеричное поле в Figma – он автоматически установит нужное значение.
Изменение цвета в режиме реального времени
Если вы хотите предварительно просмотреть окончательный цвет, который вы применяете для объекта. Кликните на превью пипеткой (круг в правом верхнем углу) и зажмите правую кнопку мышки. Теперь, при перемещении мыши, цвет будет автоматически меняться.
Изменение свойств текста
Чтобы изменить свойства текстового поля, дважды щелкните на границе текстового фрейма.
Пакетное изменение шрифта
Найдите пункт «Выбрать все одинаковые шрифты» в меню, а затем измените его свойства на панели.
Отрегулируйте параметры “hue” и “alpha” с помощью прокрутки
Когда вы находитесь внутри палитры цветов, используйте прокрутку мыши, чтобы настроить оттенок, или удерживайте параметр Option, чтобы соответствующим образом изменить параметры альфа.
Создание нескольких компонентов
Вы можете создать несколько компонентов одновременно – просто выберите несколько объектов и перейдите к маленькой иконке шеврона в верхней части. В появившемся списке выберите вариант создания нескольких компонентов.
Префиксные слои
Используйте диалоговое окно Rename Layer для добавления префиксов к выбранным элементам.
Замена компонентов
Если вы называете Компонент с префиксом, вы можете легко поменять Компоненты с теми же префиксами, щелкнув правой кнопкой мыши на одном из экземпляров и выбрав в меню опцию «Обмен».
Поиск основного компонента
Чтобы перейти к главному компоненту, выберите экземпляр и выберите ссылку «Go to Master Component» на панели «Свойств».
Предварительный просмотр объекта
Если вы хотите добавить фон в предварительный просмотр компонента на панели «Ресурсы», просто используйте прямоугольник с черным фоном в качестве хоста для компонента.
Создавайте миниатюры в Figma
Если вы хотите, чтобы ваша главная страница в Figma была более чистой, то на первой странице документа используйте фрейм, который появится в виде эскиза. Поместите остальные части дизайна на вторую страницу.
Расширенное переименование слоев
Используйте Cmd + R после выбора слоев, которые вы хотите переименовать. Также постарайтесь использовать постоянные выражения для лучшего соответствия слоев и переименования.
Удаление частей наименований слоев
Используйте то же самое окно Layer Rename, чтобы удалить общие части наименований слоев. Например, если вы хотите удалить один сегмент между слешами, чтобы лучше организовать слои.
Поиск слоев на холсте
Если вы хотите быстро найти слой на холсте – поищите его на панели слоев и дважды щелкните на миниатюру слоя. Тааадааам! Все просто.
Группировка цветовых стилей
Подобно именам слоев, которые вы можете сгруппировать, вы можете использовать тот же метод для группировки цветов внутри цветовых стилей.
Добавление описаний к компонентам
Вы можете легко добавить описание к любому компоненту. Просто убедитесь, что вы выбрали основной компонент, и тогда вы сможете изменить его описание в свойствах. Во время передачи исходников комментарии будут отображаться как комментарии в CSS, так что это простой способ добавить заметки для разработчиков в компонент.
Сохранение файлов с описанием
Если вы хотите сохранить файл с дополнительным описанием в истории редакций, просто используйте сочетание клавиш Cmd + Shift + S.
Совместное использование определенной версии документа
Вы можете получить доступ к истории версий в Figma, а затем выбрать любую из них. Кликнув правой кнопкой мыши вы можете поделиться нужной версией в виде ссылки.
Обмен ссылками из Figma
Если вы хотите быстро поделиться ссылкой на документ из десктопного приложения, щелкните правой кнопкой мыши по имени документа и выберите параметр «Копировать ссылку».
Открытие файлов из буфера обмена
Если у вас есть ссылка на файл Figma, и вы хотите открыть ее прямо в десктоп приложении, просто выберите «Файл» → «Открыть URL из буфера обмена».
Вот и все, ребята! … по крайней мере пока что?
Я буду постоянно обновлять эту статью, поэтому не забудьте оставить комментарий или просто добавьте ее в закладки!
У Figma есть все возможности для того, чтобы дизайнеры справлялись с работой максимально быстро и легко. Рассказываем, какие хоткеи есть и как их использовать.
Горячие клавиши (hotkeys) — это комбинации клавиш, нажатие на которые позволяет выполнять различные действия в той или иной программе, не прибегая к её меню. Это быстро и просто.
В Figma горячие клавиши называются Keyboard Shortcuts, а посмотреть весь их список можно, нажав на знак вопроса в правом нижнем углу.
Или используйте для открытия списка сочетание горячих клавиш Ctrl + Shift + ?. Да, они могут пригодиться даже здесь.
Весь список горячих клавиш поделён на несколько групп. Расскажем о каждой по порядку.
Essential keyboard shortcuts
Essential keyboard shortcuts — это Основные клавиатурные сокращения.
Чтобы показать или скрыть Боковые панели, нажмите Ctrl + \ на Windows и ⌘ + \ на Mac.
Чтобы выбрать инструмент Пипетка, нажмите i на Windows и Ctrl + С на Mac.
Чтобы открыть Меню, нажмите Ctrl + / на Windows и ⌘ + / на Mac.
Tools
Tools — это Инструменты.
Чтобы выбрать стандартный инструмент выделения, нажмите V.
Чтобы выбрать инструмент для создания фреймов, нажмите F.
Чтобы выбрать Перо, нажмите P.
Чтобы выбрать Карандаш, нажмите Shift + P.
Чтобы выбрать Текст, нажмите T.
Чтобы выбрать Прямоугольник, нажмите R.
Чтобы выбрать Эллипс, нажмите O.
Чтобы выбрать Линию, нажмите L.
Чтобы выбрать Стрелку, нажмите Shift + L.
Чтобы добавить или показать комментарии, нажмите С.
Чтобы выбрать Пипетку, нажмите i на Windows и Ctrl + С на Mac.
Чтобы выбрать Нож, нажмите S.
Чтобы показать или скрыть Линейки, нажмите Shift + R.
Чтобы показать или скрыть Обводку всех элементов, нажмите Ctrl + Shift + 3 на Windows и ⌘ + Y на Mac.
Чтобы показать или скрыть Пиксельный просмотр, нажмите Ctrl + Alt + Y на Windows и Ctrl + P на Mac.
Чтобы показать или скрыть Сетку, нажмите Ctrl + Shift + 4 на Windows и Ctrl + G на Mac.
Чтобы показать или скрыть Пиксельную сетку, нажмите Ctrl + ‘ на Windows и ⌘ + ‘ на Mac.
Чтобы показать или скрыть Боковые панели, нажмите Ctrl + \ на Windows и ⌘ + \ на Mac.
Чтобы показать или скрыть Курсоры других пользователей, нажмите Ctrl + Alt + \ на Windows и Alt + ⌘ + \ на Mac.
Чтобы показать или скрыть Только слои, нажмите Alt + 1.
Чтобы показать или скрыть Только компоненты, нажмите Alt + 2.
Чтобы показать или скрыть Панель дизайна, нажмите Alt + 8.
Чтобы показать или скрыть Панель прототипа, нажмите Alt + 9.
Zoom — это Приближение или Масштабирование.
Чтобы переместить Zoom по рабочему пространству, нажмите Space + drag.
Чтобы увеличить масштаб, нажмите +.
Чтобы уменьшить масштаб, нажмите -.
Чтобы включить отображение 1:1 к экрану, нажмите Shift + 0.
Чтобы масштабировать все рабочее пространство, нажмите Shift + 1.
Чтобы масштабировать выделенный элемент, нажмите Shift + 2.
Чтобы масштабировать предыдущий фрейм, нажмите Shift + N.
Чтобы масштабировать следующий фрейм, нажмите N.
Чтобы найти предыдущую страницу, нажмите Page Up.
Чтобы найти следующую страницу, нажмите Page Down.
Чтобы найти предыдущий фрейм, нажмите Home.
Чтобы найти следующий фрейм, нажмите End.
Text — это Текст.
Чтобы выделить текст жирным, нажмите Ctrl + B на Windows и ⌘ + B на Mac.
Чтобы выделить текст курсивом, нажмите Ctrl + i и ⌘ + i на Mac.
Чтобы подчеркнуть текст, нажмите Ctrl + U и ⌘ + U на Mac.
Чтобы вставить и сопоставить элемент, нажмите Ctrl + Shift + V.
Чтобы выровнять текст по левому краю, нажмите Ctrl + Alt + L на Windows и ⌘ + Alt + L на Mac.
Чтобы выровнять текст по центру, нажмите Ctrl + Alt + T на Windows и ⌘ + Alt + T на Mac.
Чтобы выровнять текст по правому краю, нажмите Ctrl + Alt + R на Windows и ⌘ + Alt + R на Mac.
Чтобы выровнять текст по ширине, нажмите Ctrl + Alt + J на Windows и ⌘ + Alt + J на Mac.
Чтобы изменить размера текста, нажмите Ctrl + Shift + < и > на Windows и ⌘ + Shift + < и > на Mac.
Чтобы изменить расстояние между символами, нажмите Alt + < и >.
Чтобы изменить расстояние между строками, нажмите Alt + Shift + < и >.
Shape
Shape — это Векторные изображения.
Чтобы выбрать Перо, нажмите P.
Чтобы выбрать Карандаш, нажмите Shift + P.
Чтобы выбрать Заливку, нажмите B.
Чтобы удалить заливку, нажмите Alt + /.
Чтобы удалить обводку, нажмите /.
Чтобы поменять местами обводку и заливку, нажмите Shift + X.
Чтобы преобразовать в кривые, нажмите Ctrl + Shift + O на Windows и ⌘ + Shift + O на Mac.
Чтобы работать с точками векторных изображений, нажмите Ctrl + E на Windows и ⌘ + E на Mac.
Selection
Selection — это Выделение.
Чтобы выделить всё, нажмите Ctrl + A на Windows и ⌘ + A на Mac.
Чтобы выделить всё, кроме чего-либо, нажмите Ctrl + Shift + A на Windows и ⌘ + Shift + A на Mac.
Чтобы отменить выделение, нажмите Esc.
Чтобы выделить слои, которые находятся под другими слоями, нажмите Ctrl + click Windows и ⌘ + click на Mac.
Чтобы выделить слой на боковой панели, нажмите Ctrl + right click Windows и ⌘ + right click на Mac.
Чтобы выделить дочерний элемент, нажмите Enter.
Чтобы выделить родительский элемент, нажмите Shift + Enter.
Чтобы выделить следующий по порядку элемент, нажмите Tab.
Чтобы выделить предыдущий по порядку элемент, нажмите Shift + Tab.
Чтобы сгруппировать элементы, нажмите Ctrl + G на Windows и ⌘ + G на Mac.
Чтобы разгруппировать элементы, нажмите Ctrl + Shift + G на Windows и ⌘ + Shift + G на Mac.
Чтобы преобразовать в фрейм, нажмите Ctrl + Alt + G на Windows и ⌘ + Alt + G на Mac.
Чтобы показать или скрыть элемент, нажмите Ctrl + Shift + H на Windows и ⌘ + Shift + H на Mac.
Чтобы заблокировать или разблокировать элемент, нажмите Ctrl + Shift + L на Windows и ⌘ + Shift + L на Mac.
Cursor
Cursor — это Курсор.
Чтобы выделить элемент при клике, нажмите Alt.
Чтобы копировать элемент при движении, нажмите Alt.
Чтобы выделить слои, которые находятся под другими слоями, нажмите Ctrl + click на Windows и ⌘ + click на Mac.
Чтобы показать иерархию выделенного элемента, нажмите Ctrl + right click на Windows и ⌘ + right click на Mac.
Чтобы изменить размер относительно центра элемента, нажмите Alt.
Чтобы изменить размер пропорционально, нажмите Shift.
Чтобы переместить во время изменения размеров элемента, нажмите Ctrl на Windows и ⌘ на Mac.
Edit — это Редактирование.
Чтобы копировать, нажмите Ctrl + C на Windows и ⌘ + C на Mac.
Чтобы вырезать, нажмите Ctrl + X на Windows и ⌘ + X на Mac.
Чтобы вставить, нажмите Ctrl + V на Windows и ⌘ + V на Mac.
Чтобы вставить поверх выделенного элемента, нажмите Ctrl + Shift + V на Windows и ⌘ + Shift + V на Mac.
Чтобы создать копию, нажмите Ctrl + D на Windows и ⌘ + D на Mac.
Чтобы переименовать, нажмите Ctrl + R на Windows и ⌘ + R на Mac.
Чтобы экспортировать элемент, нажмите Ctrl + Shift + E на Windows и ⌘ + Shift + E на Mac.
Чтобы копировать свойства элемента, нажмите Ctrl + Alt + C на Windows и ⌘ + Alt + C на Mac.
Чтобы вставить скопированные свойства, нажмите Ctrl + Alt + V на Windows и ⌘ + Alt + V на Mac.
Transform
Transform — это Трансформирование.
Чтобы отразить по горизонтали, нажмите Shift + H.
Чтобы отразить по вертикали, нажмите Shift + V.
Чтобы создать маску, нажмите Ctrl + Alt + M на Windows и ⌘ + Alt + M на Mac.
Чтобы включить редактирование векторных объектов или изображений, нажмите Enter.
Чтобы вставить изображение, нажмите Ctrl + Shift + K на Windows и ⌘ + Shift + K на Mac.
Чтобы обрезать изображение, нажмите Alt + dbl-click.
Чтобы задать прозрачность элементу 10%, нажмите 1.
Чтобы задать прозрачность элементу 50%, нажмите 5.
Чтобы задать прозрачность элементу 100%, нажмите 0.
Arrange
Arrange — это Выравнивание.
Чтобы переместить на уровень ближе к переднему плану, нажмите Ctrl + ] на Windows и ⌘ + ] на Mac.
Чтобы переместить на уровень дальше от переднего плана, нажмите Ctrl + [ на Windows и ⌘ + [ на Mac.
Чтобы переместить на передний план, нажмите Ctrl + Shift + ] на Windows и ⌘ + Shift + ] на Mac.
Чтобы переместить на задний план, нажмите Ctrl + Shift + [ на Windows и ⌘ + Shift + [ на Mac.
Чтобы выровнять по левой стороне, нажмите Alt + A.
Чтобы выровнять по правой стороне, нажмите Alt + D.
Чтобы выровнять по верхней стороне, нажмите Alt + W.
Чтобы выровнять по нижней стороне, нажмите Alt + S.
Чтобы выровнять согласно горизонтальной линии элементов, нажмите Alt + H.
Чтобы выровнять согласно вертикальной линии элементов, нажмите Alt + V.
Чтобы выровнять с распределением горизонтального пространства, нажмите Ctrl + Shift + Alt + H на Windows и ⌘ + Shift + Alt + H на Mac.
Чтобы выровнять с распределением вертикального пространства, нажмите Ctrl + Shift + Alt + V на Windows и ⌘ + Shift + Alt + V на Mac.
Components
Components — это Компоненты.
Чтобы показать все компоненты, нажмите Alt + 2
Чтобы создать компонент, нажмите Ctrl + Alt + K на Windows и ⌘ + Alt + K на Mac.
Чтобы преобразовать компонент во фрейм, нажмите Ctrl + Alt + B на Windows и ⌘ + Alt + B на Mac.
Чтобы открыть многопользовательскую библиотеку, нажмите Ctrl + Alt + O на Windows и ⌘+ Alt + O на Mac.
Так выглядят горячие клавиши в Figma. Надеемся, вы запомните их и будете ими пользоваться. А пока запомнить их не получается, обращайтесь к этой статье — она вам поможет.
Когда заказчик получает ссылку на макет, он часто впадает в ступор. Дизайнер компании Ratio Катя Шведюк поделилась приёмами, которые упростят совместную работу в Figma.
Если вы дизайнер — расскажите про эти фишки клиентам.
Дизайнер прислал файл для Sketch, но у вас не macOS? Figma спешит на помощьРаньше было принято ненавидеть дизайнеров, которые отправляют макеты в Sketch. Но это в прошлом: Figma без проблем откроет любой Sketch-файл.
Для этого даже не придётся устанавливать приложение, все функции доступны в веб-версии.
Мобильная версия сайта или продающий лендинг могут лежать в отдельных вкладках. Переключайтесь между страницами с помощью меню слева.
Дизайнеры часто используют Figma для презентаций. Нажав на иконку человека в правом верхнем углу, вы будете видеть его экран — не нужно ползать по макету в поисках нужного курсора.
Чтобы расшарить проект со ссылкой на конкретный кусок, поставьте галочку у Link to selected frame в окне шеринга. Перед этим не забудьте выбрать макет или страницу в панели слева.
Помните, что пользователь всё равно получит полный доступ к проекту, просто он откроется на выбранной странице.
Включает и отключает сетку. Яркость и цвет можно изменить в настройках справа.
Отображает макет в 100% (масштаб 1:1).
В комментарии ставим @ и выбираем пользователя. Уведомление придёт на его почту — так на ваш вопрос ответят быстрее.
Мы собрали советы в отдельный макет. Протестируйте их внутри Figma
Чтобы расшарить только конкретный кусок проекта, поставьте галочку Link to selected frame в окне шеринга
Из текста может показаться что остальные части проекта посетитель не увидит, но это не так - просто это прямая ссылка на выделенный фрейм, однако посетитель может посмотреть и все остальное двигая рабочую область, или переключая страницы
А вот о просмотре "глазами" другого пользователя не знал ред.
Спасибо за уточнение! Добавили его в текст)
круто) спасибо за отличный материал!
Вы можете нарушить нормы сообщества фейсбука. самим фактом своего существованияЧестно говоря, частенько подтрунивала над vc и считала, что уж я то не буду сюда писать. Даже если столкнусь с очередной лажей, то буду разбираться с полицией там, с иными уполномоченными органами, а строчить в интернете . ну чего ты этим добьешься? Однако вот столкнулась. Началось все с моего дедушки. С того, что он захотел зарегистрироваться…
Figma набирает обороты в сфере дизайна. Программное обеспечение для эскизов в основном доминирует в индустрии дизайна UI / UX. Но последние предложения Adobe (Adobe XD) и Figma с гибкими ценами, бесшовным обменом и кроссплатформенной доступностью меняют уравнение для дизайнеров UI / UX.
Доступность Figma в Интернете, Windows и macOS в сочетании с отличным начальным планом (3 проекта и 2 редактора) делает его идеальным выбором для проектирования, прототипирования и освоения навыков проектирования пользовательского интерфейса. Компания недавно представила долгожданную поддержку плагинов для него. Если вы новичок в области дизайна UI / UX и начинаете свое путешествие с Figma, вы можете запомнить кучу основных сочетаний клавиш Figma для Windows и Mac.
В этом посте мы рассмотрим одиннадцать лучших сочетаний клавиш Figma, которые вы можете использовать на ПК с Windows и Mac. Давайте начнем.
1. Основные возможности масштабирования
Вы не можете использовать Figma или любое программное обеспечение для дизайна UI / UX, не освоив сочетания клавиш Zoom. Это будут наиболее часто используемые сочетания клавиш в вашем рабочем процессе.
Для Windows и Mac вы можете использовать Shift + 1, чтобы подогнать слои к экрану. Shift + 2 для увеличения выбранного кадра (мое наиболее часто используемое сочетание клавиш, поскольку оно позволяет мне быстро просматривать детали выбранного компонента) и Shift + 0 для увеличения на 100%.
2. Показать / скрыть линейки и показать / скрыть сетки макета
Обычно я не использую линейки в Figma, но если вы планируете использовать их во время разработки пользовательского интерфейса, вы можете использовать сочетание клавиш Shift + R на ПК или Mac, чтобы показать / скрыть линейки.
Я все время использую Layout Grids. Он позволяет расположить компоненты, значки на одинаковом расстоянии, позволяет организовать текст и другие элементы. Используйте сочетание клавиш Control + G на Mac, чтобы показать / скрыть сетки макета.
Figma предлагает мощный и настраиваемый инструмент Pen. Вы поймете, что я имею в виду, после того, как поиграете с ним несколько минут. В процессе проектирования вы будете довольно часто использовать эти три инструмента.
Вы всегда можете выбрать их из верхнего меню или использовать нажатие клавиши P для пера, V для перемещения и T для инструмента текста в Windows и Mac.
4. Перемещение между слоями и компонентами
Эти два сочетания клавиш очень удобны, когда вы работаете над дизайнерским проектом со слишком большим количеством слоев и компонентов. Вам может потребоваться постоянно перемещаться между ними. Вы можете использовать Option + 1 для Mac или Alt + 1 для Windows, чтобы перейти на панель слоев. Затем используйте Option + 2 для Mac или Alt + 2 для Windows, чтобы перейти в меню «Компоненты».
5. Откройте палитру цветов.
Эта функция полезна, когда вы хотите извлечь цвет из изображения, значка или любого другого компонента. Вы можете использовать сочетание клавиш «I» на Mac или Windows, чтобы открыть палитру цветов. Наведите палитру цветов на изображение или значок и скопируйте цветовой код из меню палитры цветов.
6. Копировать / вставить текущий стиль
Это реальная экономия времени. Хотите быстро скопировать текущий цвет / дизайн компонента на другой текст или значок? Вы можете выбрать текущий элемент и использовать Option + Command + C для Mac или Ctrl + Shift + C для Windows, чтобы скопировать его стиль. Теперь выберите другой элемент и используйте Option + Command + V для Mac или Ctrl + Shift + V для Windows, чтобы вставить стиль.
7. Выбор группы / разгруппировки
Чтобы разгруппировать их, используйте Command + Shift + G для Mac или Ctrl + Shift + G для Windows.
8. Переключить блокировку и разблокировку.
Когда вы создаете дизайн со слишком большим количеством слоев и компонентов, холст Figma может стать для вас очень загруженным. В этих сценариях вы не захотите случайно перемещать какой-либо значок, текст или компонент. В таких случаях вы можете выбрать элемент и использовать Command + Shift + L для Mac или Ctrl + Shift + L для Windows, чтобы заблокировать их.
Он представлен крошечным значком замка в меню «Слои». Для разблокировки используйте ту же комбинацию клавиш.
9. Создание компонентов
Вы можете сгруппировать значки и текст с помощью инструмента «Группировать», а затем использовать Option + Command + K для Mac или Ctrl + Alt + K для Windows, чтобы создать компонент. Теперь перейдите к ним из меню «Компоненты» (отметьте №4).
10. Показать командную библиотеку
Знаете ли вы, что Figma также называют Документами Google в индустрии дизайна? Программное обеспечение поставляется с возможностью беспрепятственного обмена, что позволяет добавлять редакторов в команду.
Для больших проектов каждому члену команды дается отдельное задание на проектирование. При создании дизайна в группе вы можете посетить библиотеку группы, которая состоит из общих компонентов и значков для участников. Вы можете открыть меню, используя Command + Option + O на Mac или Ctrl + Alt + O в Windows, чтобы открыть меню командной библиотеки.
11. Экспортный дизайн
Используйте Figma как профессионал
Читайте также: