Website redesign | User research

Building an elegant, intuitive, and easily manageable website for Kellogg College MCR

Challenge: Creating a more intuitive and visually appealing site for an Oxford College MCR 

The college MCR manage their own website, but it was using an outdated theme with broken plugins. Resultingly, the website was not just outdated – but completely dysfunctional. I took on the project with the task of making a website that would live up to the legacy and heritage of the college, whilst being easily manageable by a committee with varying levels of IT-literacy.

Solution: A redesign of a WordPress site that can be easily managed by the collece committee

The new website has a customised design with an elegant vertical menu, well recieved amongst the committee and the members. The entire site is easy to update and edit, even with no previous experience with websites – ideal for a committee with a new IT officer each year. The site is also optimised for SEO, ensuring that no current or prospective member miss it on Google.

Taking an inventory

With a need for a complete redesign, I began with taking inventory of all of the current content on the website – ensuring that no images or text would be lost in the process, and creating a solid backup just in case.

Mapping user groups and restructuring the site

Before any design is done, I begin by answering a few questions: Who is going to be using the website? Why are they going to use it? What is our goal when they visit? By doing so, it becomes far easier to identify a more intuitive layout and flow. Immediately, it was obvious that there were far too many pages – some with duplicate or similar content that could be merged. The college offered a host of services and activities, but instead of listing each activity in the menu it made sense to group them all on a single page called ‘activities’. Each activity still exist as a seperate page, but no longer exist in the main menu – confusing visitors. A little sub-menu appears when hovering over ‘activities’ for quick access.

Once the site architecture was decided, all of the content collected from the old site was rewritten and restructured to fit. Rather than long pages, copy-pasted from Word Documents, the information was shortened and displayed in a more pleasing format. I used ‘accordions’ extensively, providing just the header of information together with a little plus symbol, allowing more information to pop up upon click. This allowed detailed practical information to be included for those that need it, without confusing the general flow.

Design and brand assets

Once the architecture and content was finalised, I designed the site with a concern for the heritage and reputation of the college MCR. Rather than using the logos in their original form, I vectorised them into black and white to get a minimalist grayscale page. Using their database, I gathered the most appealing photographs to compliment the otherwise minimalist design – giving space to the athmosphere and arhictecture of the college.  

Easy management for the committee

The committee has a new IT officer every year, and this is probably part of the reason for why the website eventually broke down. By using the WordPress system and a set of robust plugins, the site is guaranteed to not break again. The admin page is also tailored (custom post types, taxonomies, and templates) so that new IT officers can edit and change information without worrying that the design is compromised. Finally, integrating a tool to insert keywords and page information, the site is fully optimised for SEO – ensuring that no current or future member of the MCR should miss it on google.