Home ArticlesAbout

What Is A Wireframe?

A Wireframe is a basic outline of what a product should look and function like.

Wireframes Demystified

Wireframes show a skeleton of a user interface. They identify areas where content appears, such as images, text and navigation.

Wireframes often include notations or notes explaining elements of the design in detail. They are a useful communication tool for designers who want clients to sign off on a design without getting hung up on the asthetics.

Wireframes != Prototypes

Wireframes do not really work as prototypes. In the early design phase you should be more interested in the navigation, workflow, terminology and functionality than in details of the visual design.

Wireframes are usually produced towards the end of the design phase and not at the beginning. At this point, many important design decisions have already been made.

Many people are obsessed with wireframes but in most projects, they aren't needed. They tend to be an overhead. You'll find that an electronic prototype, iterated as the project progresses, provides a much more powerful design communication tool than a wireframe.

Simple UX Design 

• Pick your tool and create a template layout
• Create a wireframe inventory and get wireframing
• Pay attention to sequence and state
• Use information density, design principles including error messages or states
• Seek and listen to feedback