The Personal Disquiet of

Mark Boulton

Responsive Summit: The One Tool

– February 27th, 2012 –

Last week at the Responsive Summit, we discussed tools a fair bit. Especially in relation to workflow and how it effects a designer and their output.

Since 1997, I’ve been working almost exclusively on the web. Throughout all of that time, the realisation of what the projects would look like are done in Photoshop. That means, yes, I’ve been using Photoshop in a production environment for fifteen years. Malcolm Gladwell said it takes 10,000 hours, or 10 years of repetitive use, to become an expert in something. I guess that means I’m an expert in creating pictures of websites. Photoshop is like an extension of my mind. To use Photoshop for me is as effortless and almost as fast as a pencil. I get stuff done; quickly.

The change in process to Responsive Web Design means we need to get in the browser faster. But please don’t read this as ‘we need to get rid of Photoshop and/or equivalent tools’. It doesn’t mean that at all. What it means is that we need to be aware and understand our materials. That means we need to understand how — when you’re designing in Photoshop, or Fireworks — you have one half of your mind in a browser. Not necessarily HTML, or CSS, but thinking about behaviour.

There has been talk for a while of designing a tool for the web that is more aligned with our processes than Photoshop. A lofty goal. And I’m not even sure how worthy a goal, to be honest. Because, at this point in time with Photoshop, HTML prototyping and a pencil, my workflow and tools are okay, thank you. I don’t think i’m suffering as a result of having inappropriate tools. That’s because I understand how each of them works, the material they work with, and how they all come together in my mind.

Understanding materials

I think one of the key aspects of a good designer is to understand your material; be it pixels, ink or markup. That doesn’t necessarily mean you have to design in that medium. Print designers don’t design in ink (well, not much anymore). Architects don’t design in bricks and steel. And web designers shouldn’t need to design in HTML or a browser canvas. If you’re any good at your job, you will understand that media, create for it well and then communicate that well to other people.

Our takeaway last week that the tools we have for certain parts of our job could be better. Photoshop could be better. So could fireworks, and the browser and CSS… the list goes on. RWD adds some complexity to the mix, because we need a good way of increasing fidelity of our work over time, in the browser, whilst retaining some of the things that, say, Photoshop gives us.

Last week, I tweeted: ‘You can’t have happy accidents designing in the browser’. Jeremy corrected me: I can’t have happy accidents in a browser when I’m writing specific rules and then watching the results in a browser. There is too much in the feedback loop. Photoshop is an extension of my mind and my hand. Through 15 years of continuous professional use, the feedback loop is small. My mind is free to explore options whilst my hand (via the mouse) executes them. Rinse, repeat, explore, iterate. For me, writing explicit instructions in code and hitting refresh in a browser is a long, long way from this.

I said during last week’s Summit that in all likelihood a Web Design Photoshop tool is not likely going to solve any problem we have now. Maybe a small suite of tools will where we can extract certain parts of our process: like designing a responsive grid, for example, or defining a colour palette, or iconography. But when it’s a holistic process, then a designer’s own experience, preferences and ability will trump any tool. Each very much to their own.

Filed in: design.

Further reading