What is wireframing? Simply stated, it’s one of the most essential aspects of the UX (user experience) design process. If you’ve dabbled in the complex world of user experience design, chances are that you’ve at least heard the term “wireframes” floating around.
But what exactly are wireframes, and why are they such an important part of the UX design process?
In this guide, you’ll learn exactly what a wireframe is. We’ll begin by showing you the makeup of a wireframe and explain how wireframes fit into the overall design process. You’ll also learn what features wireframes should include.
After that, we’ll show you the different wireframe types and the tools you’ll need to build your own.
At the conclusion, you’ll have gone from wondering, “What is wireframing?” to be able to create and employ your own wireframes with ease.
Now, let’s take a look.
What Is a Wireframe?
Let’s start at square one with the simple question of, “What is a wireframe?”
In reality, it’s not all that different from a blueprint that architects use. It’s a two-dimensional outline of an app or webpage that a designer will use to build the final product around. The intent of a wireframe is to give the designer an obvious overview of a page:
- Layout
- Structure
- User flow
- Intended behaviors
- Information architecture
- Functionality
A wireframe will almost always represent the initial concept of the design project. As such, things like graphics, color, and styling are kept to a bare bones minimum.
In some cases, a wireframe may be sketched out by hand on a piece of paper. Other wireframes are created in the digital realm. It really depends on the detail that’s needed in the specific wireframe. It also depends on how much detail will go into the final design of the webpage or app.
In other words, the more detailed the webpage, the more detailed the wireframe will need to be.
The practice of wireframing is most often used by UX design teams. Going through the process will allow all of the parties involved (stakeholders) to come to an agreement on where information will be located on a page before the project is handed over to developers to build out.
Wireframing a project before it’s handed over to developers often saves a lot of headaches down the road. This is because the initial blueprint of the project (the wireframe) can (and should) always be the first reference point of what the end result should look like.
When Is the Best Time To Wireframe?
In most cases, the process of wireframing will happen during the phase of the product life cycle called the exploratory phase.
The
[…]
This article was written by Kristen Wright and originally published on WordPress News | iThemes Blog.