ฝัง
- เผยแพร่เมื่อ 7 ก.ย. 2024
- In this video, learn how to create the typography section of a design system.
You don’t have to learn any theory, or go to fancy websites to do them, do it right within Figma, and maintain it easily!
Hey guys, I've launched a Paid Figma Noob to Pro course that can help you take your Design and Figma skills to the next level!
You can access it here: asaad-mahmood-...
My subscribers and viewers can get a 50% discount by using the voucher "AMSUBSCRIBER".
Extended video here:
• Creating a Design Syst...
Do subscribe, like and hit the notification icon:
/ @amdesignanddev .
Have a project? Send me a message on sales@thesmallsquare.com or contact me on LinkedIn.
/ asaadmahmood .
.
👉 Follow me on LinkedIn and Twitter for more content.
/ asaadmahmood
/ asaadmahmood5 .
Sign up for Figma: psxid.figma.co... .
Subscribe to my newsletter to keep up to date on latest design/tech trends, update, tools and information! 🔥
the-optimal-de...
Hey guys!
Created another video to further streamline the typography process, and it also allows you to change line heights for headings, and font families for the typescale easily (instead of doing it manually)
Scheduled be posted on 7pm GMT+5 on Monday.
I just typed the same thing and found your comment... thank you
You have a way of explaining that is clear, easy to follow, and straight to the point, no extra words. Great job.
Thanks a lot :)
Thanks, man. Making the jump from years of using Sketch and I am blown away by how much easier it is to create type styles using these plugins.
To be honest this is the most clearest tutorial I have watched in youtube about typography. Thank you!
Most underrated YT channel. I watched the complete Figma Design System playlist and learned so much (I'm a beginner). I highly recommend AM Design, keep up your excellent work 👍
Thank you so much :) Do share the channel with your friends as well. Would help a lot.
Thank you for sharing this video
wow thank u! im looking for studying design system and the playlist you have created helped me a lot!
You are such a life saviour. I cannot thank you enough
Great tutorial...Best tutorial for setting up typography in figma...Keep posting more...
Wow, that's Crazy ! Thanks a lot
Thank yo so much for providing us such a brilliant thing ❤️. I never knew that figma cmnd or ctrl + b for bold. 😁. I think couple of things we have to do that manually. For instance, the plugin is giving us only one line height for every scale. Sometime we need more for body or extra small and less for heading.
Yup
Created another video to further streamline the typography process, and it also allows you to change line heights for headings, and font families for the typescale easily (instead of doing it manually)
Scheduled be posted on 7pm GMT+5 on Monday.
It's added a huage value to my workflow, Asaad Mahmood Bhai. Thank's a lot.
Not sure if I missed where you choose the font family. Thx for the content again grate work
Created another video to further streamline the typography process, and it also allows you to change line heights for headings, and font families for the typescale easily (instead of doing it manually)
Scheduled be posted on 7pm GMT+5 on Monday.
Thank you so much for this video! It helped me a lot!!
Hello, your video is so helpful and it helps me a lot. Thanks for explaining it so easy to follow.
thx dude, really helpful, the plugin is sick
Thank you for the detailed explanation
Amazing!! It saved me soooo much time!
Glad it helped!
Awesome video! Thanks for sharing
this is very helpfull video,thank you a lot brooo
As always .... Great ⭐ content
Appreciate it!
Awesome, Thank you very much
Thanks SO much for this video 😄
Super useful tutorial! Thanks
Thanks for this guide.
Great for organization, thanks
Please also tell with example how to use them in your landing page etc because we dont use all of them, then how to apply it
Awesome 😎
thanks AM Amazing Master.
Very helpfull!!!
Thank you so much
really really useful
Which text size and weight is used for CTAs
The Typescales plugin is not showing any button to generate.
Great tutorial. When making the styles bold (6:20) how do I get the typography sidebar to show the weight pulldown? Do I need to unlink the style? Thank you. Ahhh never mind, you explain it at (9:02) :)
Could you explain how to deal with design systems if your app is multilingual? It means that need to create a separate text style for each language what else better do if we use the updated Figma with all the new feature it has.
Thx bro
how do we plan the typography for a mobile application in type scale plugin , what is the base size we should take?
Depends on the app, but I would say 14-16 is a good bet.
I would probably stick to 16px for the base size for most apps.
Do you think it's a good idea to round the line height to the 8pt grid instead of doing 1.2?
Yes, that is better from a grid perspective, but minor compromises are made on consistency, Which I think is fine
how u mange lineheight
Great video AM but it's very hard navigating around the updated typescale plugin
Compare to when you did video
It is simple.
The only thing you need after searching for the plugin name is the name of the creator.
For example:
Typography Style Guide plugin => Hiroki Tani
Do not look at the logo
hi, lets say i copy my design system to an other project and i want to change the whole font family....is there an easy way to do that...?
You can do that with the batch styler plugin.
Check out this video:
th-cam.com/video/-ZzyL87lG1k/w-d-xo.html
Hello
Please can you give me more details about the type scale plugin? I can't find it in my figma community,checked my plugins through but this particular one you used is not available
Is it okay to use others while I'm learning with this playlist?
Typography Style Guide Plug In is not longer available on figma
waiting for color and buttons ^_^
Stay tuned! :)
Those should be done now!
Every time I try to run the Typography Styleguide it fails and says "Text Styles are not found". Anybody knows what's going on?
Do you have text styles created?
Why we are creating these typos?
Why would anyone use 6 headings though?
I don't understand why no tutorial is showing how to go from desktop to mobile size. No is explaining how to do that.
Probably because those are two separate things. For mobile, the guidelines, the patterns, the grid, the component all may be different from desktop.
I can consider doing a mobile specific design system course.
I have covered that in my full course here:
asaad-mahmood-s-school.teachable.com/
You can use the voucher "amsubscriber" to get a 50% off.
Typescales plugin just creating empty autolayout box nothing else.
They fixed the problem, it works fine again.
Hey AM👋
I came through your channel for the first time and just wanted to tell you that the content you are providing is really valuable. 'SUBSCRIBED'
Do you have a LinkedIn or twitter? I am self learning ui/ux design from past few months and it would be really great if I could connect and learn.
Thank you.