Jump to content
Killersites Forums

Mock Ups


Recommended Posts

Hi all,


I'm pretty new to webdesign. I have completed a few websites of my own, mainly using Wordpress as a basis and going from there.

I have hand coded a couple of basic websites as well and learnt a lot doing this.


A friend of a friend of mine has come to me asking me to build him a website, he's happy to pay me, so yay, my first paid job! :) My problem however is that he will want to see what i plan to create before i create it.


I work full time and have a couple of hours at most some nights to create the site, so its going to take me a while anyway. As my Photoshop skills need a lot of improvement I'm hesitant to take all the time to create a Photoshop mockup in case he doesn't like it.


What other options are there to show a client what you plan to create without spending vast amounts of time on it?

As you can see, this is my first time dealing with clients so any advice is greatly appreciated.



Link to comment
Share on other sites

Maybe you could use Word or similar for your mockup and send it to him as a PDF? Depends on how detailed everything will be, it may be just as easy to create the index page of the website. Not only would that give you your basic outline already in place, you could easily make any formatting changes just by changing the stylesheet.

Link to comment
Share on other sites

Also, for business situation like this it's best to change the status of this relationship for from 'friends' to 'client'. Draw up a simple contract stating yours and his responsibilities. Free estimate is one thing but providing a mockup without a retainer fee is another. I encourage you to determine what is fair for both you and the 'client'.

Link to comment
Share on other sites



First, congratulations on your first paid job!




Ok, this is what you need to do:


  1. Get a list of the visual elements your client wants for the site.
  2. Get a list of the functional elements he/she wants - do they need any special capabilities, like a contact form for example?
  3. Armed with this knowledge, look around the web, check out sites of a similar nature and also go to template collections .. for ideas.
  4. Once you have a few ideas, just quickly mock up something in Word (any program you are basically familiar with) using placeholder dummy text and images. Just let the client know that this is for feedback only … just in case they get nervous that you are bringing them pdf's or screenshots of the layouts.


Don't try to learn Photoshop and web design at the same time - you are just making headaches for yourself for no good reason.


Final tip: for your first web design job, don't expect to make much money per hour. In fact, you are a lucky one who is being paid to learn. So consider it an opportunity to develop your skills.



Link to comment
Share on other sites

If you have Fireworks (it is web design software) use that not Photoshop (it is an image editing software). From Fireworks you can easily export an editable pdf for your client. Since this is your first client and a friend, go old school and do a low fidelity mock up. In other words use pencil and graph paper. http://www.uistencils.com/

Edited by kralcx
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Create New...