Что это
Figma - это векторный дизайн-редактор, который за последние годы стал фактическим стандартом в индустрии UI/UX дизайна. Программа работает в браузере и имеет нативные приложения для macOS и Windows. Главная особенность Figma - совместная работа в реальном времени: несколько дизайнеров могут редактировать один файл одновременно, видя курсоры друг друга, как в Google Docs.
Помимо векторного редактирования Figma предлагает мощные инструменты для создания прототипов, дизайн-систем, компонентов, документации. Её используют почти все продуктовые команды мира - от стартапов до Apple, Google, Microsoft.
Кому подойдёт
В первую очередь - UI/UX дизайнерам. Figma - это современный стандарт, знание которого является обязательным навыком для работы в продуктовых компаниях.
Во вторую - продакт-менеджерам и разработчикам, которые работают в паре с дизайнерами. В Figma удобно оставлять комментарии, видеть обновления дизайна, экспортировать ассеты для реализации.
В третью - фрилансерам, которые создают дизайны для клиентов и хотят показывать живой процесс.
В четвёртую - дизайн-командам, которые строят и поддерживают дизайн-системы.
В пятую - иллюстраторам и графическим дизайнерам, кто не занимается UI, но хочет бесплатный векторный редактор.
Ключевые возможности
Векторный редактор
Полноценный инструмент для рисования форм, иллюстраций, иконок. Перья, кривые Безье, булевы операции.
Совместная работа в реальном времени
Несколько человек в одном файле одновременно. Видны курсоры друг друга. Изменения синхронизируются мгновенно.
Компоненты и варианты
Создавайте переиспользуемые компоненты (кнопки, карточки, формы). Варианты - разные состояния одного компонента (hover, active, disabled).
Auto Layout
Автоматическое расположение элементов с паддингами и гэпами. Как Flexbox в CSS, но визуально.
Прототипы
Соединяйте экраны переходами, настраивайте анимации, тестируйте прототип прямо в Figma.
Дизайн-системы
Цвета, шрифты, компоненты, отступы - всё это можно организовать в систему и переиспользовать в проектах.
Плагины
Огромная библиотека плагинов: генераторы данных, иконки, иллюстрации, автоматизация, конверсия в код.
Комментарии
Любой член команды может оставить комментарий к любому элементу. Удобно для ревью.
Экспорт
PNG, JPG, SVG, PDF. Разные разрешения для одного элемента одним кликом.
Dev Mode
Специальный режим для разработчиков: они видят стили, размеры, готовый CSS/iOS/Android код.
Плюсы и минусы
Плюсы:
- Бесплатный план позволяет многое.
- Совместная работа в реальном времени - уникальная функция.
- Стандарт индустрии.
- Огромная экосистема плагинов.
- Dev Mode для разработчиков.
- Кросс-платформа: веб, Mac, Windows.
Минусы:
- Зависимость от интернета.
- Командные тарифы дорогие.
- После поглощения Adobe возможны изменения курса.
- Большие файлы начинают тормозить.
- Не подходит для печатного дизайна (это специализация Adobe InDesign).
Как установить на macOS
Скачайте Figma Desktop со страницы программы на mac-soft.ru или с figma.com. Дистрибутив - DMG. Перетащите Figma в «Программы» и запустите.
Зарегистрируйте бесплатный аккаунт. Free-план позволяет 3 Figma-файла в личном рабочем пространстве и безлимит команд.
Создайте первый файл через кнопку New design file. Изучите основы: прямоугольники, текст, фреймы, компоненты.
Освойте Auto Layout - это самый важный навык для современного UI-дизайна в Figma.
Создайте простой прототип: несколько экранов, связанных переходами. Запустите Present, чтобы увидеть в действии.
Установите несколько полезных плагинов: Iconify для иконок, Unsplash для фото, Content Reel для текста.
Для профессионального развития изучите каналы YouTube по Figma - количество материалов огромно.
Итог
Figma - это must-have инструмент для всех, кто занимается цифровым дизайном. Бесплатно она даёт почти всё, что нужно индивидуальному дизайнеру. Командные планы оправданы для продуктовых компаний.
Если вы хотите стать UI/UX дизайнером или работаете в продуктовой команде - Figma должна быть вашим основным инструментом. Скачать Figma для macOS можно на mac-soft.ru.
Комментарии (0)