Evolving the University Website User Experience and Pattern Library

Overview

City, University of London is a public university offering career focused degree courses, with a global audience of over 350,000 users per month. 

In 2019, the university's main website www.city.ac.uk, had not been updated regular, resulting in a number of usability and accessibility issues: 

• The content was out of date with only 20% of pages currently fit for purpose

• The website was difficult to navigate 

• Website did not meet accessibility standards

• Pages lacked imagery that effectively showcased the university's facilities

Goals

The goal of the redesign was to improve the overall website of the website, making it more accessible and consistent in design. The project also involved creating a pattern library and documentation for in-house use.

Approach 

The project was a three-year collaboration between City's small in-house team. 

As lead UI designer on this project, I developed design solutions based of the business needs and user needs gathered from user architect and user researcher. 

I worked in an agile approach, working in two-week sprints. We had daily meetings as a team and monthly meetings with users and stakeholders. This allowed the team to get feedback early and often, and to make changes as needed.

The design approach for this project involved the following steps:

• Documentation of core design elements such as colour, fonts, grid, breakpoints, pseudo-classes and setting up clear naming convention.

• Creation of patterns to support different content types. Which we could do usability and functionality tests before template designs

• Creation of low and high fidelity template designs, prototypes and amends, which went through an iterative process after user testing results.  

• Feedback on incorrect design implementation, user testing results, accessibility issues or bugs were then snagged for final review. I would sign off on design quality control and provide guidance for developers

• Creation of documentation for patterns, templates and image guidelines for content officers, stakeholders and editors.

Outcomes

The launch of the City, University London website in 2021, has resulted in a number of positive outcomes and user engagement, including:

• Increased user engagement: The average time on page has increased by 10%, the bounce rate has decreased by 5%, and the average number of pages per session has increased by 20%.

• Increased website traffic: The website has seen a 20% increase in website traffic in the first year after the redesign. 

• Increased user satisfaction: User satisfaction with the new website has increased by 15% in the first year after the redesign. 

• Increased brand awareness: Brand awareness for City, University London has increased by 10% in the first year after the redesign.

Conclusion

The redevelopment of the City University London website was a major undertaking, but it was a success. The new website is user-friendly, accessible, consistent in design. It has been well-received by users and stakeholders, and it has resulted in a number of positive outcomes.