WUP offers wireframe development.
Download this product sheet in PDF format
Why and when
Many websites have screen elements (e.g. navigation bars, content panes, search boxes, etc.) that are not placed in the optimal position from a user’s perspective. Often the layout of pages is based on what an organisation wants to ‘tell’ users rather than on user priorities. The best way to develop a usable wireframe is to involve users in its development. (NB a wireframe is a representation of all the key page elements, including the information architecture showing where they would appear on the page prior to any design elements being added).
Wireframe development is an integral part of the user-centred design of a website. Advisably, it should be carried out after the user goals the site should support have been agreed, and the information architecture (i.e. how content is chunked into a hierarchy) has been developed, but before any work on design is undertaken. However, existing sites with poor page layouts also benefit from wireframe development.
Our approach
Normally, wireframe development is part of a wider user-centred web design project involving research to understand users and their goals, and development of a usable information architecture. Therefore, the development of the initial wireframes is informed by the user research undertaken in these other stages of the project.
Typically we develop wireframes for a home page, navigation pages and the main content page types.
The prototype is ideally tested and refined through a series of iterative research sessions with representative target users. Two or three iterations of user research are normally adequate.
How we do it
We develop one or more variations of each template based on an understanding of users and their goals (identified through earlier research). We like to populate the wireframes with real content for a small number of user goals (10-20) so, when we test the wireframes, users can undertake their tasks completely.
User testing of the wireframes consists of two types:
- Formal testing (2 iterations) with observed usability testing of the whole prototype; the first typically following the development of the first wireframe prototype, and the second at the final wireframe prototype development stage to enable a ‘whole site’ perspective to be adopted. These iterations will involve key client stakeholders in site development
- Informal testing (number of iterations varies) with users, on elements of the site during prototype development. These are ‘work-in-progress’ sessions to test developments of, and identify improvements to, specific elements of the wireframes
The formal testing is conducted as follows:
- Each research session is typically conducted at our premises and takes place over one day. The session is attended by up to 8 client personnel.
- The research is split into two parts: user testing in the morning and consideration of the results in the afternoon to refine the prototype wireframes
- Prior to the test day, WUP agrees a set of user goals with the client to be used in the research
- WUP recruits the testers – profiles of which are agreed with the client
- WUP prepares a simple HTML representation of the prototype wireframe
- Each tester tests the prototype for c. 50 minutes individually.
- The testers are asked “Where would you click” to achieve each goal, through as many levels as there are in the prototype wireframe. They are asked to ‘think aloud’ so we can understand any issues about the usability of the wireframes.
- On the same day, following the user testing, WUP facilitates and contributes to a discussion to produce a revised wireframe for the next round of testing
- A report is produced summarising the research, analysis and detailing the revised wireframes.
Informal testing is conducted with a panel of testers, representative of the target audiences, in order to undertake short, fast, informal usability testing of development concepts. These might be new ideas or changes to elements that have previously encountered problems in testing. Testers can be called in at short notice to provide feedback as appropriate.
Outputs
The output of the research is a set of site wireframes showing all the key screen elements on the home, navigation and content pages. This is also detailed in a report.
| Client | Project | Date |
|---|---|---|
| Age Concern | User research and stakeholder interviews followed by IA development and two rounds of wireframe testing with 11 respondents. | March 2008 |
| Avon & Somerset | User research and stakeholders workshop followed by development and two rounds of testing of Intranet wireframes | Feb 2008 |
| Biotechnology & Biological Sciences Research Council | Development and testing of site wireframes involving formal and informal testing with 8 respondents | July 2007 |
| Environment Agency – What’s in your back yard? | Usability testing and strategic workshop followed by development and testing of site wireframes involving formal and informal testing with 8 respondents | March 2007 |
| Environment Agency – NetRegs | User research and information architecture development followed by development and testing of site wireframes involving formal and informal testing with 18 respondents | March 2007 |
Fees
Most of our work is tailored to individual client’s requirements and we quote an inclusive price for each piece of work.
However, the following gives an illustration of typical costs:
- Template development - £950 per template
- Formal (i.e. observed) user testing (6 testers) - £6,950 per round
- Informal testing (6 testers) - £4,950
Terms & Conditions
- VAT will be added to all charges at the currently prevailing rate. Payment will be within 30 days on the presentation of our invoice.
- Additional work not identified above would be charged at WUP’s standard rates (£950/day for directors, £750/day for consultants, £600/day for facilitators, £250/day for support staff). Additional expenses not shown above would be charged at cost
- Cancellation of booked sessions will incur cancellation fees as follows: cancellation within 4 weeks of the session, 50% of the fee payable; cancellation within 2 weeks of the session, 100% of fee is payable
- The rates quoted assume tester remuneration of £40 plus travel expenses up to a maximum of £10. If tester remuneration needs to be greater than this for any reason (e.g. securing individuals with high time value or on short lead times) then any costs above the basic charge will be invoiced at cost.
- It is assumed that the client will invite the observers to research sessions