Trying Figma variables for the first time 🤔 breaking my brain

Подписаться 227 тыс.

Просмотров 3,8 тыс.

50% 1

Variables is a new feature Figma announced at Config, and I recorded the process of my trying to use them for the first time! Did I succeed? Did it break my brain? Did I make a big mess in our design system? You be the judge 😅
🚀 CharliMarieTV is powered by Figma! charli.link/figma
Figma is a design tool that helps teams create, test, and ship better designs from start to finish. And it's free! :)
Want to know more about the illustration system? Watch this video! • Creating an illustrati...
Watch my Config vlog: • What happened at Confi...
TIMESTAMPS:
0:00 - I've never used Figma variables before!
0:50 - Creating color variables
2:40 - My first attempt at a setup
7:30 - Trying to create different modes
11:00 - The moment of truth!
12:00 - The issue with variables
Please remember to click subscribe if you'd like to see more of my videos.
--------------------------------
// WANT TO SUPPORT MY CHANNEL?
Become a ✨channel member✨ and get a cool icon next to your name in livestream chats, plus priority replies to your comments. Just click 'Join' (it's next to the subscribe button)
Or, if you like, you can put something in my tip jar right here: pages.charlimarie.com/product...
Sharing my videos or recommending my channel to a design friend is also very much appreciated! :)
--------------------------------
// ABOUT ME
I'm Charli and I'm designer from New Zealand currently living in Valencia, Spain. I’m the Creative Director at a remote tech company called ConvertKit and I post videos about the design projects I work on and the tools I use, as well as vlogs of my life as a designer. I regularly livestream what I'm working on in Coworking Club streams. Welcome to the channel! Please subscribe and say hi in the comments, and maybe we'll see you in the live chat on the next stream.
💬 Twitter: / charliprangley
📷 Instagram: / charliprangley
--------------------------------
// MORE
Join my free weekly marketing design newsletter: charli.link/newsletter
Buy my hand written font, Grayscale: charlimarie.com/font
Book a mentoring session with me: charli.link/mentoring
My site & blog: charlimarie.com
Design Life podcast: designlife.fm
Inside Marketing Design podcast: insidemarketingdesign.co/
--------------------------------
// TECH & TOOLS
📹 Get links to all the tech hardware I use to make my videos (and the art on my gallery wall!) right here: charlimarie.com/shopmyoffice
💻 Software I use:
Webflow (no-code website builder)*: charli.link/webflow
Premiere Pro (video editing)*: charli.link/premierepro
Adobe Audition (audio recording)*: charli.link/audition
After Effects (intro animation)*: charli.link/aftereffects
Figma (web design): charli.link/figma
Photoshop (thumbnails)*: charli.link/photoshop
ConvertKit (marketing platform): charli.link/try-convertkit
Riverside (podcast interview recording)*: charli.link/riverside
Music in this video from Epidemic Sound*: charli.link/epidemicsound
Video captions by Rev (very cost effective service! I recommend)*: charli.link/videocaptions
Intro & end card animation by Austin Saylor: www.austinsaylor.com/
Editing by Belén Albiol / molen.audiovisual (or sometimes by me!)
Links marked with a * are affiliate links. I can't believe you read the whole description box! You get a ⭐️

Опубликовано:

31 май 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 13

@DavidCarmonaUX 8 месяцев назад

This is the type of stuff designers live for... thanks for entertaining while teaching

@bunnipop1867 8 месяцев назад

I'm trying to learn this too -sob- thank you for also being confused it makes me feel better.

@osaroadade 8 месяцев назад

This was really fun to watch. This has definitely given me the bravery to look into variables. Thanks as always for the behind the scenes and bringing us along with the brilliant chaos. Also, welcome back!!!! Cheers

@ACallander22 8 месяцев назад

To take it a step further, you can set a specific frame to be "red, blue, green" and once you drop one of those variables onto that specific canvas/frame set, it will set anything in there as that color set.

@ryanunderwood6827 8 месяцев назад

I love the variables in Figma. My biggest gripe is that I cannot do calculations in numbers... yet. The brand I'm building the DS for has odd and specific measurements for spacing and height of a gradient bar accent. I'd love to be able to create a number variable for the type size run ($type-size * .6) to get the spacing I need and output that as $gradient-bar-spacing. Then wrap that output to ($gradient-bar-spacing * .25) to get the height of the bar. Essentially meaning the bar spacing and height is automated to the type size and only need to update the type size variables. Easy is CSS/SCSS not so much in their variable set up.

@freetopain8634 6 месяцев назад

Hi I have a problem on figjam, I've done a lot of work on a board but now my professor said to scale it to 100%. When I zoom to fit it says 6% and if I scale it everything is chaos. I tried to make a mini version of it but now when I'm in 100% the sections are too little and the text is huge even at 4 pt. Idk what to do. Do I have to start over?

@chriscardoso 8 месяцев назад

This was fun to watch! How exactly are you animating the movement of your mouse and camera position? Is that a tool in your editing software or screen recording tool?

@chloeatchue-mamlet6764 8 месяцев назад

Something annoying about swapping modes is that the dropdown is so low on the sidebar where people aren't looking (not near the variant dropdowns). So design system users might not know they can swap between all those colors and backgrounds. I feel like they're great for making it easier on design system maintainers but make it harder on the designers who use the system.

@iamSkYliNeR 8 месяцев назад

Since color theming is not a thing on the app I'm working on, I decided to not use them. They look like such a hassle to set up and use too, especially when you have a lot of existing Figma files. I feel like I could never justify having to use them sadly..