Hello Reader,
In the last three days, I’ve created more content than I usually do in one week (and no, don’t worry, I’m not about to try and sell you some productivity system 😆).
As I sat down to write this, I wondered what I had done differently to get so much done, and at least some of it was due to a small tweak I made to my workflow on Monday.
I won’t bore you with the details, but I want to talk about the idea of removing friction from our workflows.
A while ago, Dave Rupurt wrote about how people aren’t friction, and Matthias Ott followed up a few weeks later with a post on how friction is a good thing that helps shape our work.
Matthias mostly talks about that friction in terms of talking with people, and the way conversations, and even pushback on ideas, can lead to improving products.
I do think other forms of friction are positive as well. We need boundaries, and often what can feel like overly strict ones can help shape the best work, even if, at the time, they feel like they are getting in the way.
Great products are usually the result of trying to solve a very specific problem, and those products start to fall apart once they start to try to do more.
But I don’t think all forms of friction are created equal.
Some friction just gets in our way (and I do think a lot of the AI tools are just a new source of this type of negative friction, but that’s a topic for another day).
Over time, I’ve often looked to reduce the friction in my content creation workflows, with things like starter templates in CodePen and Notion templates for my different types of content, both reducing the need to repeat things.
Circling back to this past Monday, I sat down to start making some new content, and despite the efforts I’ve put in place, I felt stuck.
Instead of pushing through, I wrote down the things that felt like they were getting in my way.
What I finally realized was that it was part of my workflow I had never really thought about, which was making me feel stuck. It had to do with the transition from ideation to actually creating the content, where I had a pretty terrible setup.
In the end, I only made a small change that made a huge difference.
And all of that was without the help of any LLM or fancy AI tools. I’m pretty sure if I had asked a chatbot for help, it would have pointed me to some extra tool to layer in. Instead, I just wrote down a few things on a sticky note, realized what the problem was, and quickly found a solution.
I still have friction in my workflow, but it’s the good kind.
I still need to plan my ideas, create outlines, and then demos, and I often run into small problems or struggles during those stages that shape my content and lead to better ideas.
So yeah, the next time you feel stuck, or that something doesn’t feel right, don’t jump to the first thing that you feel might be the sticking point (I’ve made 4 CodePen starter templates… that was never the real issue 😆), or try to find a new tool, but write down some bullet points, and you might realize that it was something else getting in the way the entire time.
That thing might be something small and fixable, like what I ran into, or it might simply be the type of friction that helps produce better work, and that’s not something you’d want to remove.
(Speaking of Notion, one of my biggest annoyances with Notion is how they are shoving AI into every aspect of their product. It’s clippy, but worse).
🙋♂️ What I’ve been up to this week the last two weeks
Wrote the entire thing and then I forgot to send last week's newsletter once again 🤦♂️.
📺 Handy CSS layout patterns, and fun ways to elevate them
A look at a few useful layout patterns:
- Easy horizontal scrolling with grid and scroll snapping - at the end of the video, I add a scroll-driven animation to make it a lot cooler 😅
- Auto-fit grid, and preventing overflow when using it
- Using container queries for simple, adaptive layouts - a quick look at corner-shape: scoop at the end of this one
You can find the code from this one here.
📺 My experience talking at SmashingConf Amsterdam
Over on the second channel, I’ve put out a vlog of of experience talking at SmashingConf Amsterdam, giving you a bit of peek behind the curtain, so you get to see a few things I was up to, and how nervous I got before going on stage 😅.
📺 CSS Battle: 10-minute challenge to 100%
It’s been awhile since I did some CSS Battles! Here are the ones I did in this video.
⚡ The easiest, and some new ways, to center with CSS
A look at the easiest way to center with CSS (grid, with place-content: center), as well as a few others, like how we can use alignment and justification in block contexts now, and a fun trick with position: absolute and fixed.
⚡ Making a wrapper, but with 50 lines of CSS
A snippet from my CSS Day talk from a few years ago. You can watch the full talk here.
|
🗓️ Mark your calendar
CSS Day - Amsterdam, June 11th & 12th
Speaking of CSS Day, I’ll be speaking there again this year alongside a pretty amazing lineup of speakers. Ticket prices go up on the 14th of May, so if you can make it, get your tickets soon 🙂.
ZurichJS - Zurich, September 11th
Yup, they invited me to a JavaScript conference! Obviously, a bit of a different type of event to CSS Day, but one I'm still very much looking forward to as well.
|
Free learning paths
I’m really excited to have launched the first two free learning paths on The Cascade!
These first two take a look at Flexbox and Grid. They are curated YouTube videos arranged in a specific order that I think makes the most sense. That might sound like a playlist, but they are more than just YouTube playlists that I’ve moved over to my platform.
First off, the videos on the platform are all ad-free, and more importantly, most videos include a code editor, so you can go picture-in-picture, making it easy to follow along with the tutorial.
I’ve also included recaps after each one with the important points covered in the video, and maybe most importantly, there are some extra challenge lessons mixed in, so that you can practice what you’ve learned.
If you’re interested, they are completely free, and you can find them here.
|
🎙️ Podcast
Are we in a post-expertise era?
In this episode, I talk about why being an expert still matters in a world of AI tools, and how those tools can sometimes make us think we know more than we do. I also touch on imposter syndrome and the importance of knowing what we don't know.
LISTEN ON: APPLE | SPOTIFY | YOUTUBE | RSS
|
|
📝 Quiz time!
It's been a long time since I've done a quiz, so it's a bit tricky, but not too hard.
Which of these would NOT center a single child element both vertically and horizontally inside its parent?
- .parent { display: grid; place-items: center; }
- .parent { display: grid; place-content: center; }
- .parent { align-content: center; justify-items: center; }
- .parent { display: flex; place-items: center; }
As per usual, you'll have to head on over to YouTube to take a stab at the quiz, and once you answer, you'll see if you were right or not.
|
|
🏁
Have a fantastic week!
Kevin
|
Are you looking to step up your CSS? I've got both free and premium courses to help with that! They cover a range of skill levels too 👇
Beginner friendly (and free)
HTML & CSS for Absolute Beginners
A free course that starts with the absolute basics, and gets to creating some layouts with Flexbox and Grid.
Enroll →
|
|
Intermediate
CSS Demystified
For those who've been writing CSS for a little bit now, but want to step up their game and start writing CSS with confidence!
Enroll →
|
|
Intermediate (Frontend Masters)
Build a Modern Site from Scratch
Build a fully responsive site using modern CSS features, along with some polished animations.
Enroll → (25% off first month of Frontend Masters if you use this affiliate link)
|
|