Why Wireframe

Wondering why or when you should be willing to wireframe your website? Well, we’re willing to walk you through why wire framing will be worth your while.

To start off, the purpose of a wireframe is to simplify the visual process of content organization. Think of it as building a home: First, a foundation is laid for the frame of the house to soundly sit upon, and then you proceed to add detail and structure until you end with specific, finishing touches. You wouldn’t start by adding the finishing touches such as paint, trim, and carpet. This concept also applies to designing a website: Preparing the website design with a simple and sound structure allows for a much more efficient and smooth process moving forward.

The first step of creating a wire frame is best done through drawing out a rough outline on paper. It is easiest for the designer to make quick, multiple edits without having to worry about pixel perfect alignment on a plain ol’ piece of paper and a #2 Ticonderoga. The designer will use basic shapes and lines to represent the location of images and text on the page. Jumping straight to the computer is dangerous. It may sound like a quicker way to get to the end design, but it only invites the designer to focus on small, minute details, which should not be taken into consideration at this point. The wireframe gives the designer a simplified, overall view of the page layout. On paper is where this page layout starts to take form.

Now that we have a general foundation drawn out, the next step is to move the rough wireframes to the computer. This allows the designer to focus problem solving in terms of pixel alignment, spacing, visual balance, interest, font, image location, and page flow while leaving color and other branding aesthetics out of the equation. This prevents distraction, designing in circles, and burning hours. It is easy to get caught up in details that can and should be smoothed out later in the design process.

The wire frame process is designed to keep the designer focused on bits at a time within the process, rather than trying to solve all of the issues that a web design poses at once. This prepares for smooth design sailing from start to finish through strategic exploration and planning.