Designing Inspired Style Guides

“Style guide” is an umbrella term for several types of design documentation; static style or visual identity guides, voice and tone, front-end code guidelines or component/pattern libraries. These all offer something different but often have something in common. They look ugly enough to have been designed by someone who enjoys configuring a router.

In this fast-paced talk, Andy will demonstrate ways to improve how style guides look and make them better at communicating design information to creatives without it getting in the way of what technical people need.

Font stacks with CSS variables

You would have seen generic font families like serif, sans-serif or monospace before at some point, but the CSS Fonts Level 4 specification introduces a few new ones, like system-ui.

Seb will share with us how he pony-fills this cutting edge feature using CSS variables so you can use system-ui font stacks today.

Building responsive CSS components

Learning to build reusable components without adding complexity to your code is crucial when building websites in our age.

Have you wondered if it's possible to accomplish this feat in pure CSS without turning your code into a bloody hacky mess? How would you structure your code? How do you think about components? What about scaling? How do you deal with components that need to be placed in wildly different areas?

In this talk, Zell aims to share his experiences and approach to building responsive, reusable components. He even goes deep into design principles and how they can shape your CSS.

Creative Text Effects with CSS

Interesting and impactful text is often deemed a “print only option”. But we can have those effects now with real web text.

So let’s have some fun with text! In this talk, Mandy will show you how to make effects with accessible, searchable, and selectable text (Without the need for complicated markup or JavaScript).

We’ll explore a variety of techniques including pseudo elements, clip-path, blend modes, gradients, transforms, variable fonts and more to create interesting headings, layouts and even emojis.

Sometimes it’s easy to forget the power of CSS but there is a lot you can do with a little creativity.

Love the web for what it is

The web is a unique medium on its own and we need to establish a new normal for the web, breaking it free from the shackles of static print design. This new normal involves ceding control of our designs to the browsers that render them rather than constantly engage in this battle to dictate where every pixel should fall.

We've always been trying to transfer ideas and concepts from a static medium like print, onto a dynamic medium like the web. But their difference in nature has caused quite a bit of grief. Perhaps we should be taking a different approach to designing and building for the web, a way that better suits the nature of the medium.