Patterns Day 2017

Any web design agency that lives on the front-line of internet technology needs to take in a conference every so often so when we heard about Clearleft's Patterns Day we booked tickets in an instant.

Patterns Day at the Duke of York's Picturehouse, Brighton

Jeremy Keith's Clearleft is an agency with a huge amount of respect and admiration in the web design and development community and they are no stranger to curating, organising and hosting hugely informative and enjoyable events so when we heard they were putting on Patterns Day at the Duke of York's Picturehouse down in Brighton we were hugely excited.

Pattern libraries or design systems are the hottest topic in web design right now but to put it in layman's terms, they attempt to find a consistent and extendable approach to website design that enables a site to grow in a consistent manner without needing constant reinvention or a full redesign.

In any pattern library conversation you'll hear people mentioning Brad Frost's atomic design principles or the concept of modular design but what you won't hear is a definitive how to... explanation. That's understandable because no two sites are the same so there won't ever be a one-size-fits-all approach but, well, I digress, let's get back to the event...

Following a swift drive down the south-bound M roads we arrived in Brighton just in time for hot coffee and delicious pastries and then into the beautiful Victorian auditorium for the first speaker, Laura Elizabeth, who took us through the concept of design systems and highlighted the ever popular Lonely Planet style guide.

Following Elizabeth we were treated to talks from other leading lights in the patterns community, namely: Ellen de Vries, Sareh Heidari, Rachel Andrew, Alice Bartlett, Jina Anne, Paul Lloyd and Alla Kholmatova all introduced by Jeremy in his inimitable style.

Sareh Heidari spoke about how the BBC use their own framework called Grandstand, which builds upon GEL foundations.  Sareh gave an overview of Grandstand and how it consists of object and utility classes along with example markup and class names, which followed familiar BEM syntax. Sareh also presented some interesting uses of mixins to aid the BBC with localising their CSS for right-to-left languages such as Arabic. This was accomplished by using a Sass variable to change the text direction globally, which could then output a localised build of their CSS for right-to-left languages.

Rachel Andrew's talk I found particularly interesting as she talked about how she'd utilised Clearleft's Fractal component library during the redesign of Perch CMS. Rachel talked about using a "pattern library first" approach, which I really liked and also making that pattern library the "source of truth". So with Perch CMS it isn't possible to edit the CSS in the product itself only within Fractal, which is a great way to ensure the pattern library remains up-to-date.

Alla Kholmatova's talk looked at how teams were implementing design systems such as pattern / component libraries into their workflow and the on-going maintenance and stewardship of them. She found some organisations were quite open to allowing new patterns into their libraries, which tended to dilute their effectiveness. A balance is needed between accepting new patterns, whilst not allowing a pattern library to become too bloated.

Overall, the content of the talks ranged from technical to abstract but each and every one was interesting and inspiring in its own way and we left with heads full of ideas and ready to begin designing and developing our own pattern library for use in our upcoming projects so watch this space to find out how we get on!

You might also like...

Progressive Web Apps

Michael Walsh by Michael Walsh