Great article, Andy. However I’m going to disagree with you. And agree with you. All at the same time.
I really do think that there is a lot of grey here and not one way is correct. The project dictates the approach to a degree, as does the client.
Let’s take that age-old comparison for building websites – an architect. Would you expect an architect to build you a house out of bricks and then walk you through the design? No, you’d maybe want her to build you a prototype or model to show the relative dimensions and scale of a building. But you wouldn’t expect to be shown a completed building. But some clients would be happy with viewing a design on plan, others would be happy with a sketch on the back of a napkin.
For me, this isn’t a question of right or wrong, but of a scale of fidelity that has to change depending on the client, the project and the designer doing the work.
If you’re a designer working for 37signals, rapidly iterating on a piece of new functionality for Basecamp, you’re not going to work in Photoshop. If you’re designing a website or application that has a shed-load of ajax, then you should work in the browser, OR you should work in the browser to indicate that functionality at the level of comfort for you and your client. So you can show the interaction rather than explain it. However – and I go back to my fidelity example here – you should do that to the level of fidelity required for the client to understand, if that means designing in the browser with production-ready HTML and CSS, then great. But it could also be paper prototypes and some sketching.
Also, one thing to watch out for when designing in the browser and working with in-house teams that will integrate those templates into a system, is to ensure that if that’s the case, that the HTML and CSS is of production quality. Again, it requires a little step up the fidelity curve.
I guess my point is this: The level of fidelity has to be appropriate to the project, and appropriate to the client, so that the design can be understood in the intended medium. Personally, combining various tools (Photoshop, Sketching, Paper Prototyping, Lo Fi HTML prototyping) works well for me.
Mark Boulton
Great article, Andy. However I’m going to disagree with you. And agree with you. All at the same time.
I really do think that there is a lot of grey here and not one way is correct. The project dictates the approach to a degree, as does the client.
Let’s take that age-old comparison for building websites – an architect. Would you expect an architect to build you a house out of bricks and then walk you through the design? No, you’d maybe want her to build you a prototype or model to show the relative dimensions and scale of a building. But you wouldn’t expect to be shown a completed building. But some clients would be happy with viewing a design on plan, others would be happy with a sketch on the back of a napkin.
For me, this isn’t a question of right or wrong, but of a scale of fidelity that has to change depending on the client, the project and the designer doing the work.
If you’re a designer working for 37signals, rapidly iterating on a piece of new functionality for Basecamp, you’re not going to work in Photoshop. If you’re designing a website or application that has a shed-load of ajax, then you should work in the browser, OR you should work in the browser to indicate that functionality at the level of comfort for you and your client. So you can show the interaction rather than explain it. However – and I go back to my fidelity example here – you should do that to the level of fidelity required for the client to understand, if that means designing in the browser with production-ready HTML and CSS, then great. But it could also be paper prototypes and some sketching.
Also, one thing to watch out for when designing in the browser and working with in-house teams that will integrate those templates into a system, is to ensure that if that’s the case, that the HTML and CSS is of production quality. Again, it requires a little step up the fidelity curve.
I guess my point is this: The level of fidelity has to be appropriate to the project, and appropriate to the client, so that the design can be understood in the intended medium. Personally, combining various tools (Photoshop, Sketching, Paper Prototyping, Lo Fi HTML prototyping) works well for me.