Не пропусти интенсив по Telegram
Участвовать
Интенсив по ВКонтакте
Академия
Словарь
Интенсив по Telegram
Интервью
Спринт Я — БРЕНД
Сервис Figma: основные функции и принципы работы
Зарегистрироваться на интенсив
Копычев Никита
Figma-джедай
Левина Ильяна
Та самая королева конверсии
Как стать клиенто-ориентированной компанией?
Понятно будет даже не дизайнерам
Сервис Figma: основные функции и принципы работы
Онлайн-сервис Figma обладает мощным потенциалом, несмотря на относительную простоту интерфейса. Пользователям не нужно обладать специализированными знаниями и навыками, чтобы разрабатывать собственные проекты при помощи данной программы. Чтобы максимально раскрыть все возможности сервиса и научиться правильно их использовать, вам следует пройти курс Skillbox по Figma. На нем вы узнаете о тонкостях и неочевидных опциях программы, которые помогут вам сэкономить время в будущем.
Figma: что это такое
Figma – это онлайн-инструмент для специалистов в области веб-дизайна и разработки интерфейсов. Кроссплатформенный сервис поддерживает работу на любой операционной системе (Windows, macOS, Linux). Процесс проектирования происходит в онлайн-программе.

Если сравнивать Figma с другими сервисами для разработки интерфейсов, можно выделить два ключевых преимущества:

  1. Пользователь может получить доступ к дизайн-макету напрямую через браузерное окно.

2. Несколько пользователей имеют возможность работать над одним проектом совместно.

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

Некоторые веб-дизайнеры называют Figma онлайн-сервисом, совершившим революцию в области программ для разработки интерфейсов. При помощи данного инструмента пользователи проектируют, создают прототипы и работают совместно с коллегами прямо через браузерное окно. Поэтому он стал невероятно актуальным во время глобальной пандемии.
Ключевые возможности онлайн-сервиса
Теперь, когда вы узнали, что такое онлайн-сервис Figma и для чего он нужен, разберемся в его основных функциях и возможностях.
Возможность многопользовательской работы
До разработки и выпуска программы Figma процесс совместной работы нескольких веб-дизайнеров над общим проектом было достаточно сложно организовать. Разработчики Adobe Photoshop не соглашались на корректное открытие макета для пользователей, не установивших необходимые шрифты. Либо партнеры вносили корректировки в собственные копии проекта и забывали сообщать об этом друг другу.

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

Для сотрудничества с другими пользователями необходимо создать команду, кликнув на кнопку «New team». Дальнейшие действия понятны на интуитивном уровне: вам нужно вписать название для группового проекта, выбрать один из тарифов, и все готово.

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

Данная опция может быть крайне полезной в определенных случаях. Представьте, к примеру, что вы разработали около 30 макетов в Adobe Photoshop и отправили их заказчику на финальную проверку, а он ответил вам письмом с просьбой откорректировать пункт меню в шапке. 

До создания Figma вы бы были вынуждены изменять все это вручную. Но, к счастью, программа решила данную проблему: корректируете одну деталь – все компоненты в этом стиле корректируются автоматически.
Сохранение версий
Пользователи Figma без проблем могут просмотреть предыдущие версии своего проекта и восстановить либо продублировать те, которые ему нужны. Версия макета будет сохранена, если ее не будут корректировать в течение получаса.

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

Фреймы
Фреймы в Figma имеют некоторую схожесть с артбордами в Adobe Photoshop, но являются более гибкими в работе. Их можно масштабировать и группировать. Программа предлагает несколько предустановленных размеров фреймов, подходящих под размеры определенных устройств: Phones, Tablet, Desktop, Watch, Paper, Social Media. Так что пользователю не придется вспоминать нужные размеры и путаться в них.

Сетки
Благодаря панели Grid Layout у веб-дизайнеров есть возможность разрабатывать сетки любого вида в короткие сроки:

  • программа предоставляет огромное количество сеток;

  • любая сетка может быть с легкостью откорректирована и зафиксирована;

  • при желании расцветка сетки может быть изменена.

Десктопная версия
Да, Figma является онлайн-сервисом. Но программа имеет и десктопную версию. Чтобы работать с ней, необходимо зарегистрироваться и подключиться к Интернету. Материалы будут сохраняться локально и, если нужно, импортироваться в браузерную версию инструмента.

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

  • не больше двух редакторов;

  • не больше трех проектов;

  • сохраненные версии будут удалены через месяц.

Веб-дизайнеры, которым не подходят данные условия, могут перейти на версию Professional либо Organization. Ежемесячная стоимость первого тарифа – 12 долларов, а второго – 45 долларов. 

Разница в ценах обусловлена количеством функций для командной работы. Тариф Professional позволяет пользователю:

  • редактировать документы;

  • сохранять откорректированные версии без временных ограничений;

  • создавать личные проекты и давать другим пользователям доступ к ним.

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

  • создание команд;

  • сохранение авторства проекта за заказчиком, когда разработчики деактивированы;

  • загрузка собственных шрифтов.
Хотя в данной статье была разобрана лишь небольшая часть возможностей онлайн-инструмента Figma, наверняка он уже заинтересовал вас. У любого веб-дизайнера в приоритете стоит скорость работы над проектом и коммуникация с коллегами и заказчиками в процессе. Со всеми этими задачами справится программа Figma.
Читайте ещё на тему
"Дизайнерам"
Создаем презентацию по всем правилам: руководство для тех, кто далеко не дизайнер
Читать
Что такое технология CGI и почему она так незаменима для дизайнера
Читать
14 фильмов, которые должны посмотреть дизайнеры
Читать
Быстрые и удобные способы удаления фона и лишних элементов с изображений при помощи различных сервисов
Читать