Чтобы создать интерактивные компоненты в Figma для мобильных приложений, можно следовать таким рекомендациям:

1. Для чекбокса. 1 Создайте два компонента — отмеченный и неотмеченный чекбоксы. 1 Затем объедините их в комбайн из вариантов. 1 Перейдите на вкладку Prototype и свяжите чекбоксы друг с другом. 1 В параметрах анимации укажите On click и Instant. 1 Сделайте копию чекбокса и добавьте её в свой прототип. 1 Запустите прототип и проверьте чекбокс: при клике внутри него должна появляться галочка. 1
2. Для кнопки. 1 Создайте два компонента кнопки — одну посветлее, другую потемнее. 1 Объедините их в комбайн из вариантов. 1 Перейдите на вкладку Prototype и свяжите светлую кнопку с тёмной. 1 В параметрах анимации укажите While hovering и Instant. 1 Сделайте копию светлой кнопки и добавьте её в свой прототип. 1 Запустите прототип и проверьте кнопку: при наведении курсора она должна менять цвет. 1
3. Для переключателя. 1 Создайте цветной переключатель — это будет состояние «включено». 1 Скопируйте свой переключатель, сделайте его белым и менее контрастным — это будет состояние «выключено». 1 Сделайте из переключателей компоненты и объедините их в комбайн вариантов. 1 Перейдите на вкладку Prototype и свяжите светлую кнопку с тёмной. 1 В параметрах анимации укажите On сlick, Smart animate и Linear. 1 То же самое повторите со светлой кнопкой. 1 Сделайте копию переключателя и добавьте её на прототип. 1 Запустите прототип и проверьте переключатель: при клике он должен плавно переключаться из одного состояния в другое. 1

Также для создания интерактивных компонентов в Figma можно использовать плагин Figmotion, с его помощью создаются интерактивные прототипы сайтов и мобильных приложений. 2