A fully qualified User Centred Design procedure to re-architect and re-design this 10,000 page website for one of Australia's largest professional membership organisations.
The Challenge
The CPA website grew organically over the years. Eventually it presented a very limited style of navigation that was 6 or 7 levels deep in some places and hid content from users who needed it.
Put simply the plan behind this project was to improve the layout of the site, to make it easy to navigate, and to reduce the amount of clicks leading to the correct content. Creating an environment that is user friendly to CPA members (with their own logins) and the general public was a priority.
The Solution: User Centred Design (UCD)
DDSN delivered a fully qualified user centred design process to re-design the CPA Australia website from the ground up.
- Market research
- Design and information surveys
- Stakeholder questionnaires & workshops
- Information labelling and navigation
- Card sorting
- User activity scenarios
- Taxonomy and blueprint development
- Detailed prototype development
- Graphic / interaction design with design focus groups
- Prototype user testing
- HTML template construction
- Accessibility testing (priority 2)
Information labelling and navigation
We began by accounting for feedback and research performed by each department of CPA. A card sort with disparate groups of end users was conducted to find out the most common and easily recognisable names, or labels, for website sections as well as the initial navigation hierarchy.
Rigorous testing of these fundamental specifications took place with end users, including employees of CPA as well as CPA members and the general public.
User testing
Testing involved two rounds of scenario testing and one round of design focus groups. There was a focus on members of CPA being involved, but users from the general population and potential new visitors to the CPA site were also tested. The sessions also involved students and CPA staff.
Prototypes
The first scenario testing took place once the taxonomy had been decided and before commencement of the design process. This session aimed to test the IA to assure user friendliness and common sense structures. The testing was completed using a grey scale prototype - models of the layout of the site with no design whatsoever, one step up from wireframes but one step before an interface prototype.
Graphic Design / Interaction Design
The design focus groups involved a total of 15 people in two sessions, who reviewed a set of three example designs that were whittled down from eight concepts created in the graphic design phase. The example designs (drawn from stakeholder requirements and rigorous internal testing) had been applied to the navigation structures at this point, producing a full interface prototype. The groups were asked to evaluate the design and perform of the site, and a quick round of group scenario testing took place to verify that IA was not disturbed. Three design mock-ups were evaluated. Detailed questionnaires were filled out by each member of the group.
More Testing
After this came more scenario testing. These tests were used to validate the design with respect to usability, to assure that the design supported the IA goals, and to focus on people's ability to drill down through the site for information.
Building Templates to W3C Standards
Once the design was signed off and the layout of the navigation was finalised 10 major site templates were chosen. DDSN built these to W3C specifications and tested them in all major browsers (Internet Explorer 4-6, Netscape 3-7, Mozilla 1.0 - 1,4, Opera 7, Safari) on all major platforms (Windows 98, NT & 2000, Mac OS9 & OSX, Linux). The templates were also tested in a text reader (for blind users) and with limited colours (for colour blind users).
Implementation
Once the templates were found to be compliant they were handed over to CPA to be integrated into the RedDot Content Management System, along with a detailed design style guide, strict usability and IA implementation guidelines, and functionally oriented navigation instructions.
Verification Testing
DDSN will applied series of rigorous test on the final site before it launched in July 2004 (a year after the design process began) to assure all standards defined during the UCD process had been adequately met.
A Pre-qualified Outcome
The CPA website provides over 10,000 pages of information to nearly a dozen major user groups, and provides both detailed marketing services as well as customer support mechanisms. The UCD based interface design process undertaken on this project was as deep as it can go, with both user and stakeholder testing iterations happening at every point in the project.
This case study only introduces only a fraction of the detail to which testing, analysis, and design iterations were reviewed.
The overall design process took four months to complete, but assured the maximum possible level of quality assurance in the final product. We're not guessing that this is a usable website, we have measured the level of usability via detailed metrics collected during the testing and analysis process.