Future of Web Design London 2012, rough notes

Notes taken during those two wonderful days.

15th May

Brendan Dawes – Notes on design

“Slow down and notice beautiful things”
“It should remind you something you’ve never seen before”

“Life is too short to use an ugly pencil”
“Obsess about the tools you use”

Innovation -> iteration
Occasionally beautiful things may appear. You’ll need to play around and produce crap to build something beautiful. You’ll have to recognise perfect spot to stop. Or live with the knowing that you’ve missed the perfect result.

Subtract to add.
In order to find something, you’ll need to look for something else.

Date itself is not enough. Data needs poetry.

“Own what it is that makes you different” – Aimee Mullin

Memory box

Paul Boag – Client Centric Web Design

Book – “Client Centric Web Design”
Remember that not everyone can be cool web designer in Silicon Valley and work on cool web apps and sell your work for billions.

You’ll need to love client work.

Mutual respect. They know business background, they know their users, they are having knowledge in specific area.

Respect is two way, we can’t change them but can change us.

Expert by association. Willing to change. A relationship of peers. Process and past projects. Clearly defined roles. Client defines the problem. Designer provides the solution, not vice and versa.

Good communication. Don’t rely on electronic communication, you’ll miss voice and picture. Don’t hide behind email. Be regular. Phone call, see them. Be open and honest.

Education. Will need to be educating both us and the clients. Do some stakeholder interviews. When client has an idea, don’t say no at first place. Talk to them.

Reference to your previous work, prepare presentation.
Justify changes. Ask structured questions (do you agree…?).

Matt Gifford – Let jQuery Rock Your World

jQuery ThemeRoller / Mobile ThemeRoller


Code is a language. It should be readable. Minimise the code, cache everything.

Charles – web debbuging

Jon Tan – Web Typography, The Good Bits

Impact – grab intension

Book: Robert Bringhurst – What is Reading for?

Choosing font:
Test smallest type first. Confirm language support. What features & variants do I need.

CSS hyphens: auto
text-rendering: optimiseLegibility

Vitaly Friedman – Responsive Redesign: Utilising The Power of HTML5 & CSS3

Technical reasons to redesign (Smashing Magazine)
– Bloated code
– long response times
– unusable navigation
– degreasing ad engaging

Define goals before redesign.

Requirements: confort type, focused design, consistent navigation. No ads in smaller screens. Fully usable without javascript.


Standardistas – You are a channel

Visual Research (Ian Noble)
A Technique for Producing Ideas (J. Young)
Managing Oneself (Peter F. Drucker)
Great Ideas Grow on Paper (24ways)

Idea = new combination of old elements

Young’s 5 stages
– Gather raw material (reading etc.)
– Mastication
– Drop everything & walk away
– Out of nowhere an idea materialises
– The morning after

Synthesis. Talk to colleague, doodle, synthesise content

Input -> Synthesise -> Ouput

Output. Writing, contribute to projects. In whatever you are good at, share your knowledge. Make it your channel.

You are individual, you are different from others.

Passion, curiosity, creativity, craftsmanship (passion to make best things, has every fine detail). Achieve it through hard work.

Relationships. You are good at something when someone else is telling that to you. You can’t grade your skills by yourself. You’ll need to be validated by others.

“One cannot communicate” – Paul Watzlawick

Know who you are and what you stand for. Know what you want to say. Give that form.

Jack Lenox – WordPress (framework of the future)


– post insertion / removal
– user insetion / removal

Jonathan Berger – Code literacy for web designers

Fear is healthy, overcome it.

Pivotal tracker. There is only one critical task at time. It’s Ok to change order of the task.

Cucumber (story writing)
Rspec & Capybara (testing)

Do things and get feedback, it’s not enough just reading about things.

Method.ac tutorials


Laura Kalbag – Designers for the flexible web

Responsive design is required only when it solves problems. There is no need to use it just for fun. Who? Why? Which devices? Which technique?

Study your users, check analytics for mobile users for example. It’s all about users.

Small screens issue: branding vs. navigation

responsive-nav-patterns (search Google, bradfrest)

Do not use display: none if it’s not needed on mobile. If you wish to hide it from mobile users, hide it from desktop also. Instead take out decorative crap and be good designer.

Keep proportions across the devices (screen sizes).

paulrobertlloyd / styleguide
pea.rs library

Use real content not lorem ipsum.

Use Dropbox to fast testing. Upload image, open with iPhone for static image testing.

Sarah Parmenter – Beautiful iOS Design

book: Luke W. – Mobile First
Google Kristina Halnorson (content strategist)

Structure of the content. Newspapers have very structured content.

James Coglan – Automatic testing across the multiplatform web


Direct js test can be 6000x faster than Selenium

PhantomJS, TestSwarm, Browserstack, buster.JS, testling