The Web Designer's Roadmap

Chapter 4Form and Function

Until now, we’ve focused mainly on ideas for how to prepare for the design process. We’ve explored resources for inspiration, techniques that help generate concepts, and methods for organizing our loose visual ideas into deliverables that we can use to communicate with clients. Once all the planning is done and our initial thoughts have been hashed out, we must start putting together concrete items for design and structure. Eventually, we’ll reach the point when we’re working in Photoshop (or the browser, if that suits you) and delicately crafting pixel-perfect designs, but first we need to establish what we’re designing. In this chapter we’ll discuss thumbnails, wireframes, and grayboxes, which you can see in Figure 4.1 ...