Wireframes are the type of document most closely associated with the role of UX Designer.

More specifically, though, they represent the output of the subset discipline "Interaction Design (IxD)." Wireframes specify the form and behavior of software interface components. They are typically arranged sequentially by scenario and include detailed annotations.

Wireframes should not be confused with prototypes, which are distinct in being interactive and navigable. Wireframes are static, utilitarian, formalized documents similar in nature and purpose to architectural blueprints. Wireframes are consumed by Developers who use them to write production code and occasionally by Visual Designers to create comprehensive layouts.

Wireframes get their name from their often spartan black-and-white appearance, depicting only the outlines of the specified screen components. Form and behavior need not encompass look-and-feel. Indeed, leaving out Visual Design helps speed the document’s creation and generally enhances its clarity.

However, wireframes are occasionally rendered in high resolution when stakeholders besides Developers need to review them.

Are wireframes obsolete?

A recent school of thought holds that because a number of modern prototyping tools enable UX Designers to combine the Interaction and Visual Design steps, there’s no longer a need for wireframes.

While such a strategy might suffice in certain instances and for smaller projects, it just doesn’t scale. For large, complex enterprise solutions, the time it would take to prototype every workflow would be prohibitive. And forcing every change through the Visual Design layer creates an unnecessary bottleneck.

As you review my wireframe samples, please bear in mind that the color scheme, fonts and iconography that occasionally appear in them may or may not be my own.

Screens comprising a workflow specified in a wireframe must often comport with a company aesthetic for the sake of consistency. In such instances, a separate Visual Designer would apply that look-and-feel after the wireframe is finalized.

In short, I always recommend judging wireframes by their manifest clarity and descriptiveness.

Examples of Visual Design I’ve created can be found here.