Designing in the browser and client conversations

[Gareth]

Hey guys,

This is more of a theory question than a core CSS issue.

I’ve been hearing a lot of stuff about dropping pixel perfect comps in photoshop in favour of getting into designing in the browser as quickly as possible.

This is a great idea and I really get the advantages, but what about the conversations with the client?

Previously the way to let a client know how their website would look would be to send them these lovely shiny mockups and they’d go **GREAT!** or _Can we have the blue a little bit more like Facebook?_ (yeah ok which exact colour of facebook blue, yeah?) But they would sign off on that design when they are happy and then you’d get to work in the browser.

But I feel like skipping out on this step, you lose that tangible thing that the client can see before proceeding.

Perhaps a solution is to wireframe more – get the client to sign off on those and then tinker a bit in photoshop and then design in browser, but the client will only see their design in the browser when you’ve already done all this work. What happens if they HATE the whole design. Eish, hours of coding wasted.

Perhaps we can present designed up components? But a lot of clients that I deal with wouldn’t really have the imagination to fit all those bits together to know how the whole thing would come together.

So I guess my question is, how do you have a design conversation with a client about how their website will look when you don’t have mockups to show them?

Thanks guys!

[Paulie_D]

For clients, I would still design the look in PS (or whatever) with 3 versions (mobile/tablet/desktop) because an image gets the sign-off you are looking for.

If they want something interactive then Fireworks has some decent options but “Designing in the browser” is, in my opinion not something suitable for providing to clients.

Of course, if you can actually give them a ‘development’ space to work with [like Site44.com] it’s all the better.

[Gareth]

Yep – have just finished listening to The Web Ahead episode with Samantha Warren (http://5by5.tv/webahead/28) – she sounds like a pretty switched on lady and there were some interesting ideas there. Style Tiles looks like a great idea and combining that with wireframes and style guides might be the way forward for a responsive site.

But until something better comes along, I guess we’re stuck with Photoshop for now. At least at some point in the process a comp needs to cross the client’s desk. But if the Style Tiles, wireframe and style guides have done their work, the comp shouldn’t take half the time to get done as before.

What an awesome time to be in this business! :)

Thanks for the comments, guys!

[Gareth]

There are also a couple of great articles over at Happy Cog that discuss the style guide process and it’s advantages. Useful!

http://cognition.happycog.com/article/sweet-systems
http://cognition.happycog.com/article/make-sweet-systems-sweeter

[Author]

Posts