I've summarized the main points 1. Importance of Line Height in Typography: Good design involves appropriate line height, with the recommended range being 1.1 to 1.3 times the text size for headings and 1.3 to 1.5 times for body text. This improves readability and the overall aesthetic of the design. 2. Letter Spacing Makes a Difference: Adjusting the space between characters, known as letter spacing, can enhance the design. Negative letter spacing is suggested for headings to add a certain crispness but should be avoided for body text to maintain readability. 3. Proper Text Alignment is Essential: Avoid center-aligning long paragraphs, as it can slow down reading speed. For anything that spans more than three lines of text, left alignment is recommended. Also, avoid mixing alignments between headings and body text. 4. Considerations for Text Width: Based on a study by The Baymard Institute, long lines of text can overwhelm users, leading to less engagement and lower conversions. A good range to maintain is 50 to 75 characters for body text, with around 600 pixels width for a desktop screen. 5. Hierarchy,: Avoid overusing text sizes to indicate hierarchy. Try to stick to two different font sizes, using font weight and color changes for hierarchy. 6. Spacing: Consider the space between text elements; elements with closer relationships should be positioned closer. Use multipliers to maintain consistent spacing between elements.

@florians.6402

10 ай бұрын

Not all heroes wear capes

@hamzamo.7180

10 ай бұрын

you dropped this 👑

@calimio6

10 ай бұрын

You missed "consistensy". It seem obvious but having a subset of rules means nothing if they are applied ambigously through a site, book or any other material. If an icon is at an odd place is going to look weird but if your design iterates over that, then is a key part of the design language.

@subhamghosh5335

10 ай бұрын

King!

@jaguar81gt10

8 ай бұрын

thank you so much man

Watch this in 1.5 speed

@TimGabe

7 ай бұрын

haha, slow talker!!

@Dormirnix

6 ай бұрын

I did it and I love it in 1.5x tnx I'll be doing this for slow talkers now

@namaefumei

6 ай бұрын

Slow is fine. Many of us aren't native English speakers. Thanks for the video!

@demihau

6 ай бұрын

i’m not native but its still slow

@gnack420

5 ай бұрын

You're not kidding haha

_"Whitespace is an active element"_ This is not just applicable in graphical / UI design: I taught my colleagues the same thing in terms of coding style. A blank line doesn't hurt while typing, but improves readability immensely and also serves as an indicator for logical blocks of statements, thus helping to keep a more "organized" code. The requirement (and benefit!) to the programmer is that s/he would have to _think_ about how to best group their statements and what they actually do, effectively resulting in a "two-pass" process of writing code and verifying it. Step two -- rearranging logical blocks into groups of similar types of code (declarations / assignments vs. pure statements) -- would be the next resulting optimization pass; however, this is not about typography anymore.

@devroom8904

10 ай бұрын

You are totally correct about the readability of code. White space is very much necessary, we learn this in time just like UI/UX designers and the points made in the video.

@svenyboyyt2304

7 ай бұрын

Not using a code formatter is a crime.

@WoodymC

7 ай бұрын

@@svenyboyyt2304 Weeell...not exactly. However, not being able or not willing to properly adhere to a given format is -- regardless of having an automated formatter at hand or not.

@eamax

7 ай бұрын

I like the term negative space. It feels much more intentional and active than something left "white".

@thomashayes3783

6 ай бұрын

Literally just started learning code a few days ago and I already naturally am trying to do this, I think? It feels natural because of the similarities to writing in paragraphs in normal human language. Blank line above and below a block of text that are probably related to each other functionally. I don't even know if I'm making sense at the moment, I'm so new. Haha!

Currently in my IxD major we have 3 typography classes, learning typography is so important.

@TimGabe

Жыл бұрын

yes... it's so underrated among people (my younger self included) that haven't dabbled in design before. 😅

@VidarrKerr

10 ай бұрын

There is a reason why there are so many font styles and how and why people privately own fonts. It is so confusing in the beginning of learning. A watching a video about, reading about, or generally studying the history of typography is worth the time.

@owcaandroid

10 ай бұрын

@@VidarrKerr yeeah, I absolutely agree but it is not simple. I started to read about that while ago and still have many issues among different apsects in that field. So many questions and in the end all comes to "feeling" when you are watching your piece and just thinking "hmm there is sth wrong BUT I DONT KNOW WHAT IS IT omg mayhe kerning? Nooo, maybe weight?" xD

@awsom3202

10 ай бұрын

You’re studying computer science?

@Always-gloomy

8 ай бұрын

@@awsom3202the major is interaction design

I’ve been watching a lot of your videos recently and just subscribed. I love the balance between practical advice and keeping them concise. Keep up the awesome work Tim 😎

@TimGabe

Жыл бұрын

that's so nice to hear, Alan. 🙏 I will take that feedback to heart and make sure that I stick to what people like. thanks a lot man!! 😃

Couldn't agree more! It's incredible how a few well-chosen tips can revolutionize your UI work. Learning from the experiences of those who've been in the field for years is like unlocking a treasure chest of wisdom. The fact that these tips promise not only to save time but also to elevate the overall look and feel of UIs is incredibly enticing.

@TimGabe

8 ай бұрын

right?!

I've been doing UI for couple of years, and still learned a lot from this video! Will definitely be doing things differently now! Thanks for quality content, I'm watching them all :)

@TimGabe

Жыл бұрын

that is so cool to hear. I love it when I’m able to help people who have been in the space for some time 😃

You earned a like and a follow just from that first hack you shared. As a new designer struggling to find a place, having concrete numbers to rely on as a base is really helpful. Thank you so much !

Just as a small hint, you can give percentage values in Figma input fields. So instead of writing the font size times 1.2 you can just write 120%.

@adamkatsu9795

10 ай бұрын

Yes, it's also more convenient for devs to use percentage so we don't need to adjust the px in every screen breakpoints.

@mormatus

4 ай бұрын

The use of a multiplier is even simpler, no need to maintain the mental model for percentage

The video quality is awesome The way the explanation is fun with the application of tips One of the best videos explaining typography ⁦❤️⁩⁦❤️⁩⁦❤️⁩

@TimGabe

Жыл бұрын

wow, thank you Rony. I put a lot of time into this one, so I’m very happy to receive feedback like this 😍💜

I just discovered your channel through this video and I love how you take your time to talk and explain everything in detail even giving examples, thank you so much :) I'm a graphic and ux/ui designer and your videos just helped me understand a lot!!!! Thank you!!

@TimGabe

6 ай бұрын

that's amazing to hear, thank you for the support and the thorough comment!!

Subscribed. Love the brief, straight to the point, value packed content. Thank you.

Awesome tips! I really appreciate how you gave us concrete numbers to work with and not just explain how things are supposed to work in theory! 🤓👍

@TimGabe

Жыл бұрын

happy you liked it, my friend 🥳 and thanks for the comment!!

Hey Tim, as a new UX designer preparing to enter the field, I really like what you’ve shared and found it really important. I’ll take it forward with me, thanks a lot

When I started up In UI/UX design, I never considered letter spacing in my practice projects and I'd wonder what they weren't looking as good as I wanted. But videos like this helped me improve on my "type use"

@TimGabe

Жыл бұрын

me neither - took me a while to realise how much of a difference it really makes 🤩 happy to hear that you found videos like this helpful, my friend!

Absolutely incredible content. Thank you Tim!😊

this video was fantastic, gave me a good insight of how to think of UI and design and also a new perspective! thank you so much! video was great with all the descriptions and before after effects when you applied what you were talking about for each hack.

@TimGabe

5 ай бұрын

thanks a lot for sharing this, peywan! appreciate it!!

Thank you for videos like these. While it is easy to get carried away by fancy looking prototypes and animations, it's the basics like these that keep us grounded in creating meaningful designs.

@TimGabe

8 ай бұрын

exactly my friend!

Your videos are awesome, congratulations! The quality is unbelievable

Great lesson and examples. I would have loved to see the original design and updated design side by side.

@SyntekkTeam

8 ай бұрын

I struggled with this too, it was hard to appreciate the before and after when everything was moving

@TimGabe

4 ай бұрын

heard this a lot (and that it was too fast)... learned from this though, and in an upcoming video that is similar i've made it much more apparent!! 😃

Great video, I love the way you explain things, its super clear, love it !

@TimGabe

Жыл бұрын

makes me genuinely glad to hear this. thanks a ton 🙌😃

Underrated video. Some of these tips took me a way too long to figure out on my own, solid tips

Another video that put into words what I've been using for years without knowing how to explain it! Thank you so much!

Great video! Some key points were highlighted that I hadn't heard anyone else discuss. Thank you!

Great lesson. Although the comparison between the before and after designs is somewhat unfair because in the last design, you used colorful background instead of a grayscale one :D But, everything is improved in a great way, so, it`s OK in the end.🤩 Still, an awesome video! Thanks for such great and elaborate content!

@SkylluszYn

Жыл бұрын

A lot of improvement from just outright having less copy as well. Which is a good marketing lesson, so long as you aren't a designer forced to work with sales copy from a client - in which case you'd likely want to lay this out differently to accomodate.

@TimGabe

11 ай бұрын

thank you!! definitely does a lot, as well as the length of the copy!! super important aspects for creating beautiful looking stuff 🥳

@maxkosek

6 ай бұрын

Yeah and the text was modified what is no always allowed while designing. Most of the time I am provided with the text which content I you not touch, you can inform client that it looks bad but many of them will refuse to cut and insist on it as important value. So it’s much harder to apply such changes. And in this edit not only colours are used differently in compared samples but also the text was just cut which is often very problematic

As a person coming from a software engineering background this is a really helpful video. I've always wondered what were the "hard truths" that made a design good and this definitely help me have a outline

@TimGabe

7 ай бұрын

that's amazing to hear, my friend! 🤩

Love it!!! So many actionable tips, thanks Tim!🤗

Awesome presentation of information in your videos! Really helpful but also interesting to watch, and good speed to receive the info. Keep it up!

@TimGabe

Жыл бұрын

thanks again, Kassiopeya! 😃 so nice of you to put time into a comment like this!

Great video, well explained with awesome use of visuals etc. Thanks for all the effort you put in. It really shows 👌😎

@TimGabe

6 ай бұрын

appreciate it, thank you!!

Really well explained Tim! As a designer, articulating these are so important for our clients, especially when most of the world doesn’t have much of what I describe as visual and content design literacy (and yet our societies have incredible maths, science and language literacy thanks to content design they consume across two decades of learning). Many of the books we learnt on in my generation barely cared for how design impacts learning. But I’m hopeful that things will change for education in the decades ahead as learning becomes more mix-content, AI assisted and as the new generation of young people becomes increasingly more media savvy.

Brilliant! Thanks for delivering such helpful information in a concise and easy-to-understand way!

@TimGabe

4 ай бұрын

appreciate the love, my friend!!

I've been a self taught designer for over 30 years. While I accidently followed those rules, I never realized I was doing it. Instead, I spent way too much time adjusting elements until they "looked" right. THANK YOU! You just saved me SOOOOO much time!

@TimGabe

4 ай бұрын

i did the exaaaact same thing!! happy it was helpful 😃

Man i dropped here like a week ago, by an accident, and now i can tell that i'm soo thankful for those multiple videos and tutorials which you create !

@TimGabe

Жыл бұрын

so happy to hear it, my friend 🥳💜

I love this. This is my first time on this channel and it was a lovely one. Thank you.

@TimGabe

7 ай бұрын

happy you liked it, friend! 🤩

Absolutely amazing video, and explained the concept so well!! Thankss!

@TimGabe

Жыл бұрын

thanks for supporting, Kunal!!

As a "forced to do design work" in my current job and not something I have actually studied I find all of these "hacks" a. very easy to implement, b. easy to understand, c. they just make sense. Thank you!

Loved the video and the speed. I actually paused and rewinded the video to take notes. Thanks Tim!

@TimGabe

6 ай бұрын

thank you so much, my friend!

OMG, love your video! Thank you for sharing awesome tips 🙌

@TimGabe

5 ай бұрын

happy to be of help, afidas! 😃

This video is super duper useful!!! Wish I found your channel and watched this earlier. Thank you so much for sharing❤❤❤❤

@TimGabe

Жыл бұрын

thanks for all the love, Mona! 🤩💜

absolutely amazing. thank you so much please make more videos like this.

@TimGabe

4 ай бұрын

have one upcoming!! thank you for the nice comment 😃

This is an enormous helps me (a developer). Now I won't need to keep moving and changing things around until I finally feel good about it. Thank you

@TimGabe

4 ай бұрын

happy i could be of help, friend 😃

great video - thank you so much !! simple and i will be applying it immediately 👍

@TimGabe

Жыл бұрын

happy it was helpful, my friend 😃

Super helpful thank you!!

Awesome video, Tim! Keep it up, cheers 🙏

@TimGabe

Жыл бұрын

thank you so much Lioks! 🤩🙏

These were so well thought out that I immediately subscribed!v Looking forward to checking out your older videos!

@TimGabe

4 ай бұрын

thank you so much, glad you're on the team!!

Your narrative, voice and articulation manners sounds really comfortable. Enough to subscribe to your channel right after watching this one video. Cool content🥕

@TimGabe

6 ай бұрын

that's a really nice comment, michael! thank you!!

Absolutey awesome tips and superwell explained. Thanks!

@TimGabe

5 ай бұрын

thank you, my friend 😃

It was a much-needed video. Thank you very much.

@TimGabe

9 ай бұрын

thanks a lot for commenting, my friend!!

Thank you for sharing these tips, concise, to the point, great tutorial👍👍👍

@TimGabe

9 ай бұрын

happy you liked it, Alex!

Thank you so much! Such great content! I’ve just subscribed!!!

@TimGabe

6 ай бұрын

happy to hear that you liked it, my friend 😃

Amazing,amazing staff.Thanks!

@TimGabe

6 ай бұрын

thank you for the comment!!

Very informative and entertaining. Enjoyed the video!

Thank you very much Sir Tim

I love how you go just to the point and don't waste our time. You sir just got a new suscriber.

Good tips. Your content is very premium!!!! Man make more videos on UI designing ❤

In my opinion, this is the most well-explained explanation of this topic I have heard !!

@TimGabe

5 ай бұрын

wow, thanks a lot vanessa!!

Great tips as usual, thanks a lot Tim ! :)

@TimGabe

Жыл бұрын

thank you so much Nathan. 🙌🥳

This is the first video I saw summerising actual guidelines with numbers. Thanks a lot!

@TimGabe

9 ай бұрын

happy you liked the numbers, Mica!

Great video, calm and clear voice and great content :D thx

@TimGabe

9 ай бұрын

thanks a lot Marko!

Thank you so much for sharing this knowledge and experience! It’s invaluable! ❤

@TimGabe

3 ай бұрын

happy to be helpful, friend 💜

This was really a worthy watch! Thanks

@TimGabe

Жыл бұрын

thank you so much for the nice comment 🤩💜

Some great technical tips! Thank you

@TimGabe

6 ай бұрын

appreciate the comment!! thank you!

Astonishing content Tim 🔥🔥🔥 🚀

@TimGabe

8 ай бұрын

really appreciate it, my friend 😀

Man, I learned these 'basic' things through years of trial and error and assumption. Really wish someone told me the exact values back in the day. I almost envy the kids who are new to design nowadays. Anyways, great video, informative, short and sweet.

@TimGabe

Жыл бұрын

haha, me too Lamia! now, the trial and error will always be there... but imagine skipping those unnecessary detours though 😅 thanks for commenting and sharing the love! 🥳

First video I watch from you, it appeared to me in my homescreen, I really liked it. Thanks for sharing and cheers from 🇦🇷!

@TimGabe

4 ай бұрын

always happy to see that the videos spread across the world!! 😃 salut!

Muchas gracias por los tips prácticos hermano, es algo que buscaba en específico 😎👍

@TimGabe

6 ай бұрын

de nada, hermano! 😃

your videos really send high quality vibes!

@TimGabe

Жыл бұрын

really appreciate this, Noy 🙌☺️ thanks!!

In so glad someone brought this up I'm not alone at last

This one was really good. Much more clearer about distances👍🏻

@TimGabe

5 ай бұрын

happy you liked it, friend! 🙏

absolutely wonderful, useful info, thanks a lot!!!

@TimGabe

4 ай бұрын

great to hear you liked it, alex! thanks for commenting!!

This is crystal clear, and i'm french so really your good to explain all this stuff ! thk you so much !!

@TimGabe

4 ай бұрын

amazing to hear that the content translates well across borders!!

@user-jq9cg4eb5k

3 ай бұрын

​@@TimGabe Yeeah 😉! all around the world !

Your video is very supportive ❤ I have already subscribed to your channel. Keep working ^^

Nice to see your subscribers has multiplied by 10x. Great content. Subscribed.

@TimGabe

9 ай бұрын

thank you so much! 😃

this was great, thanks Tim 👍🏻

@TimGabe

9 ай бұрын

appreciate the comment, my friend!!

very insightful, Loved this, you get my sub bro

@TimGabe

4 ай бұрын

thanks a lot, friend!!

Hooolyyyy. This is really good video mate ;) Thx a lot for your tips!

@TimGabe

Жыл бұрын

appreciate it a lot, my friend 😃🙏

Solid points here. completely agree!

UI designer here, really like the style and quality of your videos. One thing I noticed, you like to 2x the CTA in relationship to the copy beforehand. I feel it becomes kind of isolated that way and I like to give it the same visual spacing as headline to body copy.

@TimGabe

3 ай бұрын

you're right, you don't want it to become too separated and feel like it's a completely isolated element generally for me, as long as there aren't other "groups" of elements that could be linked to the CTA (and confuse), i feel it's fine to go a bit overboard with the spacing! 😃 but still, a good point!!

Value packed content! Thank you for sharing

@TimGabe

Жыл бұрын

so happy you liked it John! 😃🙏

Great video. This helps me understand why I like some designs more than others!

@TimGabe

5 ай бұрын

that's awesome! thanks a lot for the comment!

For more people and channels like Tim Gabe. cheers!

This is one of the best tips I've seen on youtube congrats on the channel

@TimGabe

8 ай бұрын

really appreciate those kind words, my friend! 😃

You have been the most helpful people in my career change thank you for teaching us all this

@TimGabe

8 ай бұрын

that's such a powerful comment!! thanks a lot!

Literally the most enlightening design tutorial I have ever come across.

@TimGabe

4 ай бұрын

that's incredible feedback. thank you trevor, that means a lot!!

fantastic advice, thank you!

@TimGabe

9 ай бұрын

happy to help, Hashim!

your vid quality is better than before😊 and also thx for contents 👍

@TimGabe

Жыл бұрын

thanks you!! lots of hours went into this edit… 😅🙌

Thanks - big help!

super helpful video, thank you!

Really nice video Tim

Amazing Tips. These Hacks are insane level. Thanks a lot. Best wishes for you!

@TimGabe

Жыл бұрын

really really appreciate it, my friend 🤩

This was extremely helpful - thank you.

@TimGabe

11 ай бұрын

happy to help!!

you earned a subscriber, well done 👏👏

@TimGabe

5 ай бұрын

thanks a lot, internet friend 😃

Really great video, thank you!

@TimGabe

5 ай бұрын

appreciate the kind comment, thank you!!

Hi Tom, I must confess, I came across your channel last week and it has opened my eyes on alot of topic, like applying boolean and variants etc, thanks so much. I have a problem I think you can solve, there is this design system I've been dissecting to understand and I've not been able to find out how they added a boolean property to a dark mode variant of a component, please it will be lovely if you do a video on that, and yeah I've subscribed and hit the like button, you're the best.

@TimGabe

Жыл бұрын

Elkanah, what a thorough and kind comment 🙏 thank you for sharing this, it's very appreciated! 😊 I've been getting more and more requests about this, so I think I'll have to start planning out a video on creating your first design system. 👌😃

Extremely well explained! These are great tips for junior UI Designers like me. :)

@TimGabe

7 ай бұрын

happy it resonated!!

Incredible explanation, and before and after representation between each hack, Please share more like that, Thanks a lot

@TimGabe

7 ай бұрын

thanks a lot for the feedback, my friend!

Okay this is just genius. Loved it. Learnt a lot!

@TimGabe

11 ай бұрын

that's great to hear!! thank you for commenting 😃

This content is a gem. Thank you so much❤

@TimGabe

5 ай бұрын

glad you liked it!! thanks for sharing 💜

Great explanation and demonstration … here you are my subscription ;) Thank for sharing

@TimGabe

9 ай бұрын

appreciate it, my friend!!

Excellent video on typography! Such an underrated area of ux design.

@TimGabe

4 ай бұрын

thank you for the kind comment, nate!!