updated: November 12th, 2007 / Ross Johnson / 4 Comments

7 Tips for Client Mockups

A large part of any web design company is going to be presenting and going back and forth with clients about design mock-ups. It is funny how many times one mockup is picked for reasons beyond what you would expect, and possibly for the wrong reasons. There is obviously a common communication gap between design firms and their clients, and honestly it is our fault.

We deal with mockups day in and day out, we understand what portions are filler, what to focus on, what to ignore, etc. Clients on the other hand have no idea that the tagline you came up with is just filler, or that you plan to have different photos on each page vs the one you displayed in the mockup.

So here are some tips to improve your client mockup approval process

  1. Tell clients to view the mockups on a screen (if not several) not on paper.

    This is one of the most common issues I run into. Clients will print out a mockup and tell you what should be larger/smaller according to the page, only to be shocked when the site is coded and the logo they wanted to fill up half the page pushes all the rest of the content below the fold. By having them look at several different monitors/screens you can have a little more leway in tweaking slight color/tone changes when the client has a better understanding of the design looking different computer to computer.

  2. Keep the content consistent mockup to mockup

    Most design companies provide more than one mockup, if you are one of them make sure that the content or even filler content is the same mockup to mockup. I once had a client say they liked one mockup because it felt more “content rich” when in reality I just had more white space at the bottom of the design instead of cropping it closer to the top. It wasn’t that they liked the one design, they just focused on how they wanted a content rich design even though either one could have more or less whitespace.

  3. Try showing the client one mockup first, and get feedback

    If you are giving more than one mockup, showing them the first mockup before developing a second one will give you an opportunity to find out what sorts of things they like/dislike that you didn’t pick up during the initial meetings and development of a creative brief.

  4. Write out an explanation that goes with each mockup

    It sounds like a lot of additional work, but it will save you work in the long run… I promise. If you defend and give reasoning for all your design decisions, what you are trying to communicate, why you picked colors/fonts/etc you will eliminate the subjective aesthetic changes like “I like blue and lime green” or “my favorite font is times new roman.” This also gives you a time to explain any elements that are going to be flash, will change page to page, etc

  5. Create a two pages per mockup

    Again this probably sounds like a lot of additional work, but you will give a client a better idea of the brand image you are creating by developing several pages. This theory works very well for any design job where you will be providing more than one single piece of artwork. It really allows the client to see the theme you are building and how they all work together. Again it will save you time in the long run. This also gives you an opportunity to show roll overs, different elements per page, drop downs, etc..

  6. Specify how many revisions you will perform

    This is more to ensure that what input you do get from a client is very specific, and eliminate the “I don’t know what I want, but I know what I don’t want.” sort of responses. I rarely have to put my foot down and say “ok enough is enough, no more revisions” because the input I get back is very detailed.

  7. Throw your mockups onto your website

    Even if it is just one html file with an image of the mockup. This will give clients a better idea of how it will look on different resolutions, where the fold will be, etc. Better to find out those details now than have them ask you to change it afterwards.

Have any other tips for client mockups? Drop a comment or two, I would be happy to hear any more additional thoughts.

4 thoughts 7 Tips for Client Mockups

  1. Great post Ross especially on the consistent content aspect. I’ve also helped to ask the client for 3 site they love and 3 they really dislike even before the design process starts. The sites don’t even have to be from the same industry. It’s illuminating why clients like one site and don’t like another.

  2. Thanks Chris – and very good suggestion about asking to see three sites they like. Previously I have had clients look through a range of sites I think fit the look and feel they should be targeting and see what they like/dislike about those websites.

  3. Great tips, thanks Ross. Just need some new clients, now! I’d also say, make sure you charge appropriately for the number of mockups and/or time involved in the design process…

  4. For #7, Throw your mockups onto your website, we just launched a mockup publisher, mocklinkr.com, that makes this really easy.

    It’s also really simple to make mockups clickable to show the navigation. Plus, clients can select images and easily give feedback.

    We built this to use with our clients and they really love it.

    Check it out!


Comments are closed.

Free WebinarOur proven method of increasing website leads by 400% or more using design psychology

That anyone can implement, even if you're not a designer or developer.

Join me on April 8th at 11:00am EST time and you'll learn:

  1. How to understand your target audience so you can excite them and drive them towards action
  2. How to capture prospects before they’re ready to reach out, so you can build a relationship and nurture them towards a sale
  3. How to avoid the #1 mistake on websites that causes lackluster results
  4. A step by step process to realign your website around your target audience’s psychology

Plus we'll provide downloadable templates and checklists so you can implement what you learn on your own!