Selby College

A responsive rebuild that increased student applications and engagement across devices

Image for Selby College

The brief

The Selby College website has been around for many years but when we began discussions with the Selby team in 2014 it was long overdue for an overhaul.

Over the years, the site has only ever been added to, nothing appeared to ever be deleted - a not uncommon situation - and there was just noise everywhere. No structure or plan for featuring the many leading courses and facilities that Selby College boasts.

Our job was to strip back the noise, design a contemporary new look and and feel along with a responsive front end of the website to better cater to the wide range of devices and computers that access the site.

Project goals

  1. Make content (specifically the types of courses Selby College offer) easier to discover and browse
  2. Improve the ease with which potential students can apply for courses online
  3. Refine and hack away years of redundant content clutter and present what was left in a responsive and accessible new design

All within a short timescale and working within a set budget.

Quick iteration of design and prototypes

We always like to sketch and protoype ideas but often there is still a need for visuals to be created to appease board members or a mysterious stakeholder.

Because of the amount we wanted to achieve within the budget was tight, we were able to work quickly and in a very agile manner with Rob who led the project at Selby and Justin who provides Selby with all their branding work.

The result was a swift and efficient design phase quickly identifying and pruning redundant content and working from paper sketches through to HTML prototypes in no time.

case-study-selby-prototype.png
Quick wireframe sketches on paper and in Balsamiq were translated directly to HTML prototypes to test.

Selby have a strong brand and also generate significant print media so we were able to take a lead from this and work with some of their typography and colour guides but beyond this, sketching and then building quick HMTL prototypes allowed us to create and refine a working responsive site reasonably quickly.

Project Design Snippets

selby-grid-prototyping.jpg
selby-grid-brand-bar.png
selby-grid-header.png
selby-grid-nav.png
selby-grid-search.png
selby-grid-themed-1.png
selby-grid-nav-2.png

Building components & Umbraco templates

Umbraco is our CMS of choice and we typically build static HTML templates to test the content all fits before build the matching input fields or wire up existing forms in the CMS and having the prototypes already built and tested to reasonable level already helps massively with transition to a more polished product.

We were able to significantly improve discoverability on the site (Goal 1) through the use of the distinctive "brand nav" that sits below the feature photography used throughout the site. Selby's courses split into 6 key areas and on the old site, even this had become lost in the noise.

Our focus on making this clear has led to significantly improved feedback from users and when combined with the live auto-completing search on the homepage many more visitors are getting where they want a lot quicker.

case-study-selby-auto-search-large.jpg
Helping guide visitors with sensible and configurable autocompleting search results

One of the biggest challenges on the site was improving one of the biggest, most cumbersome forms we've ever laid eyes on.

It was immediately clear when we did an audit of the site that the course application form was a usability black-hole. It was 6 large sections broken into sets of mandatory questions totalling somewhere in the region of 80 fields that all had to be completed for various legal reasons to process an initial application.

We rebuilt the form from scratch, broke up the content and questions into more meaningful categories providing better inline validation and error hinting and while couldn't do much about its stratospheric size - we did make it more logical to use and as a result it's improved appication numbers significantly.

case-study-selby-application-form-medium.jpg
Rebuilding one of the longest forms we've ever seen.

Pulling the project together

With the rebuild and prototyping/iteration taking place quickly and frequently we still find there's occasionally a need to create visuals to present to other stakeholders who are less involved in the day to day running of the project.

We don't feel it's necessarily a bad thing to put together a visual snapshot of a project. As long as it's clear it's a snapshot of a specific page at a specific time and size then we've found it helps ease the project along.

Homepage layout
An overview of the homepage layout provided as a visual to help demostrate the final application of brand assets onto the prototypes

The rebuilt website launched in early 2015 and has been well recieved by prospective students, staff and other visitors and we've continued to work closely with the Selby College team to add on more sections, content and improve performance.

Outcomes

The website now generates significantly more course applications across all study areas and visitors report in feedback that it's now a great deal easier to search for and locate specific course content.

Offroadcode Ltd was commissioned by Selby College to develop a bespoke website that was both engaging and accessible to all of the college’s target markets. We also wanted the facility to be easy to maintain by the marketing aswell as other department staff.


A small but expanding team of committed professionals, Offroadcode Ltd were friendly, dedicated, knowledgeable and clearly keen to provide a world-class service all within budget and the timescales set.


From the initial meeting through to the final review and sign off stage, Offroadcode developed the website to our exact specifications and have since gone on to continue to develop the site updating it annually on the college’s behalf.


I have no hesitation recommending Offroadcode Ltd to any organisation wanting to develop workable website solutions.

-Robert Tansey. Director of Marketing and Learner Services, Selby College

External related content

Featured Work

Olympic Holidays

umbraco, ReactJS, Development, Design

Olympic Holidays Booking Engine

Design, ReactJS, Development

Cutting Edge Knives

Design, eCommerce, Umbraco

Selby College

Design, Development, Umbraco

Nu-Way

Design, Development, Umbraco

Hillsong Church

Front End Development, Umbraco, eCommerce

Hi, I'm James

Want to chat about a project?

I'm proud of what the Offroadcode team have designed and built for our clients and the results their projects get and how they help their customers and visitors achieve their goals. 

Looking to talk about your project or want to hear more about what we can do help you? 

Send me an email or give me a call on +44 (0)1484 643078