Are you surrounded by web developers and graphic designers in your office every day? Do you need to communicate your ideas to them, but can’t code yourself out of a paper bag or stay in the lines when coloring your favorite book?

In this post, we’re going to share a method with you that gives web developers and designers exactly what they need while you stay in your area of strength.

For context, let’s assume we are about to embark on a website redesign, and we have already set goals for our new site and done the research to back them up. Now we have to be able to communicate the concepts of our new site to our designers and web developers.

Before Building or Designing, Revisit Goals and Research

Before we create the first interactive concept on the new website, we need to refresh our memory with the goals we set for the site to make sure our team has them top of mind. Without that, the potential to create “make work” is great.

Our team communication needs to be clear and concise when building concepts to share with designers and developers. For this example, let’s say our primary goal for the site is to generate leads.

Last time, we talked about how important it is to do our research, and understand our competition, and value proposition. So we know our strengths and how to tell our story. Now let’s conceive an interactive path a visitor will take on your website to reach that goal: becoming a lead.

Now, Let’s Put a Concept Together to Build

Sometimes it’s easier to begin with the end in mind. Let’s assume we have created a cool chart that serves as a handy reference guide for our customers, and they love it. We have also learned that it appeals to our best prospects.

To meet more prospects, we have decided to give the chart away online … almost. We’ll actually trade it in exchange for their name and email address. This will be one interaction for our lead generation site. We can have more, but this is our focus for now.

We’re going to list each step of the interaction as we imagine it. We are going to:

• Tell them what they’ll get
• Show them how to get it
• Ask them for their information
• Thank them
• Then, fulfill our promise

To create these pages, we’ll want some design help. But before we do, we’ll sketch the concept.

The simplicity of the sketch is important so we can communicate the aspects of the page that are not related to the look and feel. There is plenty of time for that later. To help non-artists, there are several good mockup tools for these purposes that are easy to learn and use.

The concept sketch below has the first three elements listed above:

• What they will get.
• How to get it.
• A place to give us their information.

Yet, it still leaves room for a designer to design. That’s the key; some direction with some latitude.

Now let’s finish with items four and five, the concept for the “thank you” and the “download”:

Again, keep it simple, provide direction, and leave room for design.

Warning: Avoid These 3 Mistakes

The most important part of these concept sketches are to communicate the interaction to the designer and developer, not to actually create it. Our experience has shown that once we add certain elements to a sketch, the conversation shifts to those items and we lose focus of the interaction. If you don’t want to mess this part up, here are three things to remember:

• Don’t add colors.
• Don’t use your logo.
• Don’t add images.

These items have a way of steering the conversation away from our main focus: the interaction. Those other items are important, but later. Right now, we need our co-worker or our team focused on the interaction only. This way we can focus on questions like:

• Do we have the offer right?
• Can we make it easier for a user?
• Can our message be clearer?
• Can our offer be more compelling?

This is where our attention should be at this stage, not the details around design elements. Let that be next. Don’t let the conversation get mired in the weeds.

When the pages are complete, you will see how these concepts will show through in the design, and you’ll have a way to know you have arrived.

So Remember, Before You Create New Concepts for Your Site …

Concept sketches can be instrumental when we communicate aspects of a web page to our design and development team. In the spirit of concept sketches, let’s wrap this up in simple terms:

• Before you start designing or developing, remind yourself of the goals.
• Get the research you did in front of you.
• Think through a user interaction and sketch the concept.
• Intentionally omit distracting details like color, logo, and images.

If you put concept sketches into practice, you’re almost guaranteed good results. Give it a shot and let us know how it worked (or didn’t work).