Figma variables - Number variables prototype

In this video I will share with you how you can improve your prototypes using number variables to create counters for your websites, dashboards, SaaS. You don’t need to create multiple screens to exemplify one idea, you just need one frame and adjust all the variables and conditions to make everything work. Number inputs are similar to text inputs, but contain controls used to increase or decrease an incremental value. 

Comment if you found this video helpful.

Watch these next videos
Create button component:
Create component properties:

Timestamps
0:00 Intro
0:11 Calories example
4:24 Card with multiple counters
5:50 Group variables
7:50 Copy interactions

Working file:

Thanks for watching this video. 🫶

If you consider this video helpful to your learning and work consider leave a comment with your feedback. That can help me to continue creating this type of content to help your growth.

Connect with me on social media

#figmavariables #variables #figmaprototype

[RicardoCostaDesign]

Thanks for watching. Hope it was valuable for you. Let me know in the comments if it helped 👇

[johannklein]

What if the default value is a text then after incrementing it shows the number value. Is that possible sir?