Designing and Prototyping
Website development is an iterative process. Imagine yourself in a valley, gazing at the majestic peak of a nearby mountain that represents the successful completion of your website project. The distance might be only one mile as the crow flies. You may envision yourself steadily marching in workmanlike fashion right up to the top; however, once you start, you find that this is impossible, the angle is too steep, and no trails take such a route. Instead, the only way to the top is a winding trail 10 miles long that has many switchbacks. Although the trail steadily rises in elevation, sometimes you actually walk downhill. Eventually, however, you reach the top, but it takes longer than you thought.So goes website development. If you could build the site exactly perfectly the first time, without any rework or modifications, it might only be a month-long project, but such a path does not exist. Multiple options, decisions, meetings, compromises, prototyping and reworking, changes in methods and production, testing and debugging, and more all intervene. The path you must take is not a straight line, but it is the only route. You need six months to reach the top, much longer than the one-month journey it appeared to be.
Advance planning is crucial; however, you should realize that you will need to make many decisions about how to reach the mountaintop when you’re on the trail. Sitting in the valley cannot lend the perspective you will need to make those decisions. You should resist the temptation to overplan. No amount of planning will build the website for you. Do not attempt to outline every contingency. Rather, consider the plan to always be a work in progress. Be steadfast about your desired outcomes, but fluid in how you achieve them. Keep your plan at your side. Let it guide you, but modify it when it’s sensible to do so.
In website development, you and your team have before you many options. You will discuss, debate, and decide upon each one. At a certain point, you will pause again and consider options on another decision. As you progress in building the site, you will make increasingly detailed and functional revisions to the plan. While a pattern of second-guessing yourself is never advisable, you may want to reconsider a direction when it leads to significant obstacles. You minimize the cost of backtracking by quickly developing prototypes to test your decisions. Such practice is what makes website development an iterative process. The process continues with design and prototyping, which is addressed in this chapter, onto the topics of subsequent chapters, including production, or ‘buildout,’ testing, and finally going live. Web development is a continuous process. Although the processes described here are somewhat sequential, they should not be viewed as discrete steps. Parts of the process happen simultaneously.
As an iterative process, website development is circular in parts, with built-in feedback loops designed to lead you to previous steps for revising and refining. The process goes something as follows:
1. You create a design.
2. Through inspection, reviewing, and testing, you identify gaps or problems.
3. You may throw out the design and start over, or make revisions.
4.The cycle repeats.
By way of these switchbacks, you move up the mountainside. It is a fact of Web development that this is the only way to get a final and acceptable result. If you ignore this fact and try to develop a site in one shot with no revisions, you will probably spend your budget in a first cycle that leaves you dissatisfied and without the resources for the revisions you desire.
This chapter describes the following three phases of design development:
1. Menu-tree diagram
2. Skeleton framework
3. Home page and motif