Gold Coast WebWiz Design Workflow, Pre Launch
Further information and commenting on different Workflows will be added here shortly.
1. Client Consultation
Search Engines, Keywords and Copy Writing.
2. Initial - Drafts And Sketches
Sketching the web pages.
3. Photoshop, Word processing, Multi media.
More detailed work on the content, logo and image testing.
4. Finalize The Design
Designing and building the site.
5. Linking and Search engines.
Internal and external linking.
6. Service, monitor and adjustment.
7. List building and Marketing.
8. Testing, Testing – and adjust.
Web Design Workflow - Complete Overview
I get asked a lot by friends and family (people that are not designer savvy), how I design my sites. I’ve never really sat down and explained each step to them, but I think it will help some of you guys (especially since you’re requesting more tutorials and web design articles). This is just what I do, a lot of people have different methods, but I’ve found this is the most efficient, and results in the best final product. I’ve designed a mock website using these steps, including pictures for the entire process. Let’s get to it…
1. Client Consultation
Search Engines, Keywords and Copy Writing.
This is, without a doubt, the most important step in the entire process of designing a web site. It’s the foundation to the entire project, and unless you have a strong foundation (as with a house, business, etc.), the project will be riddled with problems, and might fail completely. This is the first building block, everything else will come back to this first step.
I spend about an hour talking with the client about what exactly they want. Obviously, we talk about price, deadlines, and all those lovely juicy details, but most importantly we talk about the needs and goals of the sites. I always ask the client what they’re trying to communicate through their website, what type of information they want the reader to not only see, but to remember. Anyone can throw together some nice gradients, text, and icons, but to truly make a website that meets (and exceeds) the clients needs, takes planning and thought.
I ask about the demograph the client has, who will be reading it, the market the client is in, competitor sites, everything. Is the client trying to showcase their faux painting artwork? Or do they want to give out information on their non-profit? These two sites are radically different, but they both have their foundations in planning. A wise man once told me that failure to plan is a plan to fail. If you don’t have an end goal, you’ll just be putting together images and words. Here are some key questions I ask clients in the planning stage.
What demograph is your site going to target?
What are you trying to communicate (i.e. your works, info about your company, reasons to buy your product, etc.)
In case of a product or service, what makes you the best? What is unique about you? What features do you offer? What solutions? These will be what you showcase in the design, make these key, the most important elements.
If I could sum this step up into one sentence, it would be this: your client is not hiring you to simply make them a website; they want you to provide a solution to their marketing strategy.
2. Initial - Drafts And Sketches
Sketching the web pages.
Remember how your 8th grade English teacher always told you that a rough draft would improve your final work? Turns out she was right. I always begin my designs by sketching out ideas and drafts in a notebook. This is a fast way to come up with design ideas, but still be able to show the client the general structure and elements of the site. It’s a lot easier than starting in Photoshop, only to have the client totally reject the design. I normally draft out 5-10 ideas, and then talk with the client, showing them the drafts, and either decide on a layout, or mix parts of my ideas to create a new, approved design.
Your drafts don’t need to be a piece of art, they simply need to show the general structure and layout of the site. Sure, you can get creative and add little details, but as long as the client can visualize where all the information and content will go, you’ve succeeded. Here are 4 quick sketches for the mock site I’m designing for this article. I’ve decided to go with the last one.
3. Photoshop, Word processing, Multi media.
More detailed work on the content, logo and image testing.
Now that the client has approved the general layout of the site, it’s time to design it. Fire up Photoshop (or Fireworks, or whatever you use) and design the general layout. This is where you can start to add details, but don’t worry about creating it perfect the first time. This again is a general draft to show the client the style. Some people design it first in greyscale (that way you can easily change the to any colour scheme you want, the hues are already set), but I don’t really do that. You’ll finalise colours, design elements, fonts, etc. in the next step. Here is what mine looks for the mock site; nothing amazing, just the basics of the style so the client can visualize even more how the site will look.
4. Finalize The Design
Designing and building the site.
After the client approves the style mock up, it’s time to finish up the design. This is where you will finalize colours, type faces and sizes, and details. In this extremely quick and simple, I’ve made some typographic changes, added more detail to the menu, and added a highlight style. Again, this is just a mock up, and I would never hand something like that to the client as a finished design, but it’s made to show the progression of the design progress. The client approves the final design (they may want some minor changes, but this is the final design they will approve). Here is mine:
5. Linking and Search engines.
Internal and external linking.
6. Service, monitor and adjustment.
7. List building and Marketing.
8. Testing, Testing – and adjust.