Найти тему

Фигма. Варианты.

Оглавление

Варианты — дополнение к компонентам. То что раньше все делали через "костыли" теперь есть в фигме. Данное обновление сделало работу удобнее быстрее. А с новыми лэйаутами так вообще красота.

Как было раньше

Для того чтобы сделать несколько вариантов кнопки, иконки, карточки ну или любого другого компонента, раньше нужно было делать несколько компонентов и через "/" указывать путь компонента и в этот путь добавлять другие варианты этого компонента. Стандартный вид, ховер, не активное состояние, ошибки. Все это нужно было добавлять таким образом. Некоторые добавляли всё что есть в один компонент и меняли видимость, но в целом такой метод считался неправильным.

Как-то так это выглядело, для каждого компонента с несколькими видами, думаю логику вы поняли.

Слева, в слоях видно, как нужно было создавать варианты компонентов.
Слева, в слоях видно, как нужно было создавать варианты компонентов.

Что есть сейчас

И так, что же сделали сейчас. А сейчас для того чтобы сделать несколько вариантов достаточно создать компонент(как это сделать можно прочитать в этой статье) и нажать на кнопку «Add New Variant».

Добавление варианта
Добавление варианта

Добавим несколько вариантов и посмотрим что можно еще сделать

Несколько вариантов компонента
Несколько вариантов компонента

Добавив варианты мы видим что в слоях у нас остался один компонент, и у него есть несколько материнских компонентов.

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

После того как мы создали все возможные варианты мы можем добавить компонент в наш дизайн и с помощью одной кнопки поменять вид данного компонента.

Как поменять вид варианта.
Как поменять вид варианта.

Варианты использования

Я все еще тестирую это обновление, сейчас дошел вот до такого использования, пока не уверен в жизнеспособности данного решения ну посмотрим, а вдруг удобно будет

До чего я дошел с вариантами
До чего я дошел с вариантами

В данной работе я и настраивал варианты и ограничители. Мне было достаточно удобно работать как разработчик(образно, естественно). Работа идет над блоками, а вместе они собираются только для того чтобы оценить целостность картинки.

Ограничители кстати тоже обновили, скоро напишу статью по автолэйаутам новым и там затрону ограничители.

Заключение

Если хочется комплексно пройтись по фигме, у меня есть персональные консультации по данной программе.

Если у вас есть вопросы вы можете писать мне в телеграм или инстаграм.

Если вам необходим дизайн сайта, или создать сайт на конструкторе, так же можете писать, покажу примеры работ, все расскажу и сориентирую по стоимости.

Спасибо за ваше внимание, и уделенное время, для прочтения статьи, надеюсь она вам поможет.

Мой сайт vladislavgrigorenko.ru