watermark

Helping a supportive organisation to improve resource delivery through design

Homepage Redesign in Drupal

Code Enigma provided UX and design ideas for a new homepage. These focussed on the STEM’s mission. It aims to be the largest provider of education and careers support in science, technology, engineering and mathematics.

Three user groups highlighted that the homepage is the start of their journey. As the existing homepage had been designed in 2014, it focused on news and STEM Learning offerings. We wanted to show how STEM Learning helps teachers, employers and ambassadors.

 

The homepage before the design work:

The homepage prior to design

 

Technical design summary

The UX work on the homepage redesigns started some time ago. We all wanted to update the homepage, but the budget and content were not high priorities. With this in mind, we formulated a few designs. We devised content focussing on the three user groups and how they use the site.

In June 2018 testing completed. As as a result, the design structure was signed off in the following January. So we started with typical content. Then we had signoff to get a simple (updatable and adaptable) homepage live for UX testing.

The original homepage used Blocks, Panels and Nodequeues to assemble a front page. This was difficult for editors to use, making the homepage feel stale.

We created a new content type for the homepage. Also, we used field collection and simple fields to make it more editor-friendly. This also allowed us to easily add new features to the homepage.

 

The homepage after design work:

The homepage after the design work

“The new homepage looks really great! It brings a much fresher look and feel to the website. Since all the images and text are customisable, the communications team are really happy that they can change what they want without having to ask. I've also had rave reviews about how easy to use this content page is, thanks to Justine organising it a really simple way.”

Rebecca - Online Product Officer