Have you ever spent countless hours designing the fine details of a website just to discover later that the designs were not even used in the final solution? This is probably because you didn’t spend enough time focusing on the wireframes. A bigger idea or design didn’t end up working as planned so all the micro-idea and designs were scrapped or had to be completely redesigned, meaning you wasted time and money.

Wireframing an experience allows you explore navigation patterns, layout structure, hierarchal structure, and certain interactions before the visual design has started. Wireframes avoid the finer details that don’t really change the function of the interaction or experience such as color, font, decorative images, etc.

A good wireframe can allow you to test, learn and improve before you start focusing on the more specific design details. This allows you to make changes to a project while the changes are still cost effective. Discovering that an idea won’t work at the beginning of a project is much better than discovering it at the end of project.