Как использовать логическую формулу в Figma

Фигма известна как одна из лучших программ для графических дизайнеров во всем мире. Его функции являются всеобъемлющими, помогая пользователям создавать что угодно: от привлекательных логотипов до уникальных целевых страниц. Примечательно, что логическая функция (также являющаяся частью обновления свойств компонента в 2002 году) позволяет создавать собственные фигуры путем объединения их слоев с помощью нескольких формул.

Здесь вы узнаете, как использовать логические функции в вашем следующем проекте.

Параметры логических формул для пользовательских фигур

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

Вы можете найти логический значок с двумя перекрывающимися квадратами в верхней панели вашего интерфейса. При нажатии на него в раскрывающемся меню появятся четыре варианта формулы.

К этим параметрам формулы относятся:

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

Помните, что вам нужно будет выбрать две или более фигур, прежде чем вы сможете эффективно использовать логический параметр в верхнем меню. Это связано с тем, что Boolean объединяет несколько слоев фигуры только в одну пользовательскую и сложную фигуру.

Использование свойства замены экземпляра Figma

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

Хотя логическое значение является важной частью этого, пользователи также могут использовать экземпляр поменять недвижимость. Вот как это сделать:

Выберите элемент вашего дизайна.
Перейдите в меню смены экземпляров в правой части интерфейса и щелкните его. На значке изображен ромб со стрелкой.
Присвойте свойству имя, например “icon” во всплывающем меню и установите галочку, например.
Выберите «Создать свойство». Затем Figma отметит свойство компонента, где изначально было меню подкачки.
Создайте копию своего дизайна, выделив его и используя команду CTRL + C. Затем расположите экземпляры рядом.
Выберите новый значок в меню свойств отмеченного компонента, щелкнув по нему. Это автоматически изменит элемент в экземпляре.

Функция замены экземпляра создана для удобства. Используя опцию замены экземпляра, вы упростите процесс проектирования, быстро переключая варианты (экземпляры) параллельно.

Использование параметра свойства Text для простого изменения экземпляра

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

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

Выберите текстовый элемент в своем дизайне.
Присвойте элементу имя, например “text” и значение “кнопка” прежде чем нажать кнопку «Создать свойство».
После этого вы сможете изменить текст и поэкспериментировать с формулировкой призыва к действию.

Свойство text удобно использовать вместе с параметрами замены экземпляра и логическими параметрами.

Как использовать свойства варианта в Figma

Благодаря новым обновлениям компонентов в Figma вы можете создавать несколько вариантов и управлять ими с правой боковой панели. Это поможет вам более эффективно менять текст и значки. Вы также можете контролировать другие аспекты дизайна вашего варианта. Давайте посмотрим, как это сделать:

Выберите свой дизайн и нажмите «Добавить вариант»; в верхнем баре. Удерживая левую кнопку мыши, нажмите на свой дизайн и перетащите вариант прямо рядом с ним.
Вы&rsquo ;Обратите внимание, как второе свойство варианта появится на правой боковой панели. Измените название свойства на “button” и значение рядом с ним — «красный».
Эти свойства теперь будут обозначать ваш вариант. Если вы выберете исходный дизайн, вы заметите, что значение снова изменится на “default.”

Часто задаваемые вопросы

Могу ли я создавать логотипы, используя логический параметр?

Технически, логическое свойство позволяет объединять несколько фигур, используя их пути. Хотя это может быть способом создания простых логотипов, варианты ограничены простыми формами, такими как эллипсы. Вместо этого лучше всего использовать инструмент «Перо» для таких задач, как создание логотипа. Вы по-прежнему можете использовать другие обновления компонентов, чтобы упростить процесс наложения слоев.

Могу ли я изменить шрифт с помощью параметра свойства текстового компонента?

К сожалению нет. Свойство текстового компонента позволяет изменять текст, а не шрифт. Однако вы все равно можете выделить текст и найти подходящий шрифт на правой боковой панели.

В каких случаях мне понадобится использовать вышеуказанные свойства компонента? ?

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

Упростите процесс проектирования с помощью свойств компонентов в Figma

С помощью таких опций, как Boolean, вы можете создавать новые пользовательские фигуры из комбинации старых. Это делается через верхнюю боковую панель с четырьмя вариантами формул. К ним относятся объединение, вычитание, пересечение и исключение. Аналогичным образом вы можете использовать другие параметры свойств компонента, такие как свойство текста и замена экземпляра. Это позволяет легко создавать варианты с различными компонентами. В конечном итоге использование свойств компонента помогает упростить процесс проектирования.

Какие сложные фигуры вы создавали с помощью логического параметра? Считаете ли вы, что параметры свойств компонента также просты в использовании? Дайте нам знать в разделе комментариев ниже.