Book Image

Wireframing Essentials

By : Matthew J. Hamm
Book Image

Wireframing Essentials

By: Matthew J. Hamm

Overview of this book

Table of Contents (12 chapters)

Summary


Though each new project will require slight variations on the level of effort expended on each of these phases, this design process is for the most part universal. You should expect to follow this process with every project you take on.

Begin researching with the intent to define the users who are going to use the product. Ask the questions required to understand the goals of both the end user and the software creator. Brainstorm to define features that let them complete their desired tasks in an efficient, intuitive, and creative manner.

Once we have those answers, we will start to iterate the information architecture of these features. Begin the process by mapping out the overarching task flow that users will follow through the site or application to complete their objectives. Next, we will define the page-level content and layout required to support the user's efforts in completing their tasks on each page or screen. Then, we test our design solutions to ensure they are intuitive and usable.

With our vision of the overall task flow of the product and page contents documented and vetted, it is time for us to apply the visual design. We will need to create the necessary graphics, fonts, photos, and other visual elements that will replace all of our wireframed elements. Once complete, the designs and their associated graphics and photos will need to be handed off to the development team for production.

Following this process will help dispel ambiguity and will replace it with information and order. It will remove the guesswork and will offer a clear direction in which to take our product.

Now that we have a general understanding of the design process, let's see it in action. The next chapter will walk us through a sample project building an e-commerce website.