09 Nov Independence, atomic design and free beer – a smashing trip!

Mid-October was the time that our lead designer Justin took his annual sabbatical to the wonderful city of Barcelona to expand his knowledge and download the latest information from the minds of design industry practitioners at the Palau de la Música Catalana, a fabulous world heritage site in Barcelona and location for the third edition of ‘Smashing Conference Barcelona’.

Smashing Media was founded in March 2009 by Sven Lennartz and Vitaly Friedman in Freiburg, Germany, and provides a range of services for the international Web design community. Their team of dedicated Web geeks constantly strive to improve the quality and range of products they provide to creative professionals. Through their articlesdigital booksjob resources, and industry conferences, they are committed to stimulating creativity and strengthening the digital design community’s creative forces.

The main reason why SmashingConf exists in the first place is because they believe in sharing, and they strive to bring people together. Annual conferences in locations like New York, San Francisco, Toronto, Freiburg, London and Barcelona are the stage for experts working on real life projects to share practical techniques, ideas, strategies, failures, lessons learned, and successes in an informal, open-minded, welcoming environment.

I was at the conference in Barcelona last year too and although I have a choice of events in other countries I seem to prefer rubbing shoulders with designers and developers from all over Europe. As well as bringing back valuable industry knowledge either from a design related perspective, or information on emerging web technologies for our team of developers it’s a great place to meet others in the industry that have the same kind of experiences as us even though they are from another country.  I was looking forward to another few days of talks this year and listening to the opinions of other like-minded individuals or teams from companies that happily send their employees to such a creative and knowledgeable event.

Independence on Sunday

I was due to kick-off my quest for knowledge at 8.30am sharp on the Monday morning before the Smashing Conference got in to full swing on the Tuesday, with a pre-booked all-day workshop, so arriving early on a hot and humid Sunday morning, I was left with plenty of time to get settled in to to my apartment on the ‘Avenida Diagonal’, (a main thoroughfare that intersects the north and south of the city), unpack and unwind with a stroll through the grid-like maze of streets that make up the local neighbourhood.

I lived and worked in Spain for 12 years and have a practical knowledge of the language and after a few weeks of western media banging ‘Catalan Independence’ down our throats and images of police brutality appearing on our tv screens every few minutes I was keen to find out if the Barcelona I love would be different this time, but even the hustle and bustle of this amazing city was unchanged, albeit the locals appeared to be in a reflective mood after the recent violent events. The talk in the cafes was vocal and unswerving though, the Catalan flag was flying and the independents were on the streets and making themselves heard at every opportunity.

After filling my face with a variety of traditional Catalan fayre, numerous ‘vasos de vino’ and the varied opinions of a few locals I decided to retire to my apartment to get ready for the following morning when I would be making my way on foot to the IED Barcelona Design University, located in the nearby neighbourhood of Gràcia for my workshop with Brad Frost, entitled Atomic Design: Process and Patterns.

I arrived after a brisk and somewhat humid and sweaty journey on foot at the IED Barcelona at 8.30am on the dot and was immediately impressed by the location. The IED Barcelona is located in a space of more than 5,000 m2 and was inaugurated in 2011. The building, conceived by the studio Franconi González Architects in collaboration with ProA Solutions studio, is the result of reforming and restoring a former textile factory of Gràcia, a neighbourhood with a strong personality and a long industrial tradition.

The new Higher School of Design is composed of four floors where values and benefits of ‘Design for All’ are integrated with the aim of stimulating creative experimentation and dialogue between students and different disciplines. The building gives priority to open and flexible spaces, distributed over the first and second floor, which facilitate intervention and collective work. The rest of the building houses the classrooms, the Media Library and the workshops; adapted to the different training areas of Fashion, Design, Visual Communication and Management for Creative Industries. Some of its spaces, such as the Aula Magna and the Open Space, are also devoted to conferences and events.

The IED Barcelona is an education centre and an observatory of trends and research, and its main objective is to reflect and educate in the field of design in an interdisciplinary manner. To this end, the school has developed countless projects with professionals in the sector, students and companies from all over the world since its arrival in Barcelona in 2002. Its range and relevance of courses was amazing and it was easy to see why there had been a continual stream of designers, geeks and young wannabes to try to avoid bumping in to on my way to the location.

A ‘frosty’ start to SmashingConf…

Brad Frost is a web designer, speaker, writer, and consultant located in Pittsburgh, PA. He is the author of the book Atomic Design, which introduces a methodology to create and maintain effective design systems. In addition to co-hosting the Style Guides Podcast, he has also helped create several tools and resources for web designers, including Pattern LabStyleguides.ioStyle Guide GuideThis Is ResponsiveDeath to Bullshit, and lots more.

I recently purchased Brad’s first published book (you can also read it for free at: http://atomicdesign.bradfrost.com if you are interested…) and after reading about the theoretical benefits of using his approach to achieve consistency in front-end development, I was looking forward to him providing a more practical explanation of his techniques for style guides, design systems, and pattern libraries that provide a solid ground for designers and developers to stand on as we tackle the increasingly diverse and fast-moving web landscape.

After a hurried registration in the foyer and a quick coffee, I sat down and rifled through my freebies, listening to Brads’ interesting Spotify playlist of funk anthems in the background, as we all settled in and made quick introductions to our neighbouring seats. The full-day session with Brad didn’t disappoint, even with his jet-lag in full effect, he tackled all that goes into making and maintaining successful interface design systems with enthusiasm and plenty of wit, a never ending repertoire of slides that he finally, thankfully ran out of time before showing us them all. Promising more slides (groan) in his opening speech at the main conference in the morning, we all left with our ears ringing, but with a spring in our step as we contemplated the mass of knowledge we had acquired on a very informative day.

To go into a bit more detail, Brad covered the following list of subjects, which goes to show why all of us that attended had a variety of aches and pains in our brainpans as we tried to process and slot it all away in the relevant boxes on the journey back to our digs.

  • Atomic Design Principles — covering core principles of modular UI interface design and discuss considerations around atomic design, a methodology for crafting robust, deliberate design systems.
  • Selling Pattern Libraries — Tactics and tools for selling pattern libraries to clients and stakeholders, and detail on how to create an interface inventory to pave the way for style guide success.
  • A Pattern-Based Process — Discussion on why front-end development is an essential part of the design process and demonstrate how tools like lo-fi sketches, style tiles, element collages, Pattern Lab, and others facilitate collaboration — and result in successful design systems.
  • Style Guide Maintenance — Tactics and techniques to ensure that your pattern library stays in sync, and your design system provides lasting value to your organisation.
  • UI Patterns — Look at flexible patterns for tackling layout, navigation, images, data tables, and really anything else you can include in an interface.

By the end of the day, we were fully armed with masses of notes and all the insights and resources we possibly would ever need to create, sell, and maintain effective interface design systems, so being the fact I was in the city that never sleeps, it was time to go back to the apartment and shower before leaving for a pre-conference Jam Session I had also arranged to visit later on.

‘Soaking’ up the ambience at the end of the day

Making my sweaty way down the road (the effects of the shower didn’t last, it was way too humid) I stopped off to get some photos at the amazing Sagrada Familia and arrived at the ‘Antiga Fabrica Damm’, Estrella Damm’s headquarters and conference centre on the Carrer del Rosselló. This former beer factory is now a space for concerts and other performances related to the world of live music and has a wonderful design throughout.

Shopify, a major Ecommerce platform were hosting an evening of micro talks from some of the fellow attendees at the conference who were offered the chance to get on stage and make a presentation. We listened to a number of short presentations before making our way to the snacks, drinks and networking! Many thanks so much to the lovely sponsors Shopify and Estrella Damm for the free beer so we could enjoy the finer things in life as we networked into the evening.

If you haven’t heard about Shopify yet, just over a decade ago they started an online store to sell snowboard equipment directly to those who loved the sport as much as them. They could have listed their products on a number of marketplaces, but they wanted to own their own brand and build relationships with their customers, alongside just selling their goods. Such a tool didn’t exist, so they built it themselves. They soon realised a number of other stores were in need of a hassle-free platform to build their retail business, and so Shopify was born! They focus on making commerce better for everyone, so businesses can focus on what they do best: building and selling their products. Today, merchants use their platform to manage every aspect of their business — from products to orders to customers, selling online, in retail stores, and on the go.

‘Unlocking Creativity’ was a presentation on how to build beautiful websites with Shopify templates by Liam Griffin, Shopify’s Partner Education and FED Advocate who braved hurricanes in Ireland to give us a view under the hood of Shopify’s new sectioned themes and to learn how we can use them to build highly customisable websites.

I especially enjoyed ‘Building lighthouses through design’ a presentation by Bastian Koch, Creative Director at Haufe Group who recently developed a holistic design system for their 86 year old company and in ‘The good, the bad and the ugly’ by Mathias Eckert we heard about the basics of communication and feedback and looked at examples of good and bad feedback and got some useful tips to improve both within your team. The ‘amateur’ presentations were informal but very informative and chatting with the presenters afterwards confirmed how genuinely passionate they were for their work. A good sign of things to come in the professional presentations coming up over the next few days!

Stuffed with nibbles, slightly unfocused because of copious amounts of beer (did i mention it was free?), I decided to finish off a busy but productive day by strolling back to my apartment, but found that I started to up the pace as I was brought back to reality by being confronted by images of a city in the middle of an identity crisis and becoming increasingly surrounded by numerous pedestrians adorned with separatist flags, shouting and jangling their keys. My perambulation was suddenly interrupted by the crashes of pots and pans on the looming balconies above and the blaring of car and motorbike horns in the street as the independents made their feelings heard to all who would listen. Picking up the pace so I wouldn’t become surrounded by a massive crowd that was coming down the road, I turned to move out of the way and came face to face with a line of Policia and Guardia Civil advancing from the other direction! Not keen on becoming a slightly squashed but independent ‘bocadillo’, I sprinted the final 100m to the safety of my apartment and probably the fourth shower of the day. Did I mention it was humid?

And that’s just the first day! I’ll continue the article about the Smashing Conference at the Palau De La Musica. Check back soon to read further…

Social Media Image Sizes – What You Need To Know

Keyzo Celebrates Living Wage Commitment

Return to our blog for more design and technology insights...