Once every other week I get approached by an agent that tells me a story that goes something like this:

Hey, I know you’ve built a bunch of successful niche real estate websites that generate you over 100 leads each month. I hired this guy in India off elance.com and the thing turned into a mess. Do you have a good web developer you can refer me too?

It’s not uncommon for agents to build a personalized or neighborhood based website and fail miserably in its development. I’ve been there, and I’ve built several fully functioning real estate sites for as little as $50, to as much as $3,000. Most of the sites I’ve built function the same way, have the same level of complexity and generate almost equal amount of leads. So why am I getting the same results no matter what the budget is?

When realtors are having problems with their web developers or budget, 90% of the time I know the issues lie in the agent’s failure to build effective wireframes. From what I have seen, most agents that unsuccessfully develop niche websites start making their site by sending their developers an email that goes something like this:

“Dear Developer,

This website [competitor’s website] is what I want my site to look like. Can you build my site like this, just change the logo and the phone number to x, y and z?

Thanks,

-Realtor”

The developer then tries to build the site without a clear understanding of what the agent is trying to accomplish. In the end they go back and forth until the pay becomes too little for the developer (in a fixed priced project) or too much for the agent (in an hourly pay project) and one decides to quit.

I have learned that the only thing to remedy this problem is too build dummy proof wireframes from the start. Wireframes for web developers are the equivalent to blueprints for a contractor. When they are clear and concise you reduce error, time, and costs.

The following guidelines should help you build effective wireframes on the cheap:

1. Pick a web design or template first:

Hiring a web developer is different than hiring a web designer. I don’t recommend hiring a developer and having him do design work. My suggestion is to go to templatemonster.com or a similar site and pick a template. You can always have your developer manipulate the layout. With a web design chosen you can visualize what your site is going to look like while building your wireframes.

2. Use PowerPoint to build your wireframes

There’s no need to spend money on an expensive program to build wireframes, especially when the likelihood of your developer having that program installed on his computer is low. Most people have access to PowerPoint, and it’s probably the easiest program for agents to use.

3. Create a template on the first page

The first page that you create should be a template. This should include the bare bones that each page will include: a header with a menu bar, logo, and phone number, a side bar with links and a footer with copyright information, disclosures and links to your site map.

4. Use the slides for layout & design and use the notes section for functionality.

Using the shapes tool, you should create squares showing where content on the page goes: “Image 1”, “Link 2”, “Text 3”. The notes section should be labeled, should explain to the developer where they can find this content and what happens when a user interacts with these items. For example, “Image 1 – located in folders>images>buildings and titled ‘Upper East Side Condos’. When user clicks image, it should expand to its original size”.

5. Create folders and files as you build your wireframes.

You should send your developer as much content to work with and upload from the start. This includes text, images, and audio. The content you send him should be organized in folders that you can reference in the notes section of your PowerPoint.

6. Use actions to show the developer what happens when they click buttons. 

When you are finally finished with all the pages of your wireframes you can use the action tool to link slides with each other. This way if your developer is confused about the functionality of an item or your description in the notes section he can click the specific icon in the slide and it will take him to that page.