This is the most brilliant explanation of layout and components I've found and so excited to use Figma/Frames/Bricks together. Game-changer! Thanks Kevin!
This video is the best explanation. I watched so many other videos to understand the auto layout and but this video was the life changer. Great work and highly recommend.
Mind sufficiently blown. I was doubting the purchase, but I knew enough to wait until your tutorial. Now I'm glad I bought it. You don't disappoint. Question: how do you troubleshoot? I built my own version, following along with you, but for some reason, my placeholder text didn't expand the container. I checked the components and all appeared to match what you had done as far as Fixed / Hug / Fill values. Future tutorial: When you changed the default values (spacing, font-size, etc.), I'd like to see how you translate that into ACSS on the WP end.
This was an excellent walk-through of some of the primary best practices for using ACSS, tokens, components etc. in Figma - it really gave me a lot of inspiration. And great that you once again take the time to give such a thorough and insightful review. This is priceless stuff. Thank you Kevin.
Amazing content! Your are super clear in your explananations. Your are opening my eyes to what great design and workflows look like. Thank you for the content
Hey there, your enthusiasm for Figma and your ability to explain the intricate details of your design process is truly engaging! Could you tell us about any favorite shortcuts or lesser-known features in Figma that have significantly boosted your productivity?
I completely agree with this comment! Enthusiasm for design tools like Figma, coupled with the ability to share insights and tips, is incredibly valuable for those looking to improve their design skills and workflow. Personally I can say that Figma's presentation mode feature is fantastic for showcasing your designs to clients or stakeholders. It allows you to create interactive prototypes right within Figma, complete with transitions and animations. Great work Kevin!
Passion for design tools like Figma and sharing insights is valuable for skill improvement. Figma's presentation mode is fantastic for showcasing designs to clients. Excellent work!
Nice video Kevin. I really like the approach that Frames for Figma and ACSS Tokens is progressing. This was a great investment on my part. I can definitely see how this will improve my overall workflow, allow me to improve my end-to-end process, and be able to charge more for my website development work. Kudos to you and your team.
Perfect as usual.... One thing Im wondering is, if I would hand this over to development or just do it myself. Where would I see what tokens have been used? In the video it looks like there are just the values set in the right sidebar setting. But of course it hast to be connected to the tokens in order to reflect the changes made to Primary Color, or the global Spacing scale. But where do I see which spacing token has been used to space out the cards body wrapper for example....?
Great video once again! As an Oxygen user, I've just got ACSS and not Frames. Can I get access to ACSS tokens from this subscription or do I need to purchase another product?
It's just a term I use to denote that an element can controlled from one place instead of changes needing to be made to multiple instances of the element.
Hi Kevin. Do you plan to develop the following concepts in future videos on Figma Design Best Practices? - Brad Frost's Atomic Design methodology. - Nomenclatures or taxonomies of components, properties and values of a Design System. - Developer Handoff best practices.
And variables are more a local thing that can break and then your entire project is hosed. Tokens won't fail you like that. Very vague definition of the 2 but there is much more information on when to use one over the other in Tokens Studio videos, etc...
Thanks Kevin. For those who watch this video, what isn't clear is that you need to purchase Frames For Figma to get the ACSS Tokens file. FfF is temporarily unavailable for purchase. I understand it will be back soon (September 2024).
This is the most brilliant explanation of layout and components I've found and so excited to use Figma/Frames/Bricks together. Game-changer! Thanks Kevin!
You're very welcome!
This video is the best explanation. I watched so many other videos to understand the auto layout and but this video was the life changer. Great work and highly recommend.
Mind sufficiently blown. I was doubting the purchase, but I knew enough to wait until your tutorial. Now I'm glad I bought it. You don't disappoint.
Question: how do you troubleshoot? I built my own version, following along with you, but for some reason, my placeholder text didn't expand the container. I checked the components and all appeared to match what you had done as far as Fixed / Hug / Fill values.
Future tutorial: When you changed the default values (spacing, font-size, etc.), I'd like to see how you translate that into ACSS on the WP end.
This was an excellent walk-through of some of the primary best practices for using ACSS, tokens, components etc. in Figma - it really gave me a lot of inspiration. And great that you once again take the time to give such a thorough and insightful review. This is priceless stuff. Thank you Kevin.
Glad it was helpful!
As usual this was a concise knowledge bomb with all the basics one needs to build correctly in Figma, all covered in under an hour - great stuff!
Great content, Kevin, thanks! It's really amazing to see the figma tutorial from somebody that is an expert in a page builder development :)
Amazing content! Your are super clear in your explananations. Your are opening my eyes to what great design and workflows look like. Thank you for the content
Man this is so helpful. I have been fighting some things that I didn't need to GREAT!
Hey there, your enthusiasm for Figma and your ability to explain the intricate details of your design process is truly engaging! Could you tell us about any favorite shortcuts or lesser-known features in Figma that have significantly boosted your productivity?
I completely agree with this comment! Enthusiasm for design tools like Figma, coupled with the ability to share insights and tips, is incredibly valuable for those looking to improve their design skills and workflow. Personally I can say that Figma's presentation mode feature is fantastic for showcasing your designs to clients or stakeholders. It allows you to create interactive prototypes right within Figma, complete with transitions and animations. Great work Kevin!
Passion for design tools like Figma and sharing insights is valuable for skill improvement. Figma's presentation mode is fantastic for showcasing designs to clients. Excellent work!
Great video once again!
Thanks Kevin!
Great video. Looking forward to getting the tokens when it’s opened up.
Nice video Kevin. I really like the approach that Frames for Figma and ACSS Tokens is progressing. This was a great investment on my part. I can definitely see how this will improve my overall workflow, allow me to improve my end-to-end process, and be able to charge more for my website development work. Kudos to you and your team.
Thanks for watching!
Thank you for the video Kevin. Will the LTD for "Frames for Figma" be available again? If so can you tell when approximately?
Not sure yet
Great shirt! 👕
Perfect as usual.... One thing Im wondering is, if I would hand this over to development or just do it myself. Where would I see what tokens have been used? In the video it looks like there are just the values set in the right sidebar setting. But of course it hast to be connected to the tokens in order to reflect the changes made to Primary Color, or the global Spacing scale. But where do I see which spacing token has been used to space out the cards body wrapper for example....?
The token studio panel shows you which tokens have been used on an element.
Great video once again!
As an Oxygen user, I've just got ACSS and not Frames. Can I get access to ACSS tokens from this subscription or do I need to purchase another product?
You can purchase ACSS Tokens by itself soon.
Thank you. You mentioned “single source of truth” a few times, does this have a special meaning?
It's just a term I use to denote that an element can controlled from one place instead of changes needing to be made to multiple instances of the element.
Thanks for a great tutorial Kevin. I have a question.
Why did not you create another card components for option#2 and option#3 ?
You should actually duplicate the component instead. I’m still getting back into the swing of things in figma.
@@Gearyco 🎯 Thank you
I hope something like this while come in Etch.
Create design and when you're done: Convert to HTML & CSS.
Genuine question: why not leverage the new variables feature within Figma for the tokens?
Because they can't do the necessary math functions.
Hi Kevin.
Do you plan to develop the following concepts in future videos on Figma Design Best Practices?
- Brad Frost's Atomic Design methodology.
- Nomenclatures or taxonomies of components, properties and values of a Design System.
- Developer Handoff best practices.
I’ll touch on these concepts yes.
Can you do one using the Frames components?
We are going to do plenty of examples with frames once the next version comes out.
35:35 😍🙏🏻
Can tokens be used for mobile app designs for flutter?
Never heard of flutter
Cwicly is going to be the one to use combined with Figma components. BTW Is the Figma var system not good enough yet to use?
No, can't do math functions.
And variables are more a local thing that can break and then your entire project is hosed. Tokens won't fail you like that. Very vague definition of the 2 but there is much more information on when to use one over the other in Tokens Studio videos, etc...
I think I prefer “Library Kevin”. Lol 😅
Thanks Kevin. For those who watch this video, what isn't clear is that you need to purchase Frames For Figma to get the ACSS Tokens file. FfF is temporarily unavailable for purchase. I understand it will be back soon (September 2024).
FfF re-release date?
Tomi posted update in community