Панели инструментов и слоев в интерфейсе Фигмы: как их открыть, убрать или увеличить
Автор — Ян Агеенко
Дизайнер с 20-летним опытом работы. Арт-директор в собственной студии. Основатель Гильдии дизайнеров, автор книги «Как стать дизайнером с нуля»
В этом уроке рассказывается о ключевых панелях интерфейса Figma: панели слоёв, панели свойств и панели инструментов. Вы узнаете, где они находятся, за что отвечают и как с ними работать. Также объясняется, как вернуть пропавшие панели и как изменить их размер — как ширину отдельных панелей, так и общий масштаб интерфейса в зависимости от того, работаете ли вы в браузере или в десктопном приложении.
Видео-версия урока
Какие панели инструментов и слоев есть в фигме
В интерфейсе Figma присутствует несколько основных панелей. Слева расположена панель слоёв (Layers), в которой отображаются страницы и иерархия объектов текущего файла. Рядом с ней находится вкладка Assets — в ней хранятся внешние библиотеки и готовые компоненты, которые можно вставлять в проект. В отличие от слоёв, ассеты не являются частью файла по умолчанию, но после вставки появляются в списке слоёв.

Справа находится панель свойств, также называемая панелью дизайна и прототипа. При выделении любого элемента здесь отображаются его параметры: для текста — шрифт, размер, цвет, выравнивание; для изображений — размеры, режимы наложения, заливка и другие настройки. При переключении на вкладку Prototype в этой же панели появляются опции для настройки взаимодействий и переходов.

В нижней части интерфейса расположена панель инструментов, содержащая такие инструменты, как перемещение (Move), рука (Hand) для навигации по холсту, масштабирование (Scale), фреймы, фигуры, текст, комментарии, перо, карандаш и другие. Также здесь находится кнопка Actions, через которую можно искать ассеты, запускать плагины и использовать инструменты на базе искусственного интеллекта, например, для удаления фона или генерации изображений.

Как вернуть боковые панели в фигме, если они пропали
Если панели в Figma внезапно исчезли, это, скорее всего, произошло из-за случайного нажатия горячих клавиш, скрывающих интерфейс. Вернуть их можно несколькими способами. Во-первых, достаточно кликнуть правой кнопкой мыши в любом месте рабочей области и выбрать в контекстном меню пункт «Show UI» (Показать интерфейс). Во-вторых, можно воспользоваться горячими клавишами: на macOS это Cmd \, на Windows — Ctrl \. Эти сочетания переключают видимость всего пользовательского интерфейса.

Если панели не полностью пропали, а лишь свернулись в узкие полоски по краям, достаточно нажать на маленькую кнопку в верхнем левом углу свёрнутой панели — это развернёт её обратно.
Как увеличить или уменьшить панели инструментов в фигме
Ширину отдельных панелей (левой и правой) можно регулировать вручную: для этого нужно навести курсор на внутренний край панели до появления двунаправленной стрелки и потянуть в нужную сторону. Это позволяет освободить больше места для рабочей области или, наоборот, расширить панель для удобства.
Если же требуется изменить общий масштаб самого интерфейса Figma (например, чтобы сделать элементы крупнее при плохом зрении), способ зависит от того, используется ли браузер или десктопное приложение. При работе в браузере (например, Google Chrome) нужно изменить масштаб самого браузера через его настройки — это повлияет на размер всех элементов интерфейса Figma. В десктопном приложении Figma для изменения масштаба интерфейса следует перейти в меню View и выбрать пункт Interface Scale, где можно выбрать нужный уровень увеличения или уменьшения.
Важно не путать это с масштабированием самого холста (когда нужно приблизить или отдалить экран рабочего пространства) — оно регулируется отдельно через Ctrl (Cmd) + колёсико мыши, горячие клавиши или функцию Zoom в верхней правой части интерфейса и не влияет на размер панелей инструментов.
Другие полезные уроки по Фигме
Как сделать, изменить и посмотреть расстояния и отступы в фигме — межстрочные, между абзацами и другими объектами
В этом уроке вы узнаете, как в Figma работать с расстояниями между объектами и текстовыми элементами. Будет рассказано, как быстро выровнять отступы между слоями, настроить одинаковые интервалы с помощью автолейаутов, измерить расстояние между любыми элементами и правильно задать параметры типографики — включая межбуквенный и межстрочный интервалы, а также отступы между абзацами и пунктами списка.
Плагины фигмы — цвета и шрифты, эффекты и мокапы, градиенты и тени, стрелки и линии, таблицы и диаграммы
Плагины - это мини-программы, дополняющие основной функционал фигмы. С их помощью можно создавать различные эффекты, генерировать таблицы, диаграммы и стрелки, подбирать шрифты и цвета, переводить дизайн-макеты в HTML и вставлять их в мокапы различных устройств. Сегодня мы расскажем, где найти, как установить и как пользоваться плагинами в программе фигма.
Как начать работать в программе фигма с нуля — инструкция для чайников
Если вы ищете максимально и простую и понятную инструкцию для чайников по работе в фигме, этот туториал — то что вам нужно. Здесь вы узнаете, как с нуля научиться работать в программе фигма, познакомитесь с интерфейсом и основными инструментами этого приложения (фреймы, фигуры, картинки, текст), а также создадите свой первый дизайн-макет.
