Figma набирает обороты в дизайне. Программное обеспечение Sketch в основном доминирует в индустрии дизайна UI / UX. Но последние предложения от Adobe (AdobeXD) и 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, чтобы показать/скрыть сетку макета.
3. Инструмент «Перо», «Перемещение» и «Текст»
Figma предлагает мощный и настраиваемый инструмент пера. Вы поймете, что я имею в виду, поиграв с ним несколько минут. Во время рабочего процесса проектирования вы будете использовать эти три инструмента довольно часто.
Вы всегда можете выбрать их в верхнем меню или использовать клавишу 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 + G для Mac или Ctrl + G для Windows, чтобы создать группу.
Чтобы удалить группировку, используйте Command + Shift + G для Mac или Ctrl + Shift + G для Windows.
8. Переключить блокировку и разблокировку
Когда вы проектируете слишком много слоев и компонентов, холст Figma может стать для вас довольно загруженным. В этих сценариях вы не хотите случайно переместить какой-либо значок, текст или компонент. В таких случаях вы можете выбрать элемент и использовать Command + Shift + L для Mac или Ctrl + Shift + L для Windows, чтобы заблокировать его.
Он представлен маленьким значком замка в меню «Слои». Используйте ту же комбинацию клавиш для разблокировки.
9. Создайте компоненты
Компоненты — это сердце и душа Figma. Вы можете повторно использовать одни и те же элементы в пользовательском интерфейсе. Некоторыми примерами могут быть гамбургер-меню, меню нижней панели, кнопки и т д., которые вы хотите повторно использовать и для других экранов.
Вы можете сгруппировать значки и текст с помощью инструмента «Группа», а затем использовать Option + Command + K на Mac или Ctrl + Alt + K в Windows, чтобы создать компонент. Теперь вы можете получить к ним доступ из меню «Компоненты» (проверьте № 4).
10. Показать командную библиотеку
Знаете ли вы, что в индустрии дизайна Figma также называют Google Docs? Программное обеспечение поставляется с полезными опциями обмена, которые позволяют вам добавлять редакторов в вашу команду.
Для крупных проектов каждому члену команды дается отдельное дизайнерское задание. При проектировании в группе вы можете захотеть посетить библиотеку команды, которая состоит из общих компонентов и значков среди участников. Вы можете открыть меню, используя Command + Option + O на Mac или Ctrl + Alt + O в Windows, чтобы открыть меню библиотеки команд.
11. Экспорт дизайна
После того, как дизайн будет завершен, вы можете использовать опцию экспорта, чтобы извлечь значки и изображения из дизайна, чтобы вы могли отправить их разработчикам для реализации. Вы можете выбрать слой и использовать Command + Shift + E для Mac или Control + Shift + E для Windows, чтобы экспортировать детали.
Используйте Figma как профессионал
Figma — отличный инструмент для дизайнеров UI/UX. Это бесплатно для начинающих, позволяет делиться и поставляется с множеством сочетаний клавиш для плавного рабочего процесса. Внедрите эти сочетания клавиш в свой рабочий процесс и создайте красивый дизайн пользовательского интерфейса, как профессионал.
Далее: Canva и Crello — два лучших дизайнерских инструмента для создания плакатов и флаеров. Прочитайте сравнение ниже, чтобы найти лучший выбор для вас.
