…or how to avoid scope creep and manage your wireframe work

Ever fell in the wireframe scope creep trap? You are starting your work on the wireframes – and during the review cycles your client comes up with more and more requirements or new ideas for features.
And some of it is part of the natural process – and we even want this to happen: prototyping should allow us to experiment and to brainstorm about fresh ideas.
But as a freelancer you also wear the hat of a project manager and you have to make sure that all requirements stay in your estimated time and budget.

Get organized with your wireframes

In order to manage your time and to stay in your estimate you have to manage your work from the beginning on. And that starts with a good estimate of your work. Identify the number of wireframes that you need to deliver. To do so make sure you are clear on the target audience, the user goals (= the purpose of the website) and the site structure.

Target Audience

• Who is the target audience for your product (website or mobile application)?
• What are your users trying to accomplish, what is their main goal?
• How do you support your users to reach their goal?

Use those questions to create a list of features and content elements that you want to include in your product. You can use scenarios or user stories to identify the content that is needed to create value for your users.

After you put your list together with ideas for content elements go through it and:
a. Group content items to identify the page that they should be living on
b. Prioritize content items to identify the key features

Site Structure

Once you have identified the groups or pages for your content elements you can lay out the information hierarchy: how should a user be able to access the content? How are the different pages connected?
A sitemap will help to define the overarching structure. But it can do more than that:

• You can add the main goal for each page and visualize task flows:

• You can identify the different types of pages by adding a little icon

• You can also be more specific an visualize the main content items in a very rough mini-wireframe per page

This set up will help you to
– estimate the amount of wireframes you need to create
– understand the complexity of each page (not every wireframe page needs the same amount of work)
– define the scope of your work and use it as a guideline throughout the process

Stay organized and keep consistency

The planning process at the beginning is only part of the work. You need to make sure that you communicate your work properly and that your client understands the bigger picture.
The wireframes will define the direction of our product and provide guidance. But we won’t create a wireframe for every single page to “simulate” the final product. Instead we are aiming for a design language and for interaction patterns so we can achieve a consistent user experience during the overarching task flow.

A “wireframe template map” will help you to stay consistent with your interaction elements and to communicate the bigger picture to your client.

Map the wireframes to your sitemap and use some kind of “coding” system to identify the page templates that you have wireframes for. Clients can now look at it and understand what wireframe presents which part of the product; developers can use this map as an index and understand how wireframes are connected.

I often use a wireframe template map also as an index for a wireframe document to increase readability of my deliverables.

Summary

To get organized and stay organized with your wireframes you should:

• Know your user needs (in form of user stories)
• Generate a list of content items that will meet your user needs
• Cluster content items into groups (= pages)
• Create a site structure + task flow
• Map your wireframes to the site structure + task flow

I hope that will help you to avoid any future scope creep. Happy wireframing!