16 ноября 2021
Темы | Маркетинг
Нет времени читать?
Отправить статью на почту

Что такое Фигма и как в ней работать

16 ноября 2021
10 мин на чтение
139
author__photo
Николай Большаков
Автор блога Calltouch

Нет времени читать?
Отправить статью на почту

Фигма – рабочий инструмент дизайнеров, веб-разработчиков, SMM-специалистов, владельцев бизнеса и обычных пользователей. В этом графическом редакторе создают макеты сайтов и приложений без особой подготовки. 

Рассказываем, как начать работать в Figma и в чем ее особенности.

Наши продукты помогают вашему бизнесу оптимизировать расходы на маркетинг
Узнать подробнее

Что такое Figma

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

Возможности и особенности Figma

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

Научиться пользоваться Фигмой можно быстро и легко. Дайте название проекту или команде, выберите тариф (бесплатный – Starter, платный – Professional) и приступайте к работе.  

Многопользовательский режим редактирования

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

Облачный сервер хранения файлов

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

Компоненты

Интерфейс и каждый его компонент – проводники между пользователем и любой программой. С помощью Фигмы оформляют кнопки, меню, виджеты, иконки, списки и прочее. Если по итогам работы вас не устроил внешний вид ряда идентичных элементов, не нужно переделывать отдельно каждый – измените один, и редактор автоматически скорректирует подобные. Это еще одно преимущество Фигмы. 

Обратный звонок Calltouch – пример такого полезного компонента. Окно появляется ровно в тот момент, когда посетитель хочет совершить звонок. Вы будете оставаться на связи с клиентами в нерабочее время, в выходные и праздничные дни. 

caltouch-platform

Виджет обратного звонка для сайта

50 минут в подарок новым клиентам
  • Повысьте конверсию сайта на 30%
  • Экономьте на тарифах: от 5 рублей в минуту
  • Адаптируйте форму под ваш сайт. Без разработчика
  • Используйте гибкие настройки показа
  • Стройте отчеты по звонкам: от показа виджета до ключевого слова

Также можно подключить другие виджеты Calltouch для увеличения конверсии сайта и роста продаж. Зарегистрируйтесь и добавьте интерактива на свой сайт уже сегодня. 

caltouch-platform

Виджеты Calltouch

Для увеличения конверсии сайта и роста продаж
  • Повысьте конверсию сайта на 30%
  • Оптимизируйте работу колл-центра
  • Увеличьте лояльность клиентов
  • Подробная статистика по всем обращениям с привязкой к источнику

Фреймы

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

Если вам необходимо переместить кнопку обратного звонка и фото на всех фреймах, сгруппируйте эти элементы (Object → Group Selection). Проверьте слои на предосмотре, сохраните результат. Готовый фрейм можно скачать в удобном формате. 

Сетки

Допустим, вам необходимо настроить расположение товаров в прототипе интернет-магазина. Сетка (Layout Grid) поможет скорректировать промежутки между ними (Gutter), расстояния от краев фрейма (Margin), а также размеры, количество (Count), цвет (Color) карточек с каждым продуктом. Сеток во фрейме может быть сколько угодно – отдельно для каждого графического компонента или группы. Цвет и параметры сетки легко поменять. Предусмотрено 12 колонок для крупных объектов, 24 – для мелких. Вертикальные линии подойдут для работы с текстом.

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

Десктопная версия

Ее скачивают на Windows, MacOs, Android, iOS для загрузки собственных шрифтов и работы офлайн. Работу из десктопной версии можно импортировать в браузерную. Фигма – редактор с английским интерфейсом, поэтому не доверяйте ресурсам, на которых якобы можно скачать русскоязычную версию. Воспользуйтесь официальным сайтом. Дополнительно загрузите шаблоны. 

Условная бесплатность

Для самостоятельной работы и двух специалистов подойдет бесплатный тариф Starter. В него включены:

  • 3 проекта;
  • 2 библиотеки от Figma;
  • 30 суток облачного хранения истории проекта;
  • доступ для двух человек.

За 12$ в месяц с каждого члена команды доступен тариф Professional. Его преимущества:

  • неограниченное количество проектов;
  • множество библиотек;
  • неограниченное хранение истории;
  • доступ по приглашению.

Тариф Organization за 45$ в месяц дает вам полный доступ к работе в Figma. Список возможностей:

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

Доступна демо-версия.

Figma для дизайнеров

Есть масса графических редакторов – Photoshop, Adobe XD, Sketch, Canva. Но в Фигме целый ряд уникальных преимуществ для дизайнера:

  • интуитивно понятный интерфейс;
  • возможность командной работы через любые удобные браузеры, устройства и ОС;
  • система шрифтов Google Fonts;
  • возможность сохранить проект в формате Sketch (для Mac OS);
  • возможность оставлять комментарии участникам команды;
  • отзывчивая техподдержка;
  • возможность разрабатывать не просто дизайн, а живой макет;
  • облачное хранение.

Недостатки Фигмы

Какие нюансы учесть перед регистрацией в Фигма:

  1. Искажение линейных иллюстраций. После копирования PNG, JPG и SVG-файлов Фигма добавляет пиксели.
  2. Небезопасное хранение файлов. Тариф Starter не защищает файл от копирования и использования макета на любом этапе работы.
  3. Нужен стабильный доступ в интернет. Фигма не предназначена для использования офлайн, но есть способ это обойти: зайдите в программу, дайте ей время загрузить все необходимое и работайте не в сети. Или скачайте десктопную версию.
  4. Только английский интерфейс. Пользуйтесь инструкциями, если не знаете английского языка.

Начало работы в Фигме

Зайдите на официальный сайт и зарегистрируйтесь: кнопка Create one. Затем в правом верхнем углу кликните на кнопку +New. Так вы создадите файл. Задайте необходимые параметры и преступайте к разработке макета. 

Также вы можете скачать приложение. Зайдите на сайт Figma, выберите «Products», «Downloads», укажите продукт и вашу ОС. Либо нажмите на кнопку «Try Figma for free».

Коротко о главном

  • Фигма – уникальная платформа для создания любых макетов – от несложных графических объектов до прототипов сайтов.
  • Работать над проектом можно в команде в режиме онлайн. 
  • Вся информация хранится в облаке.
  • Есть десктопная версия.
  • Доступ к редактированию открыт через любые устройства, браузеры, ОС.
  • Платные тарифы надежнее и функциональнее.
  • Фреймы можно скачать в удобном формате, с необходимыми компонентами: кнопками, фото, текстами, меню и списками. 
Нет времени читать?
Отправить статью на почту
Оцените
Поделитесь с друзьями
Что нового в интернет-маркетинге?
Главное в ежемесячной рассылке
Подписывайтесь сейчас и получите 13 чек-листов маркетолога
Нажимая на кнопку "Подписаться", вы даёте своё согласие на обработку персональных данных и получение рекламной информации о продуктах, услугах посредством звонков и рассылок по предоставленным каналам связи.
У вас интересный материал?
Опубликуйте статью в нашем блоге
Опубликовать статью
Хотите получить актуальную подборку кейсов?
Прямо сейчас бесплатно отправим подборку обучающих кейсов с прибылью от 14 730 до 536 900р.
[contact-form-7 404 "Not Found"]
У нас тут cookies…
На сайте используются файлы cookies. Продолжая использование сайта, вы соглашаетесь с этим. Подробности об обработке ваших данных — в политике конфиденциальности.