It’s Monday again and as usual, I’ll be putting my thoughts out there on a specific topic. As you can tell from the title I’m going to attempt to highlight what wire-frames are and why they are so important.

What is a wire-frame?

Wire-frames are simple layouts that outline the specific size and placement of page elements, site features, conversion areas for your website. They are devoid of color, font choices, logos or any real design elements that take away from purely focusing on a site’s structure.

We often say that they are much like a blueprint to a home, where you can easily see the structural placement of your plumbing, electrical and other structural elements without any interior design treatments. Here’s an example of my own websites’ homepage in wire-frame. The color in the image below has no real significance in terms in terms of site design. The colors are just a way the wire-frame tool uses to remind me if I am looking at a section, a row or an element.

Now let’s talk about why wire-frames are important.

They help to visualize what our websites’ structure look like

Simply put we can see what the structure of our site looks like in a visual manner so we can make changes if we deem them necessary.

Website features are more clear

If you take a look at the image above, you can tell that at some point in my design I will have testimonials and then at some point, I will have some kind of content within tabs. If my site was going to include videos for example then you would have been able to tell by looking at the image because the word video would most likely show up somewhere. My point is wire-frames can clarify any planned features.

Wire-frames help with usability

Wire-frames help us objectively identify if the layout we are thinking of for a specific page is actually usable, means that it helps your users get to where they what to go quickly and easily.

Wire-frames help early feedback

Wire-frames are easy enough to create so if you have an idea ready for a client to see in wire-frame than they most likely will be able to give you feedback on things they do like even before you realize that design that might have things that your client doesn’t like.

Wire-frames help you save time and money

As per our previous paragraph we mentioned that clients can give fast feedback on things they don’t like that you may have as an idea. Well, what if you hadn’t shown them your wire-frame and you wasted time creating the perfect design as you saw it your head just for them to modify or even totally shoot down because it just wasn’t what they had envisioned? You wasted time which equates to money obviously.

Lesson learned: Use wire-frames to make your life easier in the long run.

If you have any questions, feel free to email info@georgenicolaou.me