To date almost 400 people have been directly engaged in the research and prototyping phases of the website redevelopment project. This has involved a cross section of stakeholders including undergraduate prospects, postgraduate students, teachers, businesses and members of our executive and senior management team.
Input from users has been the driving force behind the activities undertaken and the decisions made in the project so far.
- 4 design sprints
- 8 workshops
- 40 internal participants
- 50+ interviews
- 280 test participants
The reason for such an intensive research phase is to make sure that the decisions we make are driven by the audiences that use our website.
Testing, testing
Once we had a bunch of research (slight understatement!), we started developing ideas of what we thought we needed to change. These ideas were born from the research and workshops carried out – but we had to test our ideas and assumptions with website users.
One of the key areas we thoroughly tested was the development of the information architecture of the new website.
Enter Wikipedia…
“Information architecture (IA) is the structural design of shared information environments; the art and science of organizing and labelling websites, intranets, online communities and software to support usability and findability; and an emerging community of practice focused on bringing principles of design and architecture to the digital landscape.”
We have used a number of techniques during this process.
We ran a card sorting exercise with website users initially. This process asked participants to sort website content into logical groups from their point of view – where they would expect to find the content, what they would expect to see in the same area and what they would expect that section of the website to be called.
This informed the next stage – tree testing. This process allowed us to explore how easy, or difficult, it was for users to find the right content. Testing the existing website structure against the proposed new structure gave us some tangible data to inform our next steps.
We will explore the results in more depth in a further post. Suffice to say this process has resulted in a structure that sees a far higher success rate with users finding the right content in the right places.
One of the interesting dynamics that has been added in to the mix has been the Brand development project that has been running in parallel to this project. As a result of this we now have a modern and flexible range of assets and visual devices that will enable us to create a vibrant, confident and exciting website.
Website design concepts
Research, check. User testing, check. New brand, check.
Now it’s time for some concepts. At this stage they are just visuals intended to represent how different components can be used to build pages. These concepts are now being built into a HTML/CSS front-end.
Homepage concept
First lets look at how the homepage will look. You will notice some key features and functionality here:
- Search is front and centre – we are putting a great deal of work into the search functionality as it is so critical to the user journey. We’re working on the technical side of this at the moment, more details will be revealed soon!
- The whole page will be in line with the new brand with a clean yet bold design.
- The priority actions are very prominent, searching for a course and booking an open day are two of our top tasks that users wish to complete. Content relevant to other stakeholders will also be accessible from here.
Landing page concept
Across the website we will have a lot of options as to how we use elements on different page types. We will be developing rules about what should be used where to ensure consistency, but we are very excited about the flexibility that the new brand brings, and how this has been imagined in the website concepts.
- Big powerful imagery can be used in page heroes. At the same time there are a number of patterns which could be used in place of this image where needed. We don’t have to use an image for image’s sake.
- Key call to actions will be displayed, depending on the subject matter of the content or the section it appears in. In this example a business call to action is being used.
- Various on-page elements will indicate where the user is in the site structure.
- Continuation of the bold yet clean look and feel.
Course pages
Last but definitely not least, we come to the course pages. These are arguably the most important content type on our website, as a result these are getting a significantly brighter and bolder look.
- Clear call to actions throughout the page, most notably for open days and submitting an application.
- Striking imagery at the top of the page with the optional use of patterns to make the area more interesting.
- Re-imagined approach to displaying the key course information.
- All sections of the page clearly accessible from the outset to improve the user experience.
While this has been a very quick run through, I wanted to ensure everyone can see that there is significant forward momentum on this project. We have some tough timescales to meet but to give you an idea of some of the actions in progress, here’s what we’re working on now (or will be soon!):
- Continuing with the front-end build
- Building this in the new version of TerminalFour on a completley new server
- Drawing up a plan for, and delivering, the content migration
- Formalising and launching a new content strategy
- Implementation of a new site governance system
- Procurement of an enterprise search solution.
Needless to say this project is keeping the team quite busy.