Create your type information, sort scale, and model coloration scheme and switch them into shared kinds, grids, and typography to kick off designing a design system from scratch.
Figma is free to make use of. Enroll right here: https://bit.ly/2WRIe6s
Figma File: https://www.figma.com/neighborhood/file/867135839870202854
#Figma #DesignSystem #DesignSystems #UXDesign
source
Can you post the link to the flexible grid system? I wish there was a way to search comments it's probably here already.
Does anyone know why he's increasing or decreasing the spacing by percentage because 'it might not maintain the right relationship doing -1, because that's a fixed value.' What does this mean? Maintain the right relationship to what?
Thanks!
This is gold! Thank you
in middle he is telling about sharing the article from where we can learn the line height , but i am not getting it where he have mentioned that.. can anybody just help me.
Amazing video, thank you!
Not good
I have checked his file and I found out that the line height of the
Boldis set auto.Why are line height of
BodyandSmalltypo style are set? Although others are auto.10:00 wtf doesn’t he say the name of website he’s looking at!
The more complex designs I’m creating, the more I love and appreciate design systems 🤩
why did you also make use of the multiples of 8 after using 1.62
awesome!
This is way to long. No CUSTOMER F cares about this. Just grab the Roboto fonts from Material and move on to real work haha 😆
Society of power of 2^
For some reason, i felt people work in Figma always choose to use bigger font size. However if you look at the website, even this website, you will see the base case is 14px. Not only that, the <h1> is only 20px. Shocking?
Why does he keep copying the 16px font and multiplying so many times instead of copying the last created font and simply multiplying it once? You know what I mean?
is this the genuis who made figma?
Can you also make a video on how to "use a design system" to create different layouts and end user screens?
really great! but please resize or use a laptop to record bc unless someone is using desktop to watch this, its impossible to read
just a STYLE GUIDE VIDEO…NOT a design system at all. Terrible that people look at these things for expertise. It is why the field is polluted with people like this.
would you provide links to those Typo Sites?
This is an amazing resource. One thing I would love to see is that if you could list the plugins you used in this video in the description. Thanks.
I'm two years late, this is cool-overwhelming stuff. love the FONTS t-shirt!
I have a question about the font size choices – If you end up just adjusting the font sizes to 14/16/24… and so on then what's the point of doing all of the multiples of the Golden Ratio? Shouldn't there just be a standard font size and line height that is always used in any application or design system?
thank you very much for this support for the community.
I love Figma – thank you for making the tool & resources to educate designers around the world! – Fellow Product Designer
23:15 – The shortcut to increase or decrease font size is Cmd+shift+<>
For anyone looking for an intro to creating styles in Figma (rather than how to develop a typographic brand identity), skip straight to 28:20.
You got me at golden ratio
for those who want to scale text with cursor only, I figured it out, the shortcut is "k" just press it and now you can scale anything with cursor only
Thanks buddy ✨✨✨
The other person doesn't even blink
Great video sir,
Can I use this design system for my freelance work?
Thank you for your video!
I just have one question: Why do we need so many Typography styles? Is it for WEB and APP? App's screen is small, I am not sure about very big and very small sizes…
For the love of god, please to use the 4pt or 8pt grid system lol
18:00
thank you so much for your help)it is a great video!!
Your style of talking and comedy reminds me so much of Mac in Always Sunny. Also great stuff, super helpful.
What about multiple-font type systems? Anybody have any good links?
I hope nobody else saw that License Key 🤣
Really, really poorly done.
would be nicer, if the speaker didnt love the sound of his own voice. Substance gets buried in authors over active mouth
Great stuff thanks for sharing! I talk about design systems in Figma too! We use Figma at Microsoft and love it 🥰
Does Figma allow for text style overrides similar to sketch for attributes besides color like weight, capitalization, italics, etc? Would like to avoid creating alts if possible.
Answer to is there a Shortcut to Half or Double font sizes (actually any ratio is possible).
Short answer YES
|
|
I used to use Adobe Illustrator a lot and when I started using Figma, I instinctively tried a trick a I used to use.
Double. click the Font Size in the properties., or click after the last digit. Simply type the equivalent mathematical symbol
Multiply is *
Divided is /
+, – speak for themselves
Then type the number relating to what you want it to do. Use a comma between numbers for things like half. Such as 0,5
Example
My font is 16
I write
16 /2
Hit enter/ return on keyboard
It changes to
8
I want my line height to not be auto.
I type:
16*1,5
Hit Enter
It switches to
24
Or type
32/2
Enter
It becomes 16
Etc….
I use this all the time for quickly making spacers using scales, taking a frames dimensions and dividing it by 5 to give me that divided by 5 design ratio.
Working out corner radii for containers with a certain amount of padding between them and the round cornered inner element; inner radius + padding = outer radius perfectly concentric.
Maths stuff, but really simple, useful maths stuff!
Explore and see how you can use just typing equations behind numbers in the RHC.
the dark mode background tip is fire
that woman creeped e out for an entire hour hahaha
"Hold on… I have a small pet hair on my mouse that is not allowing me to do anything." – This is why I'm here. 🤣
He has the knowledge but he is impossible to listen to. It's like he's going out of his way to be "cool" and approachable, rather than owning the fact that he's giving a class with the goal of teaching people a specific skillset. Speak with authority and for god's sake stop the "uptalk".
can somebody link the articles here?
i learn lot thanks mentor.