Recently at Bearded we made a pretty drastic decision in terms of our web design process: we’re not creating mock-ups anymore.
That is to say: we’re not creating flat, Photoshop/Illustrator-produced mock-ups of websites, which we present to clients as JPGs or PNGs. And that’s because we’re not designing in those programs anymore.
The more time we’ve spent working on responsive websites, the clearer it’s become that mock-ups aren’t very good representations of the final product. They involve a lot of unnecessary abstraction that results in difficulty with:
- Predicting and solving the design challenges inherent to fluid, responsive layouts
- Rendering complete solutions to those challenges
- Accurately communicating responsive designs to our clients
Traditionally, mock-ups are attractive because A) we’re used to making mock-ups, B) supposedly it’s easier to revise a mock-up than CSS, and C) it’s convenient for getting client approval. But fundamentally this approach is flawed for websites, a situation that’s been greatly amplified by the extremely non-static nature of responsive layouts.
We’re hoping this will help keep us, as designers, more focused on the true nature of the fluid, interactive products we’re creating. And I feel certain that our clients will benefit from seeing and critiquing a real, working web experience rather than an abstracted representation of one.
Not only that, but once we have design approval, we’ll be halfway done with our CSS. This should help us deliver websites to our clients more quickly with less boring, redundant work for us to do. And even if it is more laborious to revise a CSS mock-up (and I’m not convinced that it is), we’ll make up the hours in front-end development.
Our trials with this method so far have been very rewarding. It feels right to be creating interactions directly in their final medium, the browser. We feel more in touch with and inspired about our work than ever. It’s clear to me now that for years we’ve just been designing pictures of websites. But now, finally, we’re designing websites.