I’m curious to find out how most of you begin the process of developing website design layouts. I used to use Photoshop to create the initial designs, but with the last few sites I worked on I simply comped them in FWP.
Also, do you typically show a client a few page proofs before you begin putting everything together or wait until you have a working site?
Occasional doodling with paper and pencil but mainly workout ideas with FW.
I have general discussion with my clients, who are usually small traders (looking for something simple and cheap) , colour preferences, likes, dislikes, what works for their business and what their competitors might have, etc. I work on a ball park design then refine it from there. Virtually always the client has gone along with the first off concept, I tend to be the one that changes mind. Recently a lot of my sites are based on a ‘box model’ chassis. Trick is making this look different from one another.
I either have the design progress on line for them to look at (and thumbs up) or occasionally send screen-grabs.
All depends on expectations of your client and their worldly experience of design matters.
For me the process varies somewhat by project but generally after a discussion (or two or three) with the client about requirements, expectations, aesthetics etc. I will wireframe the site to get a sense of structure, navigation flow and a rough idea of size (all critical for the client’s benefit too). Usually a low-res version is fine but sometimes a hi-res interactive one is preferable.
Depending on the complexity/resolution/interactivity of the wireframe I may also provide coded mockups, not graphic representations (slicing and dicing a Photoshop file is not for me). I think a coded mockup offers a better real-world example of what can be expected vs a pixel-perfect static image. But if I do have to make graphic mockup I do so in a vector app, not Photoshop. I find it much easier to make edits; it’s more fluid.
Once all that is done I refine the code-base from the mockup(s) (or wireframe if applicable) and build-out the site from there.
My system is basically the same as Todd’s. Oftentimes I’ll exercise my creativity by creating website designs in Sketch that never end up on a website, as a way to force myself out of my own box.
Freeway makes tossing websites together fast and easy, but especially when you’re building box-model having a wireframe to refer to is very handy!