London Generate Conference - 17th to 18th Sept 2015
AK Creation designer Keith Mason blogs on his visit to Net magazines 3rd London conference for the web.
I was lucky enough to attend the recent Generate conference on the 17th September at the Grand Connaught Rooms in London. The conference is for Web Designers and Developers alike, but some of the presentations were also very helpful for small companies looking to expand.
Rather than go overboard with all the notes made, I thought I would summarise the things I found most useful (as well as links to the speakers and various resources). Hopefully you guys will find this useful too :)
Simply click any of the below to read about them:
CSS Grid Layout - Rachel Andrew
Most definitely top of my list was the incredibly exciting new CSS specification ‘CSS Grid Layouts’. This talk was given by the excellent Rachel Andrew (@rachelandrew). This new spec allows us to define our grids using CSS, rather than using rows and rows of div’s in our markup (like bootstrap etc currently does).
This has the potential to completely revolutionise the way we build our responsive grids. It already has decent browser support and a polyfill is available for those that don’t. (https://github.com/FremyCompany/css-grid-polyfill)
The Design Practice (Building a Design Team) - Verne Ho
I particularly enjoyed Verne Ho’s (@verneho) talk on Building a Design Team. Verne is the co-founder of ‘Jet Cooper’, a design agency in Toronto which then went on to be acquired by Shopify, where Verne is now Director of Design.
His talk was truly inspiring and provided some really useful information on the best way to grow a team in the design industry:
- - Create a model that allows consistently dependable end results
- - Make everything intentional and document everything so that everyone else can easily follow
- - Make it scalable and transparent, so that everyone can work together
Verne then went on to describe the ideal framework for a Design Practice:
Tools = What tools do you need / use every day to perform various tasks
Production Model = A broad and versatile set of approaches, what do you do to solve problems?
Routines = Regular tasks and routines you carry out which can be relied upon to help with day to day challenges
Every design company will have it’s own culture, but what is it? The truth is that your design culture manifests itself within your design practice – by defining your design practice you are defining your culture :)
Design better App Icons - Michael Flarup
Michael Flarup (@flarup) is a particularly inspiring guy who made what could be perceived as a very niche subject (App Icon Design) seem very exciting and intricate indeed! Michael runs many different projects and so I would highly recommend to all to follow him wherever possible.
Micheal's 5 step approach to good App Icon design can be summarised as follows:
- 1. Scalability - Don't try to cram to much into that small space!
- 2. Recognisability - Does it identify with the product / company easily?
- 3. Consistency - Does it harmonise with the design and functionality of the app?
- 4. Uniqueness - You want something that will stand out - challenge yourself to find a good image metaphor
- 5. DON'T USE WORDS
He is also one of those totally awesome people on the web who creates amazing tools for people to use completely free, check out this fantastic tool for helping to design app icons in the various formats:
And you can keep up to date with Michaels’ work here:
SVG for Web Designers (and Developers) - Sara Soueidon
Sara Soueidon (@SaraSoueidan) is one of the most infectious speakers I’ve had the pleasure to watch, she has more energy than 10,000 light bulbs! She crammed in more information in a short time than I would’ve thought possible on a subject I am personally very interested in and it is clearly a subject she is extremely passionate about.
Sara’s excellent advice was to use SVG for the following:
- - Icon Systems (instead of icon fonts, she was very insistent here!)
- - Advertising Banners
- - Infographics
- - Data Visualisations
- - Animated Illustrations
- - Filter Effects
- - Simple UI shapes
One very exciting development on SVG that Sara revealed is that ‘custom @SVG rules’ are under development for future specification which will allow the creation of simpler SVG within your stylesheets.
Some good resources on SVG recommended by Sara:
http://greensock.com/svg-tips (regarding animation with SVG)
http://codepen.io/chrisgannon/blog/my-first-svg-banner-ad (Creating banner ad’s with SVG)
https://css-tricks.com/icon-fonts-vs-svg (Why you should use SVG over icon fonts)
http://www.freepik.com/ (Free vectors images)
Designing for a 24 hour experience - Jon Setzen
Jon Setzen (@jonsetzen) gave a really enjoyable presentation on ‘Designing for a 24 hour experience’. Of particular interest in his talk were Jon’s excellent statistics and snippets of info:
- - The average smartphone user checks their device 150 times per day !!
- - 25% of young people connect to the web via 4+ devices each week
- - 46% of people say they ‘couldn’t live without their smartphone’.
Jon also made a very interesting point on trying to improve the experience for users who are ‘at their lowest point’, ie people who have had a bad experience with your company / brand (for whatever reason). By having a great support system in place and FAQ’s you can make people love your brand again. By creating a good environment for the wrong end of the spectrum you will improve your customer retention, reports of good support are also always very important to new customers also.
We should all try to make design that is beautiful, functional, helpful, time saving and enjoyable – and shift the emphasis from needing to do something to ‘wanting to’ do something.
Design Consistency for the Responsive Web - Patty Toland
Lastly, being a designer who implements Responsive design every day, Patty Toland's (@pattytoland) talk ‘Design Consistency for the Responsive Web’ struck home with the main message being ‘speed is everything’, with a particular emphasis here of course being on the experience for mobile users.
As of 1st August 2015, the average web page is 2.16mb in size, of which a huge 1.35mb is made up of images. This is where the experience of mobile users can suffer, for example – more people globally still access Facebook over a 2G network than a 4G network, so slow load speeds are a huge problem.
Using e-commerce websites as the prime example, where time literally costs money, online shoppers expect a page to load in 2 seconds – and a large proportion will abandon a site at 3 seconds!
For Impatient Web Users, an Eye Blink Is Just Too Long to Wait - New York Times, February 29, 2012
Another staggering statistic given by Patty is that if a competitor website is faster by more than just 250 milliseconds, then a user will use that site more often.Performance Stats courtesy of @guypod
Testing by Amazon revealed that a page load time increase of just 100ms resulted in a 1% loss in sales globally.
Main culprits of slow page load were of course down to images not being optimized properly, but also the large use (necessary I might add) of Social Media widgets for sharing across networks. Patty emphasized proper testing of web page speed (using tools such as http://www.webpagetest.org) and also the use of Lazy Loading as a means to delay the loading of images until they are in the users viewport.
There are of course many many other excellent speakers and points to take from this event, but I hope you at least find my list helpful – and I highly recommend the event which currently takes place once a year in London (but now also has a New York sister event). Tickets and information can be obtained from http://www.generateconf.com