Top tips from the UpFront Conf that we implemented straight away!

Me and my fellow BB Front-End Developer, Andy Blackledge, recently attended UpFront Conf 2015 – a new conference for the Front End community held here in Manchester.

Eight presenters took to the stage to share, enlighten and excite us with their recommendations, innovation and expertise. In this article, I’ve focused on the talks that gave us some tips that we could implement straight away.

Atomic Design - Brad Frost

Brad’s talk explained how Atomic Design is a system of designing and building websites in small, modular and reusable components, as opposed to pages.

This validated a lot of the processes we go through in the front end team at Building Blocks; we build front end prototypes of websites in small components, ready for our back end team to integrate into a CMS.

A few ideas came out of Brad’s explanation of Pattern Lab to add to our style guides, and I’ll be looking into it more as I now know there’s a Node version in the pipeline!

pattern_lab

Front End Testing - Alicia Sedlock

Alicia is a woman after my own heart; automating front end testing is a huge passion of mine, and it was great to hear her talking on the subject and providing strong arguments for getting testing into your workflow straight away.

I asked her for a couple of one-liners that I can give to non-tech folk to persuade them of the clear benefits of spending time on front end testing. I think her recommendation of, "do you want bugs to go through to production?" is a compelling enough reason! 

I particularly enjoyed the section on unit testing, as it’s something that I’d love to implement with our front end team.

The part of her talk on CSS regression testing with PhantomCSS reinvigorated my desire to get this into more projects. I've revamped my own presentation on the subject, ready to share with the rest of the company  in the coming weeks.

presentation_screenshot

Faster Mobile Websites - Dean Hume

Dean’s talk gave us a great insight into how to improve speed by optimising our code and websites as a whole.  He told us that when Amazon manually added a 100ms delay to their page load, they lost 1% of their sales! If that’s not an argument for spending time on page speed, then I don’t know what is.

This talk was particularly fascinating for me, as a lot of the tools he showed us I’d already had a play with, but not on such a large scale.  We’ve since implemented a few of them, as the day after we got back from UpFront, a client requested work on a project regarding its page load speed, so I was happy to dive into the support tickets and optimise away!

We've also got everyone on the team obsessed with the Google PageSpeed tools:

pagespeed_tools

Many of the tools and processes Dean showed us were very valid and easy enough to implement on our static prototype sites. However, on our CMS-driven production sites, it will be a little harder to implement some of the automated tools, but we’re thinking about a solution now...

Design Decisions Through the Lens of Performance - Yesenia Perez-Cruz

This talk blew us all away! Yesenia begun by telling us that she used to be a 'reckless designer', who would design beautiful Photoshop documents with all of the features clients wanted, but without considering how it would be built or its web performance. 

designer_slide

The section on how we should be collaboratively working and educating our own team and third party design companies really struck a chord with us. I came away desperate for the slides and the recorded talk to be published so I can show my design colleagues right away!

The most valuable lesson, was that of establishing a performance goal and performance budget to a website build, which demonstrates to a client that in order to have a fast loading web page, they may need to sacrifice the huge banner carousel and, perhaps, get rid of a couple of weights of the 16 font sets they have on a page...

Emphasising that performance starts with the design process really encouraged me to get even more involved in projects from the very start. The BB design team are already pretty good at this, and I feel great when one of them comes and asks me about page weight/load speed/optimising images etc. Yesenia's talk made me realise that we are on the right track, and long may it continue! 

Any questions?

If you need more information or have any questions just get in touch and we'd be happy to answer them for you.