Token Studio also lets you generate calculated values (i.e. reference the primary color and apply a 60% opacity). I've actually been finding that using Token Studio when you need to use more complicated systems makes way more sense. However, you can build your token collection so that it hooks directly into Figma's variables (and styles) so you don't lose all the great functionality that are built into variables (like mode switching).

@UICollectiveDesign

5 ай бұрын

Great call out!

I'm glad you made this for 2024! The previous one was 6 months ago and I'm curious about the improvements Figma has made over those months to their variables.

@UICollectiveDesign

5 ай бұрын

Glad you found it helpful! I'll keep filming new comparisons as updates are made

Ty for the video!

@UICollectiveDesign

5 ай бұрын

You're welcome!

This video was so insightful, appreciate it🙏. Btw what’s your thoughts on border width, shadow, opacity and spacing. Should they have seperate variable collection or not. If not why apply variables isn’t it kinda waste of time?😅

@UICollectiveDesign

5 ай бұрын

Check my second most recent video :) covers these!

Just what I needed.

@UICollectiveDesign

5 ай бұрын

Sweet! Happy it's what you were looking for

Thanks for sharing it. What does the mapped collection stand for?

@UICollectiveDesign

4 ай бұрын

I would watch our token setup video to better understand!

Would love to see an updated video after they have release the type variables from Figma.

@UICollectiveDesign

2 ай бұрын

Just on vacation for a couple weeks. I can film another when I return since type variables are now out.

@timothychinye6008

Ай бұрын

He actually did that: kzread.info/dash/bejne/oJONt7x_Yqvcaco.html

@UICollectiveDesign

Ай бұрын

@@timothychinye6008 More type variable content is on it's way :)

Looks like Figma, covers all the font topics now.

@UICollectiveDesign

Ай бұрын

Yup! Will be filming an updated vid when I'm back from vacation

I think you don't get how Figma Variable works, all tokens are supported for both tools

@UICollectiveDesign

2 ай бұрын

Not at the time of this video :) Will film an updated one soon.

I discovered that I had to right click AFTER selecting the border number so it becomes active, THEN I'm able to see a context menu like in this demo. That was not very intuitive. It's not even stable, it "trembles" and goes away at times. Wow, that's Figma for'ya. Not very UX oriented ironicly enuff. Same response with fill color. Anyways, great tut.

@UICollectiveDesign

5 ай бұрын

You need to two finger tap on it. Let me know if this works!

@Underhills

5 ай бұрын

Tap? I'm not using a tablet or a pad. I'm not using a laptop. But if I were I would use a mouse there as well.@@UICollectiveDesign

@Underhills

5 ай бұрын

I replied this yesterday but my post is gone. To put it short, I don't use a laptop or a tablet. I'm interacting with mouse only.@@UICollectiveDesign

What about exporting json files?

@UICollectiveDesign

Ай бұрын

Tokens Studio!!

I appreciate your effort in making videos, but can you increase the volume of your voice/audio? It would really help your subscribers.

@UICollectiveDesign

5 ай бұрын

Can definitely do so for the next video! Thanks for the feedback :)

You can just make text styles no biggie

@UICollectiveDesign

5 ай бұрын

Exactly!!

in reality you don't need so many tokens, only color tokens are enough to create dark mode. Designers doing too much useless work.

@UICollectiveDesign

3 ай бұрын

I don't disagree, but some brands do require all these tokens. Crazy to think about!