Less rigid design systems
In The Design Systems We Swim In, Ethan Marcotte asked a thoughtful question about design systems: Does the system you work with allow you to control the process of your work, to make…
Design, Page 6
CSS Animation Timelines: Building a Rube Goldberg Machine
Lately I've been using variables to plan out pure CSS timelines for complex animations. I built an SVG and CSS Rube Goldberg machine to put this technique to the test!
Navigation for Design Systems and Style Guides
A key part of my job for the past year has been contributing to design systems. To benefit from those contributions though, users need to be able to find them. That’s why it’s…
What Flushing Toilets Taught Me About Web Design
I re-learned an old design lesson from the humble toilet flusher. As new features are added to existing technologies, careful design is required to make their usage clear.
Staggered Animations with CSS Custom Properties
Movement in nature doesn’t happen all at once. Imagine a flock of birds taking off, raindrops splashing on the ground, or trees bending in the wind. The magic of these moments comes from many small…
Get More For Less With Variable Fonts
I recently worked on a project where the topic of variable fonts came up when discussing typeface legibility. I had heard the term before, but I wasn’t quite sure what a variable font was. Curious, I did…
Some Design Advice
A loosely organized and inexhaustive list of feedback and suggestions I frequently give designers.
CSS Circles
I accidentally became Cloud Four's resident expert on dynamic circular containing elements. Here are my tips and tricks.
Cooperative Design Systems
Strategies for when the goals of your project, team or users diverge from those of an established design system.
Jagged Little Pill: Issues with Rounded Buttons
A technique for overcoming touch target size and content clipping issues with pill-shaped and circular buttons.