Inspiring the next generation of engineers

How do you make the best use of great content?

This is Engineering really shines on social media. The team have created terrific videos, and they’ve got an amazing library of photography. But the website was little more than a hub for this great content – there was no journey or destination. Getting young people to engage was the real challenge.

For most people, the job title isn’t why they choose a career – they care about what they’ll be doing and the impact they’ll have. This is even more important to young people today; starting with job roles and qualifications just wasn’t going to land. So we showcased fascinating people and amazing engineering projects.

Any talk from teachers and adults took a step back and we put the inspirational and aspirational content front and centre. Then we showed our users how they can make a career in engineering a reality, whatever their learning preference or background.

This approach was reflected in a simplified site structure. We prioritised the content young people needed and deprioritised everything else. This continued on to the page level. We cut away anything that wasn’t directly relevant. We also made sure the content was chunked into easily digestible bite-sized pieces.

But there was another user journey that was just as important. If someone arrives at a specific page – via social media, for example – what happens next? What are the next steps? If we’ve got them curious about a career in engineering, how do they proceed from here?

By answering those questions, we made sure there were no dead ends.

How do you design for a young audience?

On this project, we worked with existing brand guidelines. Ripping everything out and starting from scratch wasn’t an option. Instead, we needed to make sure our changes worked with the already-established design language of the campaign.

Working with Clearleft on our new This is Engineering website was a smooth process from start to finish. Communication was clear throughout and the team gave us regular updates through the delivery of a weekly postcard to show their progress. They worked iteratively and in the open, were responsive to feedback and responded to our queries promptly.

We wanted to make sure our work was appropriate for the audience. But none of us are teenagers. Instead of pretending to understand what works for young people, we talked to them.

Luckily for us, the Royal Academy of Engineering already runs market research sessions on a regular basis. We were able to add our questions to those sessions.

But we also wanted to stress test our work in a hands-on way. Usually, we’d do one-on-one usability testing, but that wasn’t feasible – the timelines of school holidays and exams would make that very tricky. So we went where our audience was. We coordinated with schools to run in-person sessions in Hassocks and at The Portsmouth Academy.

First, we ran the initial designs past a room full of young students. As hoped, they were forthright with their opinions. Fortunately, their responses validated that we were on the right track. We turned those designs into production code.

We revisited the schools when we had the website closer to completion. Once again, we got the unvarnished truth, which was exactly what we wanted. And once again, we received valuable confirmation that what we had built was working for this audience.

To use the parlance of the people we talked to… the site slays.

Best of all, we saw how people from under-represented groups responded to seeing people like them in engineering careers.

It’s good to see South Asian girls there. I’ve never seen anyone from my culture doing that.

How do you work best with the people behind the campaign?

The website for This is Engineering needed to be:

1. attractive,

2. easy to navigate on the front-end, and

3. easy to update on the back-end.

As well as writing the front-end code for the website in HTML, CSS, and JavaScript, we also built the back-end. With the previous site, the Academy team were stifled by a simple and rigid format that hindered creativity. The Academy team is making fantastic inspiring content; we needed to make sure the content management system didn’t limit them getting that content onto the website.

Using Umbraco CMS, we optimised the back-end for the content creators and editors. We created a system offering full editorial control over a page’s layout by using a page builder. The team can access over a dozen bespoke content types that have been designed and built to work together, regardless of how they are laid out on a page. This gives maximum flexibility while allowing the content to shine.

There are a lot of different types of engineering jobs that I didn’t know about. Before I saw this I thought engineering meant you had to get your hands dirty.

We're better together

The client really responded to our process of showing work early and often. There were no big reveals. We had a continuous feedback cycle. They articulated any concerns clearly, and we worked with them.

When we say we worked with the team from This is Engineering, we really mean it. It felt like we were on one team. On the Clearleft side, we were so impressed by the client’s expertise and domain knowledge. Meanwhile, they trusted our design and development experience.

When we launched the website, there was a bittersweet feeling. On the one hand, we all loved working with such great people on an important mission. On the other hand, launching the website meant that our time together was done. It felt like the band was breaking up.

If there’s a young person in your life who perhaps hasn’t previously considered a career in engineering, tell them about thisisengineering.org.uk. We’re proud to have played a part in it.