Всем Привет
Сегодня хочу рассказать новеньким в дизайне, как пользоваться переменными (Variables) в Figma. Это простая и удобная функция, которая поможет вам быстрее и эффективнее создавать дизайны и этому обязательно нужно обучиться.
Первое что нужно сделать, это создать переменные (Variables)
Переменные позволяют задать общие значения для элементов дизайна, например, цвета, размеры, отступы, сетку и шрифты. Все это позволит сделать дизайн единым и аккуратным. Если нужно изменить цвет или размер, достаточно изменить значение переменной, и все связанные элементы обновятся автоматически.
Но тут важно понимать, как настраивать все эти переменные, как называть их и вообще логику всего этого.
Каждый делает по своему, но я пообщавшись с программистами и изучив в целом эту тему пришла к следующему:
Важно для каждой группы создавать свои цвета. То есть, если мы работаем с текстом, это отдельная группа. Иконки тоже создаем отдельно. Фон, кнопки, декор и так далее.
Далее про наименование.
Как обозвать то каждую переменную?
У меня логика такая, если используется часто - это primary, далее идет его инверсия - invert, потом уже minimal, secondary и так далее. И в целом получается как на скрине. Текст - это отдельная группа, в которой свои группы и переменные, цвет - аналогично.
Надеюсь было полезно.
Если у вас есть вопросы или вы хотите поделиться своими советами, пишите в комментариях!
Удачного дизайна!