Creating Functional Wireframes

Functional wireframes are an intrinsic part of any web development process. They illustrates how each page is structured as well as information about each  button, field, piece of content and functionality. It provides an overview of all of the different templates within a site inclusding their function and features.

Wireframe Content

Each wireframe contains the following information and a description:

  • Title: This is at the top of every wireframe. The wireframe title describes the purpose of the wireframe.
  • How to get here: this section describes how the user got to this content block
  • Concept/Purpose/Objective: this section describes what the objective or purpose is for this panel.
  • Content/Data: this section describes all the content on the panel including any buttons or icons.
  • Buttons/Links:
  • If: Then: This section describes a user behavior and the result of that behavior (e.g., what panel is rendered after the ‘If’ condition is met).
  • Navigation Links/Buttons: this section describes any navigation links on the page.
  • Error conditions: this section describes any errors that may result from a user behavior and what message wireframe they will receive.

More information on Functional Wireframes

Comments are closed.