UI/UX дизайн

Что такое Figma?

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

Совместная работа — главное отличие Figma от более старых редакторов. Файл хранится в облаке, ссылка всегда ведёт на актуальную версию, комментарии оставляют прямо на макете, и вопрос «где последний вариант?» больше не возникает.

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

Где применяется

В Figma проходит почти весь путь макета: от первых набросков и вайрфреймов до библиотеки компонентов, кликабельного прототипа и передачи в разработку. Разработчик открывает тот же файл по ссылке и берёт оттуда размеры, цвета, шрифты и готовый CSS для элемента.

Пользуются ей не только дизайнеры. Маркетологи создают баннеры и презентации, менеджеры оставляют комментарии прямо на экране вместо переписки в чате, а команда хранит дизайн-систему как общую библиотеку для всех проектов компании.

Пример

Заказчик хочет изменить макет в четверг вечером: открывает ссылку и оставляет комментарий возле нужной кнопки. Дизайнер видит его утром в том же файле. Не нужно пересылать архивы и выяснять, какая версия последняя.

Частые вопросы

Бесплатна ли Figma?

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

Чем Figma отличается от Photoshop?

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

Можно ли получить из Figma готовый код?

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

Нужен ли для Figma мощный компьютер?

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

Обучение UI/UX-дизайну в OWU

Освойте профессию UI/UX-дизайнера на практических курсах с менторами и реальными проектами.

Выбрать курс