Website Design Step 2: Wireframes

What are Wireframes?

All of my projects first start with a discovery phase. From this discovery phase, I get the requirements of the actual project, and the wireframes visually communicate them.

Wireframes are essentially a blueprint of a website design. Much like an architect with a building, a designer can’t just dive into the design/development of a website without first laying out a plan. Wireframes are a rough layout of a site. They give a general understanding of where things will go on the page.

What I love to do on my wireframes is document all additional functionality/interactivity outside of a static page. This gives a baseline for expectations for the fully produced site. For example, if the client is expecting a large slider on the home page but didn’t tell me that during the discovery phase, the wireframes give me another filter to catch that miscommunication.

Wireframes aren’t designed, they don’t have images, text, or color. In other words, they are nothing my mom would want to hang on the fridge. I leave that up to the design process, which follows wireframes.

Why they are critical to the website Design process.

The reason I don’t like to skip over wireframes is because, it gets buy-in from the client and creates expectations on the website holistically. With larger website design projects, wireframes are critical to staying on budget. It is my goal to remain within budget for all client websites, and design revisions take a whole lot longer on a mockup of the website versus on wireframes. Also when I document and get approval on the functionality/interactivity, I can create a more exact timeline for the development phase.

Many people don’t expect this as part of the process when working with a design and don’t take them seriously. When that happens, timelines get out of control. I totally understand that this is probably the least “sexy” part of the website design process, but you need the blueprints to build a house.

When can you skip Wireframes.

While I don’t recommend it, there are cases in which you could skip them. Some clients are working within a tight budget, so to save time we work with an existing WordPress theme. In this case, we agree on a theme and build it in its demo site layout. So instead of a wireframing process, I do a search for premade themes that fit their needs.

A website is so much more than the color and image choices. The actual structure separates okay sites from lead generating, high traffic, and all around badass sites.

I am currently accepting new freelance clients

If you have a great idea or project, I’d love to hear from you.