Back to Blog

Ocado Technology releases major update to Code for Life website and teaching materials

Ocado Technology releases major update to Code for Life website and teaching materials

“The kids love it! They all want to move onto the next level, they want to be further on than anyone else.” – Mandy, ICT teacher

“You can hit all of the computing curriculum, in a structured way. It is perfect for teachers who are struggling.” – Rob, ICT teacher

“When I came across Code for Life, I thought, yeah, that fits in well, but to have the assessment, that’s great!” – Dale, IT technician

When we met Mandy, Rob, Dale and hundreds of other ICT and computer science teachers, the UK government had recently added computing to the national curriculum for students as young as five. This was an ambitious initiative that aimed to address the skills gap between the number of jobs available in the technology sector and the people qualified to fill them.

However, teaching computing to young students can be a very challenging task, particularly when starting from scratch. It was clear that they needed help – and they needed it fast.

Luckily, a group of volunteers from Ocado Technology immediately responded to the call and created Rapid Router, a free and open source game that makes learning to code easy and fun.

Students start out with simple instructions and sequences that help a delivery truck reach a destination safely on a map; these recipes then evolve into algorithms and sequences of Python code, quickly turning students into programming aficionados.

Over the past year, we’ve been working to refine the game as well as the free teaching materials available, including lessons plans, classroom activities and video tutorials.

The team has been conducting user research with the help of several teachers, leading to a better understanding of changes to make to the website and the game. For instance, several user personas were created to help define teachers’ needs.

Teacher persona

One of the most important changes to tackle was to better help the teachers make sense of our wealth of teaching materials, and provide them with better ways of helping the children.

After completing an extensive user research project, we came out with a much better understanding of how teachers have been using the Code for Life portal and resources, and the Rapid Router game.

Here is a list of what we’ve changed:


Updating the logo and homepage

One of  the first things we wanted to do was to give our logo a facelift. We wanted to keep the hexagon shape but we changed the typeface to a more friendly, readable style.


Old vs new: the Code for Life logo

After the new logo was completed, it was time to rework the Code for Life homepage.

Many users told us they felt the portal was too cluttered and did not offer clear, useful information; plus, quite a few found the grey theme unappealing and outdated. Users also didn’t know where to go from the main page and couldn’t easily access our games and teaching materials.

Homepage comparison

Old vs new: the homepage

To improve the user experience, we made a number of visual changes so that the website looks more enticing for both teachers and students (and also provides more pointers to potential users and contributors).

Hopefully, the new design is more welcoming and clearly directs students and teachers alike to their respective interest areas.


Improved access to teacher resources

We’ve improved the teaching resources page and features, making it easier for the teachers to find the resources they need quickly. It’s now easier to look for key stage related materials and the PDFs are now embedded in a web viewer, allowing the teachers to preview all materials before downloading them.

The video tutorials are also easier to find! We’ve also included a Related documents section on each page to ease the navigation between related teaching materials.

Teaching materials comparison

Old vs new: The teaching materials page

We provided a clear path for teachers and students, both in terms of registration and login. We replaced the Teach | Play | Login header with more succinct registration and login links for teachers and students, respectively.

Log in page comparison

Old vs new: the login page

The previous on-boarding was unclear for new users; they didn’t know how far along they were in the process, for instance. We now have a step by step process to show the user where they are at each stage in the journey and make it easier to manage their classes. We are planning to add more features later to streamline this even further, such as the ability to add or invite other teachers to a school.

Dashboard comparison

Old vs new: The teacher dashboard page

A new feature now available to teachers (and only to teachers!) is the Solution Loader. A new button on the left menu is accessible to teachers, allowing them to quickly load a solution for all Rapid Router levels!

Solution solve example

We worked on the responsiveness of our webpage design after our analytics and user research revealed that tablets are used by a lot of schools.

Tablet screen shot

An example of how Code for Life displays on tablet devices

We are also currently working on reworking other pages, such as the landing page for our games as seen in the above screenshot.

We’re really excited to reveal the new Code for Life portal and can’t wait to hear from you, our users. Tell us what you think about the new website on social media or drop us a message through our contact page.

Celine Boudier, Code for Life Team Leader

Scroll Up