Figma

Назначение

Figma — облачный редактор для проектирования интерфейсов и совместной работы над ними. Основной результат — макет экрана или дизайн-система, которую команда ведёт в одном файле: компоненты, переменные, страницы и прототипы доступны дизайнерам, разработчикам и заказчику одновременно.

Figma не производит готовый сайт или печатный материал. Она проектирует цифровой продукт и передаёт решения в реализацию.

Возможности и форматы

• Совместное редактирование в браузере, комментарии и история версий.
• Компоненты и варианты, auto layout, переменные и стили для токенов.
• Прототипирование переходов, оверлеев и простых взаимодействий.
• Dev Mode с инспекцией размеров, стилей и экспортом ассетов.
• Импорт .fig-файлов и вставка слоёв из других редакторов; экспорт PNG, JPG, SVG и PDF.
• Плагины и API, интеграция с дизайн-токенами и репозиториями.
• Figma Slides и AI-функции внутри рабочего пространства; их состав зависит от плана и региона.

Практический сценарий

Адаптивный макет и handoff. Соберите один экран в двух ширинах — 1440 и 390 — на компонентах с auto layout. Задайте цвета и отступы переменными, а не ручными значениями. Соберите прототип перехода между состояниями и проверьте его в режиме просмотра. Затем откройте Dev Mode и убедитесь, что разработчик может прочитать размеры, стили и экспортировать иконки без вопросов к дизайнеру.

Проверка результата: изменение переменной меняет цвет во всех состояниях; экран на 390 не имеет горизонтальной прокрутки; прототип проходит сценарий без «мёртвых» кнопок.

Ограничения

• Файлы живут в облаке Figma: офлайн-работа ограничена, а владение и экспорт зависят от плана и настроек команды.
• Dev Mode, часть AI-функций и расширенные права доступа входят не во все тарифы.
• Очень большие файлы с сотнями компонентов требуют дисциплины: библиотеки, страницы и именование иначе замедляют работу.
• Макет не равен реализации: адаптивность и состояния нужно отдельно проверять в коде.
• Перенос в другой редактор возможен, но часть компонентов и прототипов теряет связи.

Когда выбирать

Figma уместна, когда над продуктом работают несколько человек одновременно, нужна дизайн-система и регулярная передача в разработку. Для открытого формата и хранения дизайна рядом с кодом сравните с pen.dev; для self-hosted и open-source — с Penpot; для полностью нативной работы на macOS — со Sketch.

Связанные материалы

• UI-дизайн — токены, компоненты и состояния, которые ведёт Figma.
• ИИ-дизайн: сервисы и процесс — AI-сценарии Figma и проверка результата.
• Дизайн рекламных материалов — когда цифровой макет становится рекламным материалом.
• Иерархия блочной темы WordPress — как макет превращается в блоки темы.

Материалы и источники

• Figma: справка
• Figma: возможности и продукты
• Figma AI
• По официальной документации, 2026-11-04.