How to Make Spacing Feel "Perfect"
33,096
Published 2024-04-15
This week, we dive headfirst into something I think about way too much: spacing. Spacing is what gives UI's that "oddly satisfying" feel when done right, and that "something's off" feeling when it's done poorly. How do you design spacing correctly? Should you use a framework? Let's find out!
Join the CSS Beta!
www.chainlift.io/join-liftkit-css-beta
Join the Figma File Waitlist!
www.chainlift.io/sign-up-for-notifications
LiftKit Webflow Cloneable Here:
webflow.com/made-in-webflow/website/liftkitui
Download Chainlift Color from Webflow:
webflow.com/apps/detail/chainlift-color?category=p…
Questions, Collab Inquiries:
[email protected]
All Comments (21)
-
Would love to see a similar one for science of "Layouts / Wireframes", "Colors", "Typography"
-
I would happily purchase a course where you talk about science of the topics behind all the design fundamentals rather than tooling like figma. As an engineer it would be so helpful the develop an eye for the design.
-
Normally I’m not a huge fan of watching design tutorials, but your last 2 videos about spacing are one of the best design videos i’ve ever watched. Really appreciate the effort! 🎉❤
-
The tutor understands design systems very well. This channel has a promising future. I'm glad I found it.
-
Me with no understanding of css, just here enjoying how visually satisfying this video is
-
Play button was a nice highlight. Of course, just defining the center as halfway between the rightmost and leftmost point of the triangle is wrong, since there is “more” of the triangle to the left. So what we should be doing is using the centroid of the shape. This gives a better point to use to define the center, from which we could then define the spacing in a way that looks optically correct
-
yaaaaaaas you cannot believe how excited i got when i saw that it’s part 2. thank you you’re the best ❤❤❤❤
-
Man! Your videos are always so satisfying to watch. I’ve been waiting this video since part one. I was so amazed by the quality of your videos and the animations and overall the knowledge you are able to provide so effortlessly. It simply amazing thank you very much for your hard work and for teaching us this incredible stuff.
-
Man see correct spacing man happy
-
this quality is so insanely good
-
This is one the best videos on spacing that I've ever seen. Thanks so much!
-
These videos are very useful to me. I don't use CSS since I'm developing HMI screen interfaces (kinda GUI applications) but find the lessons here to be pure gold. Thanks
-
This is awesome. You have a great delivery.
-
Script was on point, as well as delivery and visuals. Thoroughly enjoyed this and the previous video. I'm not a graphic designer nor work on anything around this, so you can know the video is that good. Keep up the great work. Subscribed to enjoy what's next.
-
this is incredible! very enriching but also accesible and intuitive!
-
4:51 I see the secret sauce. 1.618 the golden ratio 😏 it's crazy how it just works but super effective. I saw your previous video and really really liked how you showed visual examples such as the one where you showed changing the font size of the browser and how that affected seemingly two identical cards. It's so subtle but super effective when it comes to understand
-
Thank you I need this. You are a life saver, and btw incredible video editing skills!
-
Great job Garret! Another great video. 👏
-
an eye pleasing perfectionst video :) Thank you! I have learned something new as a UI Designer
-
hell yeah, part 1 was so good, glad to see a part 2
