Как сделать лист в фигме

Создать новый лист (Frame) в Figma - одна из базовых операций. Вот несколько способов, от самого простого до более продвинутых.

Вы можете создать интернет магазин за 1 вечер. Просто выберите готовый шаблон интернет магазина и установите его. Останется только наполнить его своими товарами.

Быстрый способ с помощью инструмента Frame

Этот метод является основным и интуитивно понятным. Чтобы воспользоваться им, просто найдите на верхней панели инструментов слева иконку, напоминающую квадрат с плюсиком внутри, и кликните на неё. После этого ваш курсор изменится на крестик, и вы сможете нарисовать прямоугольную область прямо на холсте, зажав левую кнопку мыши.

Как только вы отпустите кнопку, на месте прямоугольника появится чистый лист, готовый к работе. Этот способ идеально подходит для ситуаций, когда вам нужен кастомный размер, не входящий в стандартные шаблоны. Вы всегда можете потом точно подогнать параметры фрейма в панели свойств справа.

1. Выберите инструмент Frame на панели инструментов слева (горячая клавиша F или иконка с квадратом и плюсиком).
2. Нарисуйте прямоугольник на холсте, зажав левую кнопку мыши.
3. Готово: У вас появился новый лист (Frame).

 

Совет: Можно просто кликнуть на холст, и Figma предложит выбрать популярный размер (например, iPhone, Desktop, A4) или ввести свой.

 

Горячие клавиши

Для ускорения рабочего процесса Figma предлагает мощные сочетания клавиш. Нажав клавишу F, вы мгновенно активируете инструмент Frame, после чего можете либо кликнуть для выбора шаблона, либо начать рисовать.

Особенно полезна команда Ctrl/Cmd + Alt/Opt + G, которая создает новый фрейм вокруг любого предварительно выделенного вами набора объектов, автоматически подбирая под него размер. Освоив эти "горячие клавиши", вы сможете создавать и структурировать макеты в разы быстрее, не отрывая рук от клавиатуры и сохраняя творческий поток. Основные команды:

• F - кликните на холст или зажмите и растяните.
• Ctrl + Alt + G (Win) / Cmd + Opt + G (Mac) - превращает выделенные объекты в новый Frame.
• Ctrl + / (Win) / Cmd + / (Mac) - открывает меню команд, наберите "Frame" и создайте его.

Способ с помощью меню или правой кнопки мыши

Этот классический метод доступен практически в любом интерфейсе. Если вы кликните правой кнопкой мыши на пустом месте рабочей области, в появившемся контекстном меню вы сразу увидите пункт "Frame". Его же можно найти в основном верхнем меню программы в разделе "Layout".

Данный способ особенно удобен, когда панель инструментов скрыта или вам просто привычнее работать через меню. Он также предоставляет опцию "Frame Selection", которая становится активной, если у вас уже есть выделенные элементы, и позволяет быстро обернуть их во фрейм за один клик.

1. Кликните правой кнопкой мыши на пустом месте холста.
2. В контекстном меню выберите Frame (или Frame Selection, если есть выделенные объекты).
3. Также можно использовать верхнее меню: Layout - Frame.

Способ с помощью готовых шаблонов устройств

Когда ваш дизайн предназначен для конкретной платформы, самый разумный путь - начать с готового шаблона. Нажмите на плюсик рядом с названиями страниц или на кнопку "Design" на панели слева, чтобы открыть галерею.

Вы увидите аккуратно отсортированные категории: мобильные устройства, планшеты, десктопы и даже размеры бумаги. Выбрав, например, "iPhone 15 Pro", вы создадите фрейм не только с точными физическими размерами экрана, но и с уже настроенными направляющими для безопасной зоны (safe area), что критически важно для реальной разработки.

1. Нажмите на иконку + рядом с вкладками страниц вверху или на кнопку Design на панели инструментов слева.
2. Выберите нужный шаблон: Mobile, Desktop, Tablet, Watch, Paper и т.д.
3. Figma сразу создаст Frame с правильным размером и, часто, направляющими под безопасную зону.

Ниже таблица, которая показывает несколько популярных шаблонов и их типичное применение. Это поможет выбрать подходящую отправную точку для проекта, используя точные, предустановленные размеры, что экономит время и обеспечивает соответствие стандартам платформ:

Шаблон (Категория)	Конкретный пример	Размер (пиксели)	Основное применение
Mobile	iPhone 15 Pro	393 x 852	Дизайн мобильных приложений для iOS.
Mobile	Android (Pixel 5)	393 x 851	Дизайн мобильных приложений для Android.
Tablet	iPad Mini (8.3")	744 x 1133	Дизайн планшетных интерфейсов, компактных лендингов.
Desktop	Desktop (1440x1024)	1440 x 1024	Дизайн веб-сайтов, веб-приложений, адаптивных макетов.
Presentation	16:9 Screen	1920 x 1080	Создание презентаций, демонстрационных слайдов.
Paper	A4 Portrait	1240 x 1754	Дизайн печатных материалов: резюме, буклетов, документов.

 

Что важно знать о листах в Figma

Важно понимать, что Frame в Figma - это не просто графический прямоугольник, а полноценный контейнер-конструктор. Он служит основой для экранов, компонентов и макетов, обладая такими свойствами, как фон, тень, закругление углов и возможность обрезать содержимое (маскирование).

 

Грамотное использование фреймов - это фундамент организованной и эффективной работы в редакторе.

 

Именно фреймы являются целевыми объектами для создания интерактивных прототипов - между ними выстраиваются связи и переходы. Они могут быть бесконечно вложенными друг в друга, а их мощь раскрывается в сочетании с функциями Auto Layout и Grids, которые делают дизайн адаптивным и структурированным. Это основа для экранов, устройств, компонентов.

• Размер и настройки. После создания вы можете задать точный размер в правой панели, поменять ориентацию, дать название, настроить Auto Layout и Grids.
• Область для прототипирования. Чтобы соединять экраны стрелками (прототип), нужно работать именно с Frames.
• Вложенность. Фреймы можно помещать внутрь других фреймов (например, карточка внутри экрана).

Краткий алгоритм для начинающего:

1. Нажмите клавишу F.
2. Кликните на холст.
3. Выберите из списка, например, iPhone 14 (или просто нарисуй рамку).
4. Начинайте работать внутри этого листа.

Вывод

Создание листов (фреймов) в Figma - это гибкий и интуитивный процесс, доступный через несколько удобных инструментов: от рисования рамки до выбора готового шаблона устройства. Понимание роли фрейма как основного контейнера для дизайна и прототипирования является ключевым для эффективной и организованной работы в платформе. Освоение этих методов позволяет быстро переходить от идеи к макету.