Душная фигма: 1.2 Панель инструментов
Всем привет, меня зовут Владислав. И это подборка статей по фигме для самых начинающих. Информация актуальная на момент выхода. Обновления буду публиковать по мере возможности.
Нужны вам эти статьи или нет думаю вы поймете сами: Автор статьи ноунейм, работает на фрилансе, с фигмой на «ты» и с поиском информации тоже. Через эти статьи учусь сам и помогаю другим.
Будет душно.
В первой статье мы разбирали пункты меню, в этой статье разберемся с оставшимися панелями и инструментами. И уже в следующей статье перейдем к первым практикам.
Верхняя панель инструментов
- Move tool
Мув тул будет всегда выбран, большую часть времени это точно. А еще довольно часто с зажатым cmd(меняем везде на ctrl на виндовс, больше не повторяюсь) Данный инструмент позволяет выбрать что либо, передвинуть ну и увеличение через cmd приближает к курсору - Scale tool
Скейл нужен в редких случаях, если коротко, увеличивает все что выделено, возьмем на примере текста, если тянуть за края с помощью мув тула, будет меняться размер рамки, если тянуть скейлом, будет увеличиваться размер текста и межстрочное расстояние, бывает иногда удобно. После скейла всегра проверяем все элементы на дробные значения. Так же сейчас данный инструмент получил полезную панель справа, где можно задать направление скейла и параметры увеличения - Frame
Создает фрейм(подробнее о различии видов группировок объектов расскажу в следующих статьях). Во фрейме идет вся основная работа. это страница сайта, или экран баннера или приложения. - Section
Создает секцию в секцию удобно объединять фреймы, для группировки, если на экране у вас начинается каша. - Slice
Создает зону, которую удобно экспортировать, например длинный экран можно порезать слайсами и экспортировать на ровные участки. Или так можно создавать связанные карусели для постов. - Rectangle
Создать квадрат - Line
Создать линию - Arrow
Создать стрелку, в целом стрелку можно нарисовать и другими способами - Ellipse
Создать эллипс/круг - Polygon
Создает фигуру с настраиваемым количеством углов - Star
Работа с звездо-образными фигурами - Place image…
Вставить изображение, одно или группу фотографий - Pen
Векторный инструмент, кривые Безье - Pencil
Карандаш, быстро что то нарисовать - Text
Создать текстовое поле. - Components
Библиотека созданных компонентов - Plugins
Библиотека плагинов, установленных и не только - Widgets
Библиотека виджетов - Hand tool
Рука, перемещаться по макету - Add comment
Инструмент комментирования - Start conversation
Аудио-чат внутри фигмы - Share
Инструменты поделиться - Present
Запустить прототип - Zoom/view options
Настройки масштабирования, и еще некоторые инструменты из меню, сама иконка показывает текущий масштаб макета. - Далее по центру: если ничего не выделено название файла и проекта, тут можно поменять название.Если выбран объект, тут появляются действия из меню.
Панель слева
Панель слева содержит несколько вкладок, первая отвечает за слои, вторая за компоненты, все созданные компоненты можно найти тут
Панель слоев так же разделяется на страницы и слои. По сути страницы это дополнительные рабочие области.
Я в работе часто использую 4 страницы
- Thumbnail
обложка файла - InProgress
Тут все то, над чем мы работаем в текущий момент, все то что нам сейчас нужно в работе. Перешли на следующий этап — отправляем все лишнее в архив чтоб не мешалось - Archive
мастхэв, получили правки, сделали копию всего в архив и только после этого вносим изменения, никогда не знаешь появиться желание откатиться на шаг назад или нет, тут обычно добавляю даты бэкапа с размером текста таким, чтоб видно было из любого масштаба - Review
Сюда скидываем то, что будем показывать заказчику, или то что нужно согласовать, обсудить.
Панель справа
Панель содержит 3 вкладки.
Первая и самая основная для нас, вкладка Design. На этой вкладке находятся основные инструменты с которыми мы будем работать.
По умолчанию, если ничего не выбрано, на этой панели можно изменить цвет фона, и посмотреть стили цвета и текста которые есть в вашем документе(скорее всего вы их еще не создавали и у вас их нет), и кнопка экспорта.
Вторая вкладка, прототипирование.
Опять же если ничего не выбрано, можно выбрать устройство для прототипа, и цвет фона. Состояние когда что то выбрано пока не разбираем.
И последняя вкладка, инспектирование.
На этой вкладке находится все что нужно для верстальщиков, работа с кодом.
Меню помощи
Справа снизу есть кнопочка со знаком вопроса, в данном меню можно найти вспомогательные материалы, горячие клавиши, оставить отзыв, написать вопрос в фигма комьюнити или связаться с поддержкой.
А так же посмотреть обучающие ролики на ютуб от команды Фигмы
Заключение
В следующей статье будем разбирать инструменты объединения объектов в Фигме.
Напоминаю про Телеграм, там можно обсудить все это дело.
Первая статья, введение и обзор
Хлопайте, если вам помогла эта статья и подписывайтесь, чтобы быть в курсе новых статей.
Если есть что добавить, пишите в ТГ