Wireframing

Posted by Kaitlin Kelly on August 16, 2019

Wireframing, or sometimes referred to as a page schematic, is a visual representation of the framework of your website. This step can easily be overlooked if you tend to jump right in, but taking a step back to visualize the roadmap of your website can be immensely beneficial.

Why should I use a wireframing software to map out my website? A couple of reasons.

First and foremost, it actually saves you time in the long run. If you are working on a website with a team of people who presumably need to agree on a design, this is a great way to arrive at a joint consensus before major work is done to the website. By agreeing on the design at a fundamental level, we know the work we’re coding is the work we need to be coding. Furthermore, most wireframing platforms allow you to add members of the team to make edits directly.

Second of all, user experience. Taking a step back to create a cohesive layout at the skeletal level will improve user experience. The flow of the website will be intentional instead of erratic, and the user will be able to sense this.

Thirdly, often times it has the capability to be exported. In my experience with Jumpchart, I am able to export my wireframe into HTML, PDF, CSV, Wordpress, or Drupal. This lets you quickly share with the team, or get a head start on your Wordpress/Drupal website.

Last but not least, it’s easy! Wireframing is not a complex step in most cases. Sure, mapping out the website will be the hardest part of this step and require some detailed focus, but actually wireframing is as easy as click/type/drag. There are several software companies that provide easy to use wireframing platforms; some options are free and others come at a cost (but with added functionality).