Remapping a College website’s navigation

Project Brief

We worked with a local technical training centre to redesign their website for more efficient navigation. Their marketing department was concerned that the school’s current website was difficult to understand and complained of a high drop-off rate, especially on the sign-up form.

ROLE

User Researcher
Information Architect
Content Strategist

Tools

Invision
Axure

Design Process

RESEARCH

We conducted a series of usability testing alongside card sorting. We ran this study across 20 individuals from a range of backgrounds, including existing students and those who were likely to be interested in the college’s offerings. We also made sure to familiarise ourselves with the website and ran a content audit to understand its current organisation.

Problem

We found that users typically complained of difficulty in navigating the website, and that this stemmed from various sources.

One issue that frequently surfaced during usability testing was the frequent repetition of material - because the school offered many similar courses at various levels under different schemes, much of the course information was similar in content. This was further compounded by the jargon-heavy and unwieldy copy that users complained about. This made it difficult for them to understand what they were looking at and in identifying which programme was most suitable for them.

Similarly, during card sorting, we found that users understood the website’s terminology differently from the website’s intended meaning, and frequently ended up on the wrong pages, typically getting lost before quickly giving up.

On the site’s user interface, there was also a lack of salient visual hierarchy that made it difficult for users to easily distinguish between information groups or identify headers, links or Call-To-Action buttons. The site also utilised an inefficient navigation system where three of the navigation branches on the site's top navigation bar linked to the same sets of information. Users quickly became disoriented and felt a psychological information overload. 

Prototyping and more research

Based on this research, we rewrote the website’s information architecture in an attempt to create more efficiency in its organisation. We then ran a tree test using this new structure against another set of 10 users to determine if navigability had improved. We also wireframed possible UIs and tested a new prototype against another set of users with our proposed solutions to see if the time taken to accomplish the tasks laid out in the initial usability testing had improved. It did.

Solution