Field trip: CSSDay 2022

On a whim, I decided to attend CSSDay(s) this year. Not because I am that much into CSS, I am a product designer after all. I leave the CSS’ing to the experts, apart from the occasional tinkering on my own websites. It was the line-up that convinced me and heck… an opportunity to go on a field trip after being locked up for all this time… too good to pass up.

I am glad I didn’t pass it up. CSSDay delivered! My key takeaways:

CSSDay 1

Jeremy Keith [In And Out Of Style]. I found Jeremy particularly skilled in storytelling and creating a shared context to make his point later. He made me realize that CLOCKWISE could have had a different meaning if analogue clocks had been invented in the southern hemisphere. Assuming clockwise was derived from the direction of a sun clock. He professes his love for principles (principles.adactio.com), which I loved. And moreover, he promotes the principle of material honesty. One material should not be used as a substitute for another. If only we could have proper date pickers or styling of the expanded state of the <select> item, right?! Keep an eye on open-ui.org.

Rachel Andrew [Interop 2022] Before Rachel, I hadn’t heard of ‘Interoperable’. I did know that browser compatibility is one of developers’ biggest (if not the biggest) frustrations. It’s a relief to hear that the biggest browsers are collaborating to fix major issues and improve websites’ interoperability. The topics they are working on are exciting and open possibilities for designers too. Read more web.dev/interop-2022/

Lea Verou [CSS Variable Secrets]. Lea explains how variables in CSS are currently mostly used for constants, but that barely scratches the surface of its possibilities. She made me wish I was better at math. I know I want to be, perhaps I should learn. But yes I want so much.

Bramus Van Damme [The CSS Cascade, a deep dive]. Bramus touched on a very complicated topic of specificity and especially cascade layers. But he explained in such an excellent way that I swear that even I got it. I mean I even think I can have grown-up talks with my developers now on the topic. Perhaps I can even school them. I feel that confident.

Ana Ferreira [Collaborating without Borders]. Ana works at Doist (I love Todoist) and talked about how they’ve always worked remote and what they do to make work work. What I particularly liked it the effort they take to include the personal exchange. The post-weekend-chitchat if you will. They work asynchronous and have fewer meetings than most of us (WSJ article).

Chris Lilley [Escaping the sRGB Prison]. Chris explained many details about colours and what is on the horizon for us to have nicer colours. I mean, haven’t we all struggled enough with brownish-orange or purplish-blues? Sadly, we need to struggle a bit more, but soon though… help is on the way, dear!

Marcin Wichary [I pressed ⌘B. You wouldn’t believe what happened next]. Marcin was a huge part of the reason I went to CSSDay and his talk didn’t disappoint. Far from it, I was entertained, delighted and amazed. I even took pictures from the screen, it was that good! It had typography, Figma and history on keyboards (can’t wait for his book, will buy it blindly). I always knew what a messy world the font industry is, but his talk revealed how that can make application builders’ lives a living … well it’s not pleasant, okay? I have a new appreciation and I won’t complain about ⌘B in Figma again.

CSSDay 2

For day 2 I sadly had to miss Adam Argyle [Oh Snap!] and I hear it was really good.

Michelle Barker [Creative CSS Layout]. Layout, ah in the context of CSS it’s a touchy subject between developers and designers. Some of the basic knowledge I have on grid and flexbox had a proper landing after Michelle’s talk and I had an epiphany over a discussion point in my team. I think I wanna have a crack at the issue myself to see if I understand it enough. Would be a hoot if I manage to resolve the problem and the discussion, right?!

Amit Sheen [Getting Creative with Keyframes]. I realized that one of the issues I have with math is that my visual thinking brain sometimes has problems with getting into that state of mind. Amit’s solution to draw a graph to figure out which keyframes to define was so crazy stupid simple, it was actually genius. Like his CSS-only animations, crazy genius.

Ben Evans [The Joy of CSS]. Speaking of genius, you haven’t seen CSS art like Ben Evans’ art codepen.io/ivorjetski It’s all CSS! He tried a Bob Ross-like painting session showing us his process, but it became very apparent that Ben has tremendous patience and focus. Some of his pieces took him about a year to complete.

Maike Klip [Service Design and Front End Interaction] a dutch researcher shared her journey to understand the role of empathy in digital government. She didn’t shy away from subjects like the “Toeslagen affaire” and the frakking in Groningen, leading to property damages. In her research, she was triggered to map out her own touchpoints with the government and all relations. It resulted in this massive Miro board, that you’ll find very impressive. Her final point (and the point she was trying to make with the title of her keynote “When you work in design or tech, you work in politics”. We as developers and designers sometimes ship products that aren’t very helpful (for the end-users). There might be a lot of political reasons why it turns out the way it does, sometimes we feel like we have no control over what and how we ship and we may hide a bit behind the politics. “It’s not up to me”. Perhaps we forget we have the power to create a positive impact if we are willing to lean into the discomfort of politics and dare to push back. If only we would take ownership of the thing we are creating and dare to ship the right thing (and not just a thing that’s released on time and meets most requirements). Ugh, don’t get me started… I may write a longer post on the subject. Are developers and designers merely the executors or are they allowed (or expected) to have a say? Or is that too inconvenient?

Tab Atkins-Bittner [The Future of Organizing Your CSS]. Another fancy term I learned ‘Shadow DOM’, but I need to confess it’s still a bit fuzzy what it is. This talk might have been a bit too technical for me.

@stephenhay [When Design Systems Lie] I’ve followed Stephen for what seems forever and I don’t think I had to opportunity to hear him speak before. His point was that we – in general- use Design Systems as glorified component libraries.

A collection of components is not necessarily a system. We need an understanding of how components interact with each other and within their context, the environment.

Another important point he made, was the fact that Design Systems cannot predict the future. It ~~might~~ will bite you in the ass when you let a Design System dictate your design decisions. Bam!

After calling out designers for being professional daydreamers with powerful tools, he did underline the importance of beauty (aesthetics or form). Form is part of function.

Aesthetics are part of function and form the purpose of the system(form follows function). The system codified agreements about aesthetics but this is secondary to them.
– Stephen Hay

Lastly, he pointed out that even though the Design System should inform (not dictate!) design decisions, so should CSS. Designers should have more extensive knowledge of the possibilities to be able to make better-informed design decisions.

Glad this professional daydreamer took the time from her design job to get better informed about the state of CSS today.