Big Eye Deers at AwwwardsBCN

The Awwwards conference in Barcelona is something that we’ve had in the calendar since way back in November of last year. With Christmas, New Year, the dark days of January and Pancake Day in between it felt an age away, but soon enough Monday 23rd February rolled around and myself and Steve Easyjetted our way to Barcelona.

Our flight times happily allowed us a full day either side of the conference which gave us a perfect opportunity to soak up some Spanish sun (the Vitamin D was much appreciated after a long, dark winter in the Big Eye Deers bunker), sink a few (too many) cervezas and gorge ourselves on delicious Jamon!

Day One

After a hazy start on Tuesday morning we got ourselves to the conference. Luckily we were just in time for Tobias Van Schneider’s talk on why side projects are inherently stupid but why we should do them anyway. I’d never really given much thought to side projects and the potential benefits or areas of expertise that could be enhancing my professional occupation. Any excuse to tinker around with new things or delve deeper into hobbies is good in my books. My particular favourite of Tobias’ side projects is his authentic weather app which provides a simple and frank description of the weather and is a great example of giving the user the right level of information for their needs.

Next up was Meagan Fisher whose talk on the importance of empathy within design highlighted some great tools for monitoring end user interactions on websites. Here at Big Eye Deers we pride ourselves on creating websites that not only look great but are intuitive and fun to use, and as a result we’re always on the lookout for new technologies that can help us deliver better solutions for users and also improve on existing sites that we’ve made. We can’t wait to get to grips with some of Meagan’s suggestions such as Fullstory and Silverback and see if they can take up a permanent position as part of our testing and iteration strategy.

After knocking back a good three or four espressos (props to Awwwards on the quality and the free-ness of the tea and coffee making facilities), Marko Dugonjic took us through a brief history of fonts and how to make sure that our typography adapts correctly in responsive web design.

Phil Hawksworth was up next and delivered a great talk all about how awesome the web is and how awesome it will continue to be – something Big Eye Deers couldn’t agree with more! He also included a brief history of how the web has developed as well as some key things to remember when developing great websites.

[quote]”Develop a single underlying system that allows for a unified experience across platforms and device sizes”[/quote]

The only downside to Phil’s talk was the irreversible sight of the “aitch tee tee pee double meh” which I’m now cursed with forever…

Post lunch, Paul Bakaus gave us a sneaky insight into some of the awesome features the Chrome dev tools team has planned for the future as well as some hidden gems that are already within the programme. It’s hard to imagine a world without our trusty dev tools now and I would definitely class it as one of the most useful tools that allows me to develop better code faster. As a result of my daily use of Dev tools I thought I had all the features nailed down but Paul pointed out a couple of things that I didn’t know:

1. The ability to unminify minified css directly in devtools just by clicking the curly braces at the bottom of a source file – mind blown! No more manual minifying, saving, un-minifying, editing, minifying, saving for me. I’m pretty sure this feature alone will save me a good couple of hours a year!
2. The addition of the eye dropper colour selector in the colour palette – mind blown again! This is something that I felt had been lacking from dev tools across the board and seemed such an obvious feature to include, thankfully it’s now arrived. All you need to do is open the palette up on a css colour definition, then when your pointer is over the document you’ll see an eye dropper interface to select a colour directly from the document.
3. Using DevTools and your development environment through Workspaces. Basically you can live preview, edit and update local files all through dev tools – no need for an editor unless you need to do some PHP. This is a workflow that I will adopt for any projects that don’t involve PHP or for simple prototyping. The documentation on how to do this is available here: https://developer.chrome.com/devtools/docs/workspaces

In terms of functionality that Google have planned for DevTools, there’s going to be tons of great animation tools which give direct control over different animation parameters as well as slowed down, frame by frame previews and a graphical bezier editor – all welcome editions!

A further 2 more talks in the afternoon concluded the day. First off was a walk through some of the great work that Italian design studio Aquest have been doing recently, you can check them (and their awesome site) out here http://www.aquest.it/.

Last but not least was Vitaly Friedman, one of the Smashing Magazine editors, who took us through his idea of the ideal responsive design workflow. It was good to be able to note a lot of similarities in Big Eye Deers’ processes when compared to Vitaly’s flow. While we’re confident in our abilities as designers and developers, it’s always good to have your ideas verified by your peers.

Day Two

Following some of the great things we picked up on day one I couldn’t wait to get day 2 underway. Thankfully both Steve and I were feeling a lot fresher than the day before so actually managed to make it to the conference on time.

Mathias Bynens kicked things off with a great, and incredibly geeky, delve into the interesting quirks of unicode string manipulation in Javascript. Steve maintained a perplexed and confused expression throughout but I loved it! What could have been a very dry subject was actually delivered in a very entertaining way, mostly thanks to the wonderful ‘pile of poo’ character that exists in unicode. I must admit I hadn’t come across these issues before, nor had I tested for them, but I will definitely be taking up Mathias’ advice and using the ‘pile of poo’ test the next time I’ve got some strings to play with in Javascript.

Mathias also shared 2 great resources; phpwtf.org and jswtf.org. These contain a comprehensive list of strange quirks with PHP and JS respectively. So the next time you’re stumped as to why your code is doing something bizarre I would suggest having a look there.

In contrast to Mathias’ techy start, the next talk was pure graphic design and illustration. I hadn’t heard of Danish duo Hvass & Hannibal before but was blown away by the fantastic and incredibly varied work they do. Their playful spirit, which was highlighted by a short ribbon twirling display mid speech, but dedication to delivering high quality work is something that we also strive for at Big Eye Deers and I found a lot of similarities between their philosophies and ours. The attention to detail in their work is something that shines through in the end products which often leave you pondering how the piece was actually made and even what it was made with!

Jeremy Keith was up next. His book HTML5 for web designers is a must read for anyone involved in the world of web design and development and I was looking forward to hearing his thoughts on progressive enhancement. While the content of Jeremy’s talk didn’t highlight anything particularly new, it did serve as a good reminder that we really should be taking progressive enhancement seriously and ensure that it is adhered in all of our projects. I think this talk was the one that hit home most for both Steve and myself and has definitely given us a renewed energy to make sure that the site we build are fully progressive.

[quote]”When an elevator fails, it’s useless.
When an escalator fails, it becomes stairs.
We should be building escalators, not elevators.” – Jake Archibold[/quote]

The afternoon consisted of another great mixture of speakers.  First off, Dog studios  took us through the Awwwards site of the year which they developed. You can view the site in all it’s awesomeness here http://dragone.com/en. While the site itself is of course outstanding, it was even more interesting to hear an honest insight into the enormous amount of work the Dogstudios had to put in and especially the importance of a good, two way relationship between client and agency. We’re very lucky here at Big Eye Deers to have such similar relationships with our clients and it really does result in a higher quality product.

Next, Ricardo Cabello & Jaume Sanchez took us on a mind boggling tour of the things they’ve achieved with WebGl. The most impressive being the in browser environment they created for the movie Gravity (http://gravitymovie.warnerbros.com/#/experience). The future looks good for webGl too with experiments into VR environments in browser.

Divya Manian, from everyone’s favourite design tool Photoshop, took us through some tips on how to make responsive design easier in existing design tools. It was good to learn how to set up grids using photoshop guides – no more grid images in PSDs for us! The plugin installation and configuration is well explained over at Smashing Magazine. The idea of using photoshop objects to reuse and quickly edit common elements such as buttons in designs is something we’ll definitely be looking to add into our workflow.
The quick overview of using brackets to turn PSDs into CSS was also interesting but probably not something we would use at Big Eye Deers.

The afternoon was livened up by David Navarro and Claudio Guglieri’s epic, movie trailer style intro. Their entertaining talk on how movies influence and predict technology and device trends rightly concluded that ‘the future is human’ and that we should

[quote]”push technology closer to us rather than push us closer to technology”[/quote]

…all very deep and philosophical but very true. Their point on the future being platform agnostic is something that directly affects us in the web development industry and is an attitude that we have been adopting at Big Eye Deers. We’re now at a point where its impossible to test for all the devices and platforms out there so instead we design responsively based on the content, making sure it looks good no matter what viewport.

Josh Holmes rounded things up with a talk focussing on the ‘Internet of Things’. An intriguing vision which at its core relies on converting (vast quantities of) data into knowledge and improved efficiency and experiences. His use of the phrase ‘turbo nerd’ also made me chuckle!

The folks at Awwwards did a great job of putting on this year’s conference. I was really impressed with the calibre of the speakers and the variety of content that was discussed. The free booze and food at the after party was also great, although I think Steve soon regretted smashing through 10 tubs of mussels – I had no such regrets after eating an entire bowl of chicken wings.