Recently, I’ve been trying out a method of designing websites that I mentioned in my previous entry, which Andy Clarke wrote about in a post entitled Walls Come Tumbling Down. I thought I’d discuss some of the pros and cons to designing with this method that I’ve found.
In basis, the idea is to design the initial pages in Photoshop, and then build it making changes in the browser itself rather than on visuals. Essentially, this means that instead of sending over lots of different visuals, you send links to updated versions of the site which the user can see working, can fiddle with and can ultimately break.
I’ve been trying this on our company website and have got a few thoughts to share with you guys.
Pros
- Extra testing – the client will play with the site on their computer, with their browser and in their own screen resolution. They can fiddle with different features and let you know what is broken on their end. This means fewer headaches at the end of the project.
- It’s easier to explain browser inconsistencies
- It’s easier to justify why you have done things a certain way
- Less time is spent faffing about in Photoshop
- It’s much quicker and easier to experiment with different fonts and colours
- It looks a lot better when presenting
- You effectively design parallel with the client at every stage
Cons
- The initial design process takes longer
- There is a danger when coding the mock-up to write quick and dirty code, which could easily make it to a live site if you’re in a rush. Be careful.
We can both see here that, judging by the size of those lists, the pros outweigh the cons.
Although the design process itself takes longer, it’s actually saved us time. Rather than doing a Photoshop visual for every major page, we only do it for one or two. We then sketch out the others and build that directly in the browser. It’s worked very well.
My favourite aspect of this method is the ability to design side by side with the client. It’s a lot easier to fiddle with things like fonts, colours and spacing by tweaking a bit of CSS than it is in Photoshop – and you can do it with the client very quickly. Again, when presenting your site to your client, you can modify the site to their wishes right in front of them in a few minutes. Not only does this save time, but it also makes you and your company look very efficient.



