The review and ultimate signoff of wireframes is the second milestone during a standard web project, typically coming shortly after the sitemap is confirmed. Often times we’ll run the sitemap and wireframe phases in parallel. For each page template we will build, there will be a wireframe.
What are Wireframes?
The following are key functions of wireframes:
- Wireframes are one of the foundation stages of the design phase when we match up requirements (as gathered during the workshop) to web page elements and associated functionality.
- Wireframes “mockup” the layout or structure of elements on a web page. Example of page elements are the header and contents, navigation, sidebars and their widgets/buttons, body text areas etc.
- We provide wireframes with an accompanying document that has high-level notes regarding the functionality of the page elements. This is intended to put the design in context, not to provide fine details about functionality.
Wireframes are Not…
Wireframes do not include:
- Aesthetic design or the stylesheet. Wireframes don’t convey any aesthetic design. In fact, on the the contrary, they are dead ugly for a reason, so that aesthetic design considerations do not interfere with the functional requirements of the page templates.
- Final Copy – Placeholder or generic text is often used to provide context for the page elements. Copy writing is managed through a separate document and process.
Functionality/Content Mapping
In conjunction with the wireframes, we will map out the functionality and the miscellaneous content such as:
- Text and images that appear in banners,
- Common page blocks such as header/footer/sidebars
- Footer menu items and links
This is all non CMS page/non catalogue content. This will all be mapped out on document that is complementary to the wireframes.
Review Process
- You’ll be provided with 2 types of documents for the review. i) the individual wireframes in image format, ii) a link to a Google Doc that contains the functionality notes.
- Review the wireframes – Match up the notes in the functionality document to the wireframe elements.
- Provide feedback. – Always provide as much feedback in the first instance. While there are 2 rounds of revisions available, best practice says provide as much feedback first time around. 2nd revision should ideally be a quick check before sign-off. The more feedback provided in the first revision, the less chance there is of missing something and incurring extra time or cost for additional rounds. See below…
- Limitation of feedback – There is a limit of 2 reviews per wireframe. Any changes requested after 2 reviews, or sign off, are considered variations and may incur an additional charge at the current ad-hoc hourly rate.
- Sign off – Individual confirmation is required per wireframe within the Basecamp tasks and a final Wireframes sign off document is also required to be completed prior to moving on to the creation of the templates designs.
