Featured Project | Oaklands Wolves Academies

Project Overview

The Oaklands Wolves Academies are part of Oaklands College offering further education to 7,500 students. Although the Sports Academy programmes run alongside the main courses at Oaklands College, they wanted their own website which would link directly from the main college website and allow them to have more control over management of their content and style.

The brief was for a bold ‘American College’ look and feel to their website to complement their branding.

Training and documentation was provided to members of the marketing team who are able to make changes and updates to content when required.

Ongoing support and development is provided by Pink Desk Studio.

Consistent Design

The website has a number of different sports academy pages with each page displaying quite a lot of information about each individual academy. To enhance familiarity with each page, exactly the same structure and design was used for each academy. This consistency of design improves navigation speed. Once a user knows where a particular information type is located on one page they will quickly be able to find the same information type on another page.

Example Of Consistent Design

Carousel

Depending on the academy, the coaches section needed to display different numbers of staff members. In order to keep the look of the section consistent for each academy page, we used a carousel to display this information. The carousel allows horizontal scrolling and is scaleable so it can be used to accommodate any number of coaches with their photo and bio information.

Example of Carousel

Easy Page Scanning

When viewing websites people tend to scan through pages first to find the information they are looking for before beginning to read. We used visual hierarchy techniques to assist with page scanning and grouped related information into visibly different sections.

Example of Easy Page Scanning

Additionally, with the large amount of content to display on each page, we used show/hide toggles to allow viewers to display only the information they were interested in and reduce scrolling time.

Menus

On the academy pages two menus are visible. The main menu allows switching between pages but because of the amount of information that needed to be displayed on each academy page a second menu was used.

Example of Menu

 

This second menu ‘sticks’ to the top of the page and allows users to quickly jump to different sections of the page without the need for excessive scrolling.

Blog Integration

Oaklands Wolves use blogs to announce relevant information on a regular basis. We created a Latest News section on the home page to display the last six blog posts. This is very easy to maintain as it is set up so that when a new post is added, the blog section automatically displays it and removes the oldest post from view. There is no need for the client to edit the homepage.

Example of Blog Integration

Social Media Integration

Oaklands Wolves use a number of social media accounts (Facebook, Twitter and Instagram) not only for the college itself but also for each individual sports academy. We used consistently designed icons on each individual academy page and displayed social media icons for all academies on the site’s main contact page.

Example of Social Media Integration

Responsive Design

All our websites are checked on desktop computer screens, laptops, tablets and mobile phones to ensure that user experience and website functionality is maintained no matter what device it is being viewed on.

Example of Responsive Design